diff --git a/.coderabbit.yaml b/.coderabbit.yaml
index 35c5d31183..c7488db5dd 100644
--- a/.coderabbit.yaml
+++ b/.coderabbit.yaml
@@ -15,6 +15,11 @@ reviews:
       - github-actions[bot]
   pre_merge_checks:
     override_requested_reviewers_only: true
+    # Explicitly disable the built-in docstring coverage check, which is
+    # enabled via organization-level settings. This repo opts out at the
+    # repo level without affecting other org repos.
+    docstrings:
+      mode: 'off'
     custom_checks:
       - name: End-to-end regression coverage for fixes
         mode: error
diff --git a/.github/workflows/ci-tests-e2e-coverage.yaml b/.github/workflows/ci-tests-e2e-coverage.yaml
index 246b551917..5e5583fe51 100644
--- a/.github/workflows/ci-tests-e2e-coverage.yaml
+++ b/.github/workflows/ci-tests-e2e-coverage.yaml
@@ -85,6 +85,16 @@ jobs:
             fi
           done
 
+      - name: Strip non-source entries from coverage
+        if: steps.coverage-shards.outputs.has-coverage == 'true'
+        run: |
+          # Drop served bundle scripts (localhost-8188/assets/*.js) that V8 records but have no source file on disk, which would abort genhtml.
+          lcov --remove coverage/playwright/coverage.lcov \
+            '*localhost-8188*' \
+            -o coverage/playwright/coverage.lcov \
+            --ignore-errors unused
+          wc -l coverage/playwright/coverage.lcov
+
       - name: Upload merged coverage data
         if: steps.coverage-shards.outputs.has-coverage == 'true'
         uses: actions/upload-artifact@v6
diff --git a/.github/workflows/cla.yml b/.github/workflows/cla.yml
new file mode 100644
index 0000000000..01a26f7cb9
--- /dev/null
+++ b/.github/workflows/cla.yml
@@ -0,0 +1,63 @@
+name: CLA Assistant
+
+on:
+  issue_comment:
+    types: [created]
+  pull_request_target:
+    types: [opened, synchronize, closed]
+  merge_group:
+
+permissions:
+  actions: write
+  contents: read # 'read' is enough because signatures live in a REMOTE repo
+  pull-requests: write
+  statuses: write
+
+jobs:
+  cla-assistant:
+    runs-on: ubuntu-latest
+    steps:
+      - name: CLA Assistant
+        # Run on PR events, on "recheck" comment, or when someone posts the exact signing phrase.
+        # IMPORTANT: this phrase must match `custom-pr-sign-comment` below.
+        if: >
+          github.event_name == 'pull_request_target' ||
+          github.event.comment.body == 'recheck' ||
+          github.event.comment.body == 'I have read and agree to the Contributor License Agreement'
+        uses: contributor-assistant/github-action@ca4a40a7d1004f18d9960b404b97e5f30a505a08 # v2.6.1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          # PAT required to write to the centralized signatures repo.
+          PERSONAL_ACCESS_TOKEN: ${{ secrets.PERSONAL_ACCESS_TOKEN }}
+        with:
+          # Where the CLA document lives (shown to contributors)
+          path-to-document: https://github.com/Comfy-Org/comfy-cla/blob/main/comfyui_icla.md
+
+          # Centralized signature storage
+          remote-organization-name: comfy-org
+          remote-repository-name: comfy-cla
+          path-to-signatures: signatures/cla.json
+          branch: main
+
+          # Allowlist bots so they don't need to sign (optional, comma-separated).
+          # *[bot] is a catch-all for any GitHub App bot account.
+          allowlist: actions-user,ampagent,claude,coderabbitai[bot],comfy-pr-bot,dependabot[bot],github-actions[bot],copilot-swe-agent[bot],devin-ai-integration[bot],*[bot]
+
+          # Custom PR comment messages
+          custom-notsigned-prcomment: |
+            🎉 Thank you for your contribution, we really appreciate it! 🎉
+
+            Like many open source projects, we require contributors to sign our [Contributor License Agreement (CLA)](https://github.com/Comfy-Org/comfy-cla/blob/main/comfyui_icla.md). A CLA makes the ownership of contributions explicit, so contributors and the project share a clear understanding of how the code can be used. By signing, you:
+
+            - Confirm that you own your contribution.
+            - Keep the right to reuse your own code.
+            - Grant us a copyright license to include and share it within our projects.
+
+            CLAs are standard practice across major open source projects including those under the Apache Software Foundation and the Linux Foundation. Ours is based on the Apache Software Foundation's CLA. Most importantly, it would enable us to relicense the project under a more permissive license in the future, giving the project and its community greater flexibility.
+
+            ✍ **To sign, please post a new comment on this PR with exactly the following text:** ✍
+
+          custom-pr-sign-comment: I have read and agree to the Contributor License Agreement
+
+          custom-allsigned-prcomment: |
+            ✅ All contributors have signed the CLA. Thank you! This PR is ready to be merged.
diff --git a/.storybook/main.ts b/.storybook/main.ts
index 0c576b0bde..afbdbca499 100644
--- a/.storybook/main.ts
+++ b/.storybook/main.ts
@@ -78,6 +78,11 @@ const config: StorybookConfig = {
             find: '@/composables/queue/useJobActions',
             replacement: process.cwd() + '/src/storybook/mocks/useJobActions.ts'
           },
+          {
+            find: '@/composables/billing/useBillingContext',
+            replacement:
+              process.cwd() + '/src/storybook/mocks/useBillingContext.ts'
+          },
           {
             find: '@/utils/formatUtil',
             replacement:
diff --git a/apps/website/e2e/pricing.spec.ts b/apps/website/e2e/pricing.spec.ts
index 05520f0e5b..20ae747242 100644
--- a/apps/website/e2e/pricing.spec.ts
+++ b/apps/website/e2e/pricing.spec.ts
@@ -1,4 +1,5 @@
 import { expect } from '@playwright/test'
+import type { Page } from '@playwright/test'
 
 import { test } from './fixtures/blockExternalMedia'
 
@@ -7,36 +8,27 @@ test.describe('Pricing page @smoke', () => {
     await page.goto('/cloud/pricing')
   })
 
-  test('shows the three paid tiers and Enterprise', async ({ page }) => {
-    const pricingGrid = page
-      .locator('section', {
-        has: page.getByRole('heading', { name: /Pricing/i })
-      })
-      .locator('.lg\\:grid')
+  const pricingSection = (page: Page) =>
+    page.locator('section').filter({
+      has: page.getByRole('heading', { name: /Choose a plan/i })
+    })
 
-    for (const label of ['STANDARD', 'CREATOR', 'PRO']) {
+  test('shows the three paid tiers and Enterprise', async ({ page }) => {
+    const section = pricingSection(page)
+
+    for (const label of ['STANDARD', 'CREATOR', 'PRO', 'ENTERPRISE']) {
       await expect(
-        pricingGrid.locator('span', { hasText: new RegExp(`^${label}$`) })
+        section.locator('span', { hasText: new RegExp(`^${label}$`) })
       ).toBeVisible()
     }
-
-    await expect(
-      page.getByRole('heading', { name: /Looking for Enterprise Solutions/i })
-    ).toBeVisible()
   })
 
   test('does not show the Free tier when SHOW_FREE_TIER is disabled', async ({
     page
   }) => {
-    const pricingGrid = page
-      .locator('section', {
-        has: page.getByRole('heading', { name: /Pricing/i })
-      })
-      .locator('.lg\\:grid')
+    const section = pricingSection(page)
 
-    await expect(
-      pricingGrid.locator('span', { hasText: /^FREE$/ })
-    ).toHaveCount(0)
+    await expect(section.locator('span', { hasText: /^FREE$/ })).toHaveCount(0)
     await expect(page.getByRole('link', { name: /^START FREE$/ })).toHaveCount(
       0
     )
diff --git a/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-1-sm-visual-linux.png b/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-1-sm-visual-linux.png
index 367013862f..5220b6d864 100644
Binary files a/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-1-sm-visual-linux.png and b/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-1-sm-visual-linux.png differ
diff --git a/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-2-md-visual-linux.png b/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-2-md-visual-linux.png
index 81af53c23e..0164519b68 100644
Binary files a/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-2-md-visual-linux.png and b/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-2-md-visual-linux.png differ
diff --git a/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-3-lg-visual-linux.png b/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-3-lg-visual-linux.png
index 8bf7c36cd9..ee19a54955 100644
Binary files a/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-3-lg-visual-linux.png and b/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-3-lg-visual-linux.png differ
diff --git a/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-4-xl-visual-linux.png b/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-4-xl-visual-linux.png
index b6ba02ec4b..e715fc3d4d 100644
Binary files a/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-4-xl-visual-linux.png and b/apps/website/e2e/visual-responsive.spec.ts-snapshots/pricing-tiers-4-xl-visual-linux.png differ
diff --git a/apps/website/src/components/blocks/FAQSplit01.vue b/apps/website/src/components/blocks/FAQSplit01.vue
index 6cc804df82..0a3f93372b 100644
--- a/apps/website/src/components/blocks/FAQSplit01.vue
+++ b/apps/website/src/components/blocks/FAQSplit01.vue
@@ -1,28 +1,15 @@
 <script setup lang="ts">
-import { cn } from '@comfyorg/tailwind-utils'
-import { reactive, watch } from 'vue'
+import Accordion from '../ui/accordion/Accordion.vue'
+import AccordionContent from '../ui/accordion/AccordionContent.vue'
+import AccordionItem from '../ui/accordion/AccordionItem.vue'
+import AccordionTrigger from '../ui/accordion/AccordionTrigger.vue'
 
 type Faq = { id: string; question: string; answer: string }
 
-const { faqs } = defineProps<{
+defineProps<{
   heading: string
   faqs: readonly Faq[]
 }>()
-
-const expanded = reactive<boolean[]>(faqs.map(() => false))
-
-watch(
-  () => faqs.length,
-  (length) => {
-    if (length === expanded.length) return
-    expanded.length = 0
-    for (let i = 0; i < length; i += 1) expanded.push(false)
-  }
-)
-
-function toggle(index: number) {
-  expanded[index] = !expanded[index]
-}
 </script>
 
 <template>
@@ -38,57 +25,23 @@ function toggle(index: number) {
       </div>
 
       <!-- Right FAQ list -->
-      <div class="flex-1">
-        <div
+      <Accordion type="multiple" class="flex-1">
+        <AccordionItem
           v-for="(faq, index) in faqs"
           :key="faq.id"
-          class="border-b border-primary-comfy-canvas/20"
+          :value="faq.id"
         >
-          <button
-            :id="`faq-trigger-${faq.id}`"
-            type="button"
-            :aria-expanded="expanded[index]"
-            :aria-controls="`faq-panel-${faq.id}`"
-            :class="
-              cn(
-                'flex w-full cursor-pointer items-center justify-between text-left',
-                index === 0 ? 'pb-6' : 'py-6'
-              )
-            "
-            @click="toggle(index)"
-          >
-            <span
-              :class="
-                cn(
-                  'text-lg font-light md:text-xl',
-                  expanded[index]
-                    ? 'text-primary-comfy-yellow'
-                    : 'text-primary-comfy-canvas'
-                )
-              "
-            >
-              {{ faq.question }}
-            </span>
-            <span
-              class="text-primary-comfy-yellow ml-4 shrink-0 text-2xl"
-              aria-hidden="true"
-            >
-              {{ expanded[index] ? '−' : '+' }}
-            </span>
-          </button>
-          <section
-            v-show="expanded[index]"
-            :id="`faq-panel-${faq.id}`"
-            role="region"
-            :aria-labelledby="`faq-trigger-${faq.id}`"
-            class="pb-6"
-          >
-            <p class="text-sm whitespace-pre-line text-primary-comfy-canvas/70">
-              {{ faq.answer }}
-            </p>
-          </section>
-        </div>
-      </div>
+          <AccordionTrigger :class="index === 0 ? 'pt-0' : ''">
+            {{ faq.question }}
+          </AccordionTrigger>
+          <AccordionContent>
+            <p
+              class="text-sm whitespace-pre-line text-primary-comfy-canvas/70"
+              v-html="faq.answer"
+            />
+          </AccordionContent>
+        </AccordionItem>
+      </Accordion>
     </div>
   </section>
 </template>
diff --git a/apps/website/src/components/common/CallToActionSection.vue b/apps/website/src/components/common/CallToActionSection.vue
index 64735595ad..0a3e6411ec 100644
--- a/apps/website/src/components/common/CallToActionSection.vue
+++ b/apps/website/src/components/common/CallToActionSection.vue
@@ -25,7 +25,7 @@ const {
   <section class="max-w-9xl mx-auto px-6 py-20 lg:py-32">
     <div class="flex flex-col items-center text-center">
       <h2
-        class="text-primary-comfy-canvas max-w-5xl text-3xl font-light tracking-tight lg:text-5xl"
+        class="max-w-5xl text-3xl font-light tracking-tight text-primary-comfy-canvas lg:text-5xl"
       >
         {{ t(headingKey, locale) }}
       </h2>
diff --git a/apps/website/src/components/common/EventsSection.vue b/apps/website/src/components/common/EventsSection.vue
index 147e32c9dd..b0c21d557a 100644
--- a/apps/website/src/components/common/EventsSection.vue
+++ b/apps/website/src/components/common/EventsSection.vue
@@ -40,12 +40,12 @@ const {
       <div class="grid grid-cols-1 gap-12 lg:grid-cols-2 lg:gap-16">
         <div class="flex flex-col gap-8">
           <h2
-            class="text-primary-comfy-canvas text-4xl font-light tracking-tight lg:text-6xl"
+            class="text-4xl font-light tracking-tight text-primary-comfy-canvas lg:text-6xl"
           >
             {{ t(headingKey, locale) }}
           </h2>
           <p
-            class="text-primary-comfy-canvas max-w-sm text-sm/relaxed lg:text-base"
+            class="max-w-sm text-sm/relaxed text-primary-comfy-canvas lg:text-base"
           >
             {{ t(descriptionKey, locale) }}
           </p>
@@ -66,10 +66,10 @@ const {
             v-for="(event, i) in events"
             :key="i"
             :href="event.href"
-            class="group border-primary-comfy-canvas/15 flex items-center gap-4 border-b py-6 lg:gap-8"
+            class="group flex items-center gap-4 border-b border-primary-comfy-canvas/15 py-6 lg:gap-8"
           >
             <span
-              class="text-primary-comfy-canvas shrink-0 text-sm font-medium"
+              class="shrink-0 text-sm font-medium text-primary-comfy-canvas"
             >
               {{ event.label[locale] }}
             </span>
diff --git a/apps/website/src/components/common/SiteFooter.vue b/apps/website/src/components/common/SiteFooter.vue
index 6ab92728c5..65726471ae 100644
--- a/apps/website/src/components/common/SiteFooter.vue
+++ b/apps/website/src/components/common/SiteFooter.vue
@@ -109,7 +109,7 @@ const contactColumn: { title: string; links: FooterLink[] } = {
 <template>
   <footer
     ref="footerRef"
-    class="bg-primary-comfy-ink text-primary-comfy-canvas px-6 py-8 lg:px-20"
+    class="bg-primary-comfy-ink px-6 py-8 text-primary-comfy-canvas lg:px-20"
   >
     <div
       class="border-primary-warm-gray grid gap-12 border-t pt-16 lg:grid-cols-2 lg:gap-4"
diff --git a/apps/website/src/components/gallery/GalleryCard.vue b/apps/website/src/components/gallery/GalleryCard.vue
index 95549ca15d..b79ff9f63c 100644
--- a/apps/website/src/components/gallery/GalleryCard.vue
+++ b/apps/website/src/components/gallery/GalleryCard.vue
@@ -53,7 +53,7 @@ defineEmits<{ click: [] }>()
         <div class="flex w-full items-end justify-between p-4">
           <div class="gap-2">
             <p class="text-sm font-bold text-white">{{ item.title }}</p>
-            <p class="text-primary-comfy-canvas text-xs">
+            <p class="text-xs text-primary-comfy-canvas">
               <GalleryItemAttribution :item :locale />
             </p>
           </div>
@@ -82,7 +82,7 @@ defineEmits<{ click: [] }>()
     <!-- Mobile metadata -->
     <div v-if="mobile" class="mt-2 gap-2">
       <p class="text-sm font-bold text-white">{{ item.title }}</p>
-      <p class="text-primary-comfy-canvas text-xs">
+      <p class="text-xs text-primary-comfy-canvas">
         <GalleryItemAttribution :item :locale />
       </p>
     </div>
diff --git a/apps/website/src/components/learning/HeroSection.vue b/apps/website/src/components/learning/HeroSection.vue
index 8b5655464e..007e8d5b96 100644
--- a/apps/website/src/components/learning/HeroSection.vue
+++ b/apps/website/src/components/learning/HeroSection.vue
@@ -11,7 +11,7 @@ const { locale = 'en' } = defineProps<{ locale?: Locale }>()
     class="max-w-9xl mx-auto flex flex-col items-center px-6 pt-24 pb-12 text-center"
   >
     <h1
-      class="text-primary-comfy-canvas max-w-4xl text-3xl leading-[110%] font-light tracking-tight lg:text-5xl"
+      class="max-w-4xl text-3xl leading-[110%] font-light tracking-tight text-primary-comfy-canvas lg:text-5xl"
     >
       {{ t('learning.heroTitle.before', locale) }}
       <span class="text-primary-comfy-yellow">ComfyUI</span
diff --git a/apps/website/src/components/pricing/FAQSection.vue b/apps/website/src/components/pricing/FAQSection.vue
new file mode 100644
index 0000000000..a5e437745c
--- /dev/null
+++ b/apps/website/src/components/pricing/FAQSection.vue
@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import type { Locale } from '../../i18n/translations'
+
+import FAQSplit01 from '../blocks/FAQSplit01.vue'
+import { pricingFaqs } from '../../data/pricingFaq'
+import { t } from '../../i18n/translations'
+
+const { locale = 'en' } = defineProps<{ locale?: Locale }>()
+
+const faqs = pricingFaqs.map((faq) => ({
+  id: faq.id,
+  question: faq.question[locale],
+  answer: faq.answer[locale]
+}))
+</script>
+
+<template>
+  <FAQSplit01 :heading="t('pricing.faq.heading', locale)" :faqs="faqs" />
+</template>
diff --git a/apps/website/src/components/pricing/PriceSection.vue b/apps/website/src/components/pricing/PriceSection.vue
deleted file mode 100644
index 57d0f87f6e..0000000000
--- a/apps/website/src/components/pricing/PriceSection.vue
+++ /dev/null
@@ -1,393 +0,0 @@
-<script setup lang="ts">
-import type { Locale, TranslationKey } from '../../i18n/translations'
-
-import { cn } from '@comfyorg/tailwind-utils'
-
-import BrandButton from '../common/BrandButton.vue'
-import PricingPlanFeatureList from './PricingPlanFeatureList.vue'
-import PricingTierCard from './PricingTierCard.vue'
-import { SHOW_FREE_TIER } from '../../config/features'
-import { externalLinks, getRoutes } from '../../config/routes'
-import { t } from '../../i18n/translations'
-
-const { locale = 'en' } = defineProps<{ locale?: Locale }>()
-
-function subscribeUrl(tier: string): string {
-  return `${externalLinks.cloud}/cloud/subscribe?tier=${tier}&cycle=monthly`
-}
-
-interface PlanFeature {
-  text: TranslationKey
-}
-
-interface PricingPlan {
-  id: string
-  labelKey: TranslationKey
-  summaryKey: TranslationKey
-  priceKey?: TranslationKey
-  creditsKey?: TranslationKey
-  estimateKey?: TranslationKey
-  ctaKey: TranslationKey
-  ctaHref: string
-  featureIntroKey?: TranslationKey
-  features: PlanFeature[]
-  andMoreKey?: TranslationKey
-  image?: string
-  isPopular?: boolean
-  isEnterprise?: boolean
-}
-
-const freePlan: PricingPlan = {
-  id: 'free',
-  labelKey: 'pricing.plan.free.label',
-  summaryKey: 'pricing.plan.free.summary',
-  priceKey: 'pricing.plan.free.price',
-  creditsKey: 'pricing.plan.free.credits',
-  estimateKey: 'pricing.plan.free.estimate',
-  ctaKey: 'pricing.plan.free.cta',
-  ctaHref: externalLinks.cloud,
-  features: [
-    { text: 'pricing.plan.free.feature1' },
-    { text: 'pricing.plan.free.feature2' }
-  ]
-}
-
-const plans: PricingPlan[] = [
-  ...(SHOW_FREE_TIER ? [freePlan] : []),
-  {
-    id: 'standard',
-    labelKey: 'pricing.plan.standard.label',
-    summaryKey: 'pricing.plan.standard.summary',
-    priceKey: 'pricing.plan.standard.price',
-    creditsKey: 'pricing.plan.standard.credits',
-    estimateKey: 'pricing.plan.standard.estimate',
-    ctaKey: 'pricing.plan.standard.cta',
-    ctaHref: subscribeUrl('standard'),
-    featureIntroKey: SHOW_FREE_TIER
-      ? 'pricing.plan.standard.featureIntro'
-      : undefined,
-    features: [
-      { text: 'pricing.plan.standard.feature1' },
-      { text: 'pricing.plan.standard.feature2' },
-      { text: 'pricing.plan.standard.feature3' }
-    ]
-  },
-  {
-    id: 'creator',
-    labelKey: 'pricing.plan.creator.label',
-    summaryKey: 'pricing.plan.creator.summary',
-    priceKey: 'pricing.plan.creator.price',
-    creditsKey: 'pricing.plan.creator.credits',
-    estimateKey: 'pricing.plan.creator.estimate',
-    ctaKey: 'pricing.plan.creator.cta',
-    ctaHref: subscribeUrl('creator'),
-    featureIntroKey: 'pricing.plan.creator.featureIntro',
-    features: [
-      { text: 'pricing.plan.creator.feature1' },
-      { text: 'pricing.plan.creator.feature2' }
-    ],
-    isPopular: true
-  },
-  {
-    id: 'pro',
-    labelKey: 'pricing.plan.pro.label',
-    summaryKey: 'pricing.plan.pro.summary',
-    priceKey: 'pricing.plan.pro.price',
-    creditsKey: 'pricing.plan.pro.credits',
-    estimateKey: 'pricing.plan.pro.estimate',
-    ctaKey: 'pricing.plan.pro.cta',
-    ctaHref: subscribeUrl('pro'),
-    featureIntroKey: 'pricing.plan.pro.featureIntro',
-    features: [
-      { text: 'pricing.plan.pro.feature1' },
-      { text: 'pricing.plan.pro.feature2' }
-    ]
-  },
-  {
-    id: 'enterprise',
-    labelKey: 'pricing.enterprise.label',
-    summaryKey: 'pricing.enterprise.description',
-    ctaKey: 'pricing.enterprise.cta',
-    ctaHref: getRoutes(locale).cloudEnterprise,
-    features: [],
-    isEnterprise: true
-  }
-]
-
-const standardPlans = plans.filter((p) => !p.isEnterprise)
-const enterprisePlan = plans.find((p) => p.isEnterprise)!
-</script>
-
-<template>
-  <section class="max-w-9xl mx-auto px-4 py-16 lg:px-20 lg:py-14">
-    <!-- Header -->
-    <div class="mx-auto mb-8 max-w-3xl text-center lg:mb-10">
-      <h1
-        class="font-formula text-4xl font-light text-primary-comfy-canvas lg:text-5xl"
-      >
-        {{ t('pricing.title', locale) }}
-      </h1>
-      <p class="mt-3 text-base text-primary-comfy-canvas">
-        {{ t('pricing.subtitle', locale) }}
-      </p>
-    </div>
-
-    <!-- Desktop: dynamic grid (3 or 4 columns) / Mobile: stacked cards -->
-    <div
-      :class="
-        cn(
-          'rounded-5xl bg-transparency-white-t4 hidden p-2 lg:grid lg:gap-2',
-          standardPlans.length === 4 ? 'lg:grid-cols-4' : 'lg:grid-cols-3'
-        )
-      "
-    >
-      <PricingTierCard v-for="plan in standardPlans" :key="plan.id">
-        <!-- Label + badge -->
-        <div class="flex items-center gap-2 px-6 pt-6">
-          <span
-            class="text-primary-comfy-yellow translate-y-0.5 text-base font-bold tracking-wider"
-          >
-            {{ t(plan.labelKey, locale) }}
-          </span>
-          <span v-if="plan.isPopular" class="flex h-5 items-stretch">
-            <img
-              src="/icons/node-left.svg"
-              alt=""
-              class="-mx-px self-stretch"
-              aria-hidden="true"
-            />
-            <span
-              class="bg-primary-comfy-yellow font-formula-narrow flex items-center px-2 text-sm font-bold tracking-wider text-primary-comfy-ink"
-            >
-              <span class="ppformula-text-center">
-                {{ t('pricing.badge.popular', locale) }}
-              </span>
-            </span>
-            <img
-              src="/icons/node-right.svg"
-              alt=""
-              class="-mx-px self-stretch"
-              aria-hidden="true"
-            />
-          </span>
-        </div>
-
-        <!-- Summary -->
-        <p class="px-6 text-sm text-primary-comfy-canvas">
-          {{ t(plan.summaryKey, locale) }}
-        </p>
-
-        <!-- Price -->
-        <div v-if="plan.priceKey" class="flex items-baseline gap-1 px-6 pt-2">
-          <span
-            class="font-formula text-5xl font-light text-primary-comfy-canvas"
-          >
-            {{ t(plan.priceKey, locale) }}
-          </span>
-          <span class="text-sm text-primary-comfy-canvas">
-            {{ t('pricing.plan.period', locale) }}
-          </span>
-        </div>
-        <div v-else class="px-6 pt-2" />
-
-        <!-- Credits -->
-        <p
-          v-if="plan.creditsKey"
-          class="px-6 text-sm text-primary-comfy-canvas"
-        >
-          {{ t(plan.creditsKey, locale) }}
-        </p>
-        <div v-else class="px-6" />
-
-        <!-- Estimate -->
-        <p
-          v-if="plan.estimateKey"
-          class="px-6 text-xs text-primary-comfy-canvas/80"
-        >
-          {{ t(plan.estimateKey, locale) }}
-        </p>
-        <div v-else class="px-6" />
-
-        <!-- Features -->
-        <div v-if="plan.features.length" class="px-6 py-3">
-          <p
-            v-if="plan.featureIntroKey"
-            class="mb-2 text-sm font-semibold text-primary-comfy-canvas"
-          >
-            {{ t(plan.featureIntroKey, locale) }}
-          </p>
-          <ul class="space-y-2">
-            <li
-              v-for="feature in plan.features"
-              :key="feature.text"
-              class="flex items-start gap-2"
-            >
-              <span class="text-primary-comfy-yellow mt-0.5 text-sm">✓</span>
-              <span class="text-sm text-primary-comfy-canvas">
-                {{ t(feature.text, locale) }}
-              </span>
-            </li>
-          </ul>
-        </div>
-        <!-- CTA -->
-        <div class="flex self-end px-6">
-          <BrandButton
-            :href="plan.ctaHref"
-            variant="outline"
-            size="sm"
-            class="w-full text-center"
-          >
-            {{ t(plan.ctaKey, locale) }}
-          </BrandButton>
-        </div>
-      </PricingTierCard>
-    </div>
-
-    <!-- Mobile: stacked plans -->
-    <div class="flex flex-col gap-8 lg:hidden">
-      <div v-for="plan in plans" :key="plan.id" class="flex flex-col">
-        <!-- Main info card -->
-        <div class="bg-transparency-white-t4 rounded-3xl p-6">
-          <!-- Label + badge -->
-          <div class="flex items-center gap-2">
-            <span
-              class="text-primary-comfy-yellow text-xs font-bold tracking-wider"
-            >
-              {{ t(plan.labelKey, locale) }}
-            </span>
-            <span v-if="plan.isPopular" class="flex h-5 items-stretch">
-              <img
-                src="/icons/node-left.svg"
-                alt=""
-                class="-mx-px self-stretch"
-                aria-hidden="true"
-              />
-              <span
-                class="bg-primary-comfy-yellow flex items-center px-2 text-[10px] font-bold tracking-wider text-primary-comfy-ink"
-              >
-                <span class="ppformula-text-center">
-                  {{ t('pricing.badge.popular', locale) }}
-                </span>
-              </span>
-              <img
-                src="/icons/node-right.svg"
-                alt=""
-                class="-mx-px self-stretch"
-                aria-hidden="true"
-              />
-            </span>
-          </div>
-
-          <!-- Enterprise heading -->
-          <h2
-            v-if="plan.isEnterprise"
-            class="mt-3 text-2xl font-light text-primary-comfy-canvas"
-          >
-            {{ t('pricing.enterprise.heading', locale) }}
-          </h2>
-
-          <!-- Summary -->
-          <p class="mt-2 text-sm text-primary-comfy-canvas">
-            {{ t(plan.summaryKey, locale) }}
-          </p>
-
-          <!-- Price (standard plans only) -->
-          <template v-if="plan.priceKey">
-            <div class="mt-6 flex items-baseline gap-1">
-              <span
-                class="font-formula text-5xl font-light text-primary-comfy-canvas"
-              >
-                {{ t(plan.priceKey, locale) }}
-              </span>
-              <span class="text-sm text-primary-comfy-canvas/55">
-                {{ t('pricing.plan.period', locale) }}
-              </span>
-            </div>
-
-            <p
-              v-if="plan.creditsKey"
-              class="mt-4 text-xs font-medium text-primary-comfy-canvas"
-            >
-              {{ t(plan.creditsKey, locale) }}
-            </p>
-
-            <p
-              v-if="plan.estimateKey"
-              class="mt-2 text-xs text-primary-comfy-canvas"
-            >
-              {{ t(plan.estimateKey, locale) }}
-            </p>
-          </template>
-
-          <!-- CTA -->
-          <div class="mt-6">
-            <BrandButton
-              :href="plan.ctaHref"
-              variant="outline"
-              size="lg"
-              class="w-full text-center"
-            >
-              {{ t(plan.ctaKey, locale) }}
-            </BrandButton>
-          </div>
-        </div>
-
-        <!-- Features card -->
-        <div
-          v-if="plan.features.length"
-          class="bg-transparency-white-t4 mt-2 rounded-3xl p-6"
-        >
-          <PricingPlanFeatureList
-            :features="plan.features"
-            :feature-intro-key="plan.featureIntroKey"
-            :and-more-key="plan.andMoreKey"
-            :locale
-          />
-        </div>
-
-        <!-- Image (standard plans only) -->
-        <div v-if="plan.image" class="mt-2">
-          <img
-            :src="plan.image"
-            :alt="t(plan.labelKey, locale)"
-            class="aspect-21/9 w-full rounded-3xl object-cover"
-          />
-        </div>
-      </div>
-    </div>
-
-    <!-- Enterprise section (desktop only, mobile handled in plan loop) -->
-    <div
-      class="bg-transparency-white-t4 rounded-5xl mt-8 hidden w-full flex-col p-2 lg:mt-8 lg:flex lg:flex-row"
-    >
-      <!-- Left side -->
-      <div
-        class="rounded-4.5xl flex w-full flex-col items-start justify-between gap-8 bg-primary-comfy-ink p-8"
-      >
-        <div>
-          <span
-            class="text-primary-comfy-yellow text-xs font-bold tracking-wider"
-          >
-            {{ t(enterprisePlan.labelKey, locale) }}
-          </span>
-          <h2
-            class="mt-3 text-2xl font-light text-primary-comfy-canvas lg:text-3xl"
-          >
-            {{ t('pricing.enterprise.heading', locale) }}
-          </h2>
-          <p class="mt-3 text-sm text-primary-comfy-canvas">
-            {{ t(enterprisePlan.summaryKey, locale) }}
-          </p>
-        </div>
-        <BrandButton :href="enterprisePlan.ctaHref" variant="outline" size="lg">
-          {{ t(enterprisePlan.ctaKey, locale) }}
-        </BrandButton>
-      </div>
-    </div>
-
-    <!-- Footnote -->
-    <p class="mt-12 text-xs text-primary-comfy-canvas/70">
-      {{ t('pricing.footnote', locale) }}
-    </p>
-  </section>
-</template>
diff --git a/apps/website/src/components/pricing/PricingCard.vue b/apps/website/src/components/pricing/PricingCard.vue
new file mode 100644
index 0000000000..1c8c762931
--- /dev/null
+++ b/apps/website/src/components/pricing/PricingCard.vue
@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from 'vue'
+
+import { cn } from '@comfyorg/tailwind-utils'
+
+const { class: className } = defineProps<{
+  class?: HTMLAttributes['class']
+}>()
+</script>
+
+<template>
+  <div :class="cn('rounded-4.5xl bg-primary-comfy-ink p-8', className)">
+    <slot />
+  </div>
+</template>
diff --git a/apps/website/src/components/pricing/PricingCredits.vue b/apps/website/src/components/pricing/PricingCredits.vue
new file mode 100644
index 0000000000..1c3fd33efe
--- /dev/null
+++ b/apps/website/src/components/pricing/PricingCredits.vue
@@ -0,0 +1,43 @@
+<script setup lang="ts">
+import type { Locale, TranslationKey } from '../../i18n/translations'
+import { computed } from 'vue'
+
+import { Component as ComponentIcon } from '@lucide/vue'
+
+import { t } from '../../i18n/translations'
+
+const {
+  locale = 'en',
+  estimateKey,
+  estimateCount
+} = defineProps<{
+  credits: string
+  label: string
+  estimateKey?: TranslationKey
+  estimateCount?: string
+  locale?: Locale
+}>()
+
+const estimate = computed(() => {
+  if (!estimateKey) return undefined
+  const text = t(estimateKey, locale)
+  return estimateCount ? text.replace('{count}', estimateCount) : text
+})
+</script>
+
+<template>
+  <div class="mt-6">
+    <div class="flex items-center gap-2">
+      <ComponentIcon class="text-primary-comfy-orange size-4 shrink-0" />
+      <span class="text-primary-warm-white ppformula-text-center text-sm">
+        <span class="font-extrabold">
+          {{ credits }}
+        </span>
+        {{ label }}
+      </span>
+    </div>
+    <p v-if="estimate" class="text-primary-warm-gray mt-1.5 px-6 text-xs">
+      {{ estimate }}
+    </p>
+  </div>
+</template>
diff --git a/apps/website/src/components/pricing/PricingEnterpriseBand.vue b/apps/website/src/components/pricing/PricingEnterpriseBand.vue
new file mode 100644
index 0000000000..43b1bd8b36
--- /dev/null
+++ b/apps/website/src/components/pricing/PricingEnterpriseBand.vue
@@ -0,0 +1,34 @@
+<script setup lang="ts">
+import type { Locale } from '../../i18n/translations'
+import { computed } from 'vue'
+
+import { getRoutes } from '../../config/routes'
+import { t } from '../../i18n/translations'
+import Button from '../ui/button/Button.vue'
+import PricingCard from './PricingCard.vue'
+import PricingPlanLabel from './PricingPlanLabel.vue'
+
+const { locale = 'en' } = defineProps<{
+  locale?: Locale
+}>()
+
+const ctaHref = computed(() => getRoutes(locale).contact)
+</script>
+
+<template>
+  <PricingCard class="col-span-full">
+    <div class="grid grid-cols-1 gap-6 lg:grid-cols-3 lg:gap-20">
+      <div
+        class="flex flex-col gap-6 lg:col-span-2 lg:flex-row lg:items-center"
+      >
+        <PricingPlanLabel :label="t('pricing.enterprise.label', locale)" />
+        <p class="text-primary-warm-white text-sm">
+          {{ t('pricing.enterprise.description', locale) }}
+        </p>
+      </div>
+      <Button :href="ctaHref" variant="outline">
+        {{ t('pricing.enterprise.cta', locale) }}
+      </Button>
+    </div>
+  </PricingCard>
+</template>
diff --git a/apps/website/src/components/pricing/PricingPlanFeatureList.vue b/apps/website/src/components/pricing/PricingPlanFeatureList.vue
index b70bde26e9..4253928478 100644
--- a/apps/website/src/components/pricing/PricingPlanFeatureList.vue
+++ b/apps/website/src/components/pricing/PricingPlanFeatureList.vue
@@ -1,60 +1,81 @@
 <script setup lang="ts">
 import type { Locale, TranslationKey } from '../../i18n/translations'
 
-import { cn } from '@comfyorg/tailwind-utils'
+import { Check, Clock, X } from '@lucide/vue'
 
 import { t } from '../../i18n/translations'
 
+type PlanFeatureType = 'checked' | 'coming'
+
 interface PlanFeature {
   text: TranslationKey
+  type?: PlanFeatureType
+  included?: boolean
 }
 
-const {
-  features,
-  featureIntroKey,
-  nextUpKey,
-  andMoreKey,
-  nextUpClass = 'text-primary-comfy-canvas/80 mt-4 text-sm',
-  andMoreClass = 'text-primary-comfy-canvas mt-4 text-sm',
-  listGap = 'space-y-2',
-  introMargin = 'mb-3',
-  locale = 'en'
-} = defineProps<{
+export interface PlanFeatureGroup {
+  titleKey?: TranslationKey
   features: PlanFeature[]
-  featureIntroKey?: TranslationKey
-  nextUpKey?: TranslationKey
-  andMoreKey?: TranslationKey
-  nextUpClass?: string
-  andMoreClass?: string
-  listGap?: string
-  introMargin?: string
+}
+
+const { locale = 'en' } = defineProps<{
+  features: PlanFeatureGroup[]
   locale?: Locale
 }>()
 </script>
 
 <template>
-  <p
-    v-if="featureIntroKey"
-    :class="cn('text-primary-comfy-canvas text-sm font-semibold', introMargin)"
-  >
-    {{ t(featureIntroKey, locale) }}
-  </p>
-  <ul :class="listGap">
-    <li
-      v-for="feature in features"
-      :key="feature.text"
-      class="flex items-start gap-2"
+  <div class="flex flex-col gap-5">
+    <div
+      v-for="(group, groupIndex) in features"
+      :key="group.titleKey ?? groupIndex"
+      class="flex flex-col gap-2"
     >
-      <span class="text-primary-comfy-yellow mt-0.5 text-sm">✓</span>
-      <span class="text-primary-comfy-canvas text-sm">
-        {{ t(feature.text, locale) }}
-      </span>
-    </li>
-  </ul>
-  <p v-if="nextUpKey" :class="nextUpClass">
-    {{ t(nextUpKey, locale) }}
-  </p>
-  <p v-if="andMoreKey" :class="andMoreClass">
-    {{ t(andMoreKey, locale) }}
-  </p>
+      <p v-if="group.titleKey" class="text-sm text-primary-comfy-canvas">
+        {{ t(group.titleKey, locale) }}
+      </p>
+      <ul class="space-y-2">
+        <li
+          v-for="feature in group.features"
+          :key="feature.text"
+          class="flex items-start gap-2"
+        >
+          <Clock
+            v-if="feature.type === 'coming'"
+            class="text-primary-warm-gray mt-0.5 size-4 shrink-0"
+            aria-hidden="true"
+          />
+          <Check
+            v-else-if="feature.included !== false"
+            class="text-primary-comfy-yellow mt-0.5 size-4 shrink-0"
+            aria-hidden="true"
+          />
+          <X
+            v-else
+            class="mt-0.5 size-4 shrink-0 text-primary-comfy-canvas/40"
+            aria-hidden="true"
+          />
+          <span class="sr-only">
+            {{
+              feature.type === 'coming'
+                ? t('pricing.plan.feature.status.coming', locale)
+                : feature.included === false
+                  ? t('pricing.plan.feature.status.notIncluded', locale)
+                  : t('pricing.plan.feature.status.included', locale)
+            }}:
+          </span>
+          <span
+            class="ppformula-text-center text-sm"
+            :class="
+              feature.type === 'coming' || feature.included === false
+                ? 'text-primary-warm-gray'
+                : 'text-primary-warm-white'
+            "
+          >
+            {{ t(feature.text, locale) }}
+          </span>
+        </li>
+      </ul>
+    </div>
+  </div>
 </template>
diff --git a/apps/website/src/components/pricing/PricingPlanLabel.vue b/apps/website/src/components/pricing/PricingPlanLabel.vue
new file mode 100644
index 0000000000..d89e0f5a59
--- /dev/null
+++ b/apps/website/src/components/pricing/PricingPlanLabel.vue
@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from 'vue'
+
+import { cn } from '@comfyorg/tailwind-utils'
+
+const { class: className } = defineProps<{
+  label: string
+  class?: HTMLAttributes['class']
+}>()
+</script>
+
+<template>
+  <span
+    :class="
+      cn(
+        'text-primary-comfy-yellow text-base font-bold tracking-wider uppercase',
+        className
+      )
+    "
+  >
+    {{ label }}
+  </span>
+</template>
diff --git a/apps/website/src/components/pricing/PricingPrice.vue b/apps/website/src/components/pricing/PricingPrice.vue
new file mode 100644
index 0000000000..b5b7ba6c4f
--- /dev/null
+++ b/apps/website/src/components/pricing/PricingPrice.vue
@@ -0,0 +1,67 @@
+<script setup lang="ts">
+import type { Locale } from '../../i18n/translations'
+import { computed } from 'vue'
+
+import { t } from '../../i18n/translations'
+
+const {
+  locale = 'en',
+  billingPeriod,
+  yearlyTotal
+} = defineProps<{
+  price: string
+  period: string
+  originalPrice?: string
+  discount?: string
+  billingPeriod?: 'monthly' | 'yearly'
+  yearlyTotal?: string
+  locale?: Locale
+}>()
+
+const billingNote = computed(() => {
+  if (billingPeriod === 'yearly' && yearlyTotal) {
+    return t('pricing.period.billedYearly', locale).replace(
+      '{total}',
+      yearlyTotal
+    )
+  }
+  if (billingPeriod === 'monthly') {
+    return t('pricing.period.billedMonthly', locale)
+  }
+  return undefined
+})
+</script>
+
+<template>
+  <div>
+    <div class="mt-6 flex items-baseline gap-2">
+      <span class="font-formula text-5xl font-light text-primary-comfy-canvas">
+        {{ price }}
+      </span>
+      <div class="flex gap-2 max-sm:flex-col">
+        <div class="flex items-baseline gap-2">
+          <span
+            v-if="originalPrice"
+            class="font-formula text-primary-warm-gray text-sm font-light line-through"
+          >
+            {{ originalPrice }}
+          </span>
+          <span class="text-primary-warm-white text-sm">
+            {{ period }}
+          </span>
+        </div>
+
+        <span
+          class="text-primary-comfy-yellow text-sm max-sm:text-xs sm:ml-2"
+          :class="{ 'opacity-0': !discount }"
+          :aria-hidden="!discount || undefined"
+        >
+          {{ discount || ' ' }}
+        </span>
+      </div>
+    </div>
+    <p v-if="billingNote" class="text-primary-warm-gray mt-2 text-sm">
+      {{ billingNote }}
+    </p>
+  </div>
+</template>
diff --git a/apps/website/src/components/pricing/PricingSection.vue b/apps/website/src/components/pricing/PricingSection.vue
new file mode 100644
index 0000000000..35e2b9c17e
--- /dev/null
+++ b/apps/website/src/components/pricing/PricingSection.vue
@@ -0,0 +1,143 @@
+<script setup lang="ts">
+import type { Locale, TranslationKey } from '../../i18n/translations'
+
+import { cn } from '@comfyorg/tailwind-utils'
+import { ref } from 'vue'
+
+import { pricingPlans } from '../../data/pricingPlans'
+import type { BillingCycle, PricingPlan } from '../../data/pricingPlans'
+import { t } from '../../i18n/translations'
+import Badge from '../ui/badge/Badge.vue'
+import Button from '../ui/button/Button.vue'
+import ToggleGroup from '../ui/toggle-group/ToggleGroup.vue'
+import ToggleGroupItem from '../ui/toggle-group/ToggleGroupItem.vue'
+import PricingCard from './PricingCard.vue'
+import PricingCredits from './PricingCredits.vue'
+import PricingEnterpriseBand from './PricingEnterpriseBand.vue'
+import PricingPlanFeatureList from './PricingPlanFeatureList.vue'
+import PricingPlanLabel from './PricingPlanLabel.vue'
+import PricingPrice from './PricingPrice.vue'
+import PricingTeamCard from './PricingTeamCard.vue'
+
+const { locale = 'en' } = defineProps<{ locale?: Locale }>()
+
+const billingPeriod = ref<BillingCycle>('yearly')
+
+function displayPriceKey(plan: PricingPlan): TranslationKey | undefined {
+  if (billingPeriod.value === 'yearly' && plan.yearlyPriceKey) {
+    return plan.yearlyPriceKey
+  }
+  return plan.priceKey
+}
+</script>
+
+<template>
+  <section class="max-w-9xl mx-auto px-4 py-16 lg:px-20 lg:py-14">
+    <!-- Header -->
+    <div class="mx-auto mb-8 max-w-3xl text-center lg:mb-10">
+      <h1
+        class="font-formula text-4xl font-light text-primary-comfy-canvas lg:text-5xl"
+      >
+        {{ t('pricing.title', locale) }}
+      </h1>
+      <p
+        class="mx-auto mt-3 max-w-xl text-base text-pretty text-primary-comfy-canvas"
+      >
+        {{ t('pricing.subtitle', locale) }}
+      </p>
+    </div>
+
+    <div class="flex items-center justify-center pb-16">
+      <ToggleGroup v-model="billingPeriod" type="single">
+        <ToggleGroupItem value="monthly" class="min-w-48">
+          {{ t('pricing.period.monthly', locale) }}
+        </ToggleGroupItem>
+        <ToggleGroupItem value="yearly" class="min-w-48">
+          {{ t('pricing.period.yearly', locale) }}
+        </ToggleGroupItem>
+      </ToggleGroup>
+    </div>
+
+    <!-- Desktop: dynamic grid (3 or 4 columns) / Mobile: stacked cards -->
+    <div
+      :class="
+        cn(
+          'rounded-5xl bg-transparency-white-t4 grid gap-2 p-2 max-lg:mx-auto max-lg:max-w-lg',
+          pricingPlans.length === 4 ? 'lg:grid-cols-4' : 'lg:grid-cols-3'
+        )
+      "
+    >
+      <PricingCard
+        v-for="plan in pricingPlans"
+        :key="plan.id"
+        class="row-span-7 grid grid-rows-subgrid"
+      >
+        <!-- Label + badge -->
+        <div class="flex items-center gap-4">
+          <PricingPlanLabel
+            :label="t(plan.labelKey, locale)"
+            class="ppformula-text-center text-base uppercase"
+          />
+          <Badge v-if="plan.isPopular" variant="callout">
+            {{ t('pricing.badge.popular', locale) }}</Badge
+          >
+        </div>
+
+        <!-- Price -->
+        <PricingPrice
+          v-if="displayPriceKey(plan)"
+          :price="t(displayPriceKey(plan)!, locale)"
+          :period="t('pricing.plan.period', locale)"
+          :original-price="
+            billingPeriod === 'yearly' && plan.yearlyPriceKey && plan.priceKey
+              ? t(plan.priceKey, locale)
+              : undefined
+          "
+          :billing-period="billingPeriod"
+          :yearly-total="
+            plan.yearlyTotalKey ? t(plan.yearlyTotalKey, locale) : undefined
+          "
+          :locale
+        />
+
+        <!-- Features -->
+        <div v-if="plan.features.length" class="mt-8">
+          <PricingPlanFeatureList
+            :features="[{ features: plan.features }]"
+            :locale
+          />
+        </div>
+
+        <!-- Credits -->
+        <PricingCredits
+          v-if="plan.creditsKey"
+          :credits="t(plan.creditsKey, locale)"
+          :label="t('pricing.creditsLabel', locale)"
+          :estimate-key="plan.estimateKey"
+          :locale
+        />
+
+        <!-- CTA -->
+        <div class="mt-8 flex self-end">
+          <Button
+            :href="plan.ctaHref(billingPeriod)"
+            as="a"
+            variant="outline"
+            class="w-full text-center"
+          >
+            {{ t(plan.ctaKey, locale) }}
+          </Button>
+        </div>
+      </PricingCard>
+
+      <PricingTeamCard :billing-period="billingPeriod" :locale />
+
+      <PricingEnterpriseBand :locale />
+    </div>
+
+    <!-- Footnote -->
+    <p class="mt-12 text-xs text-primary-comfy-canvas/70">
+      {{ t('pricing.footnote', locale) }}
+    </p>
+  </section>
+</template>
diff --git a/apps/website/src/components/pricing/PricingTeamCard.vue b/apps/website/src/components/pricing/PricingTeamCard.vue
new file mode 100644
index 0000000000..67f5e2f7bd
--- /dev/null
+++ b/apps/website/src/components/pricing/PricingTeamCard.vue
@@ -0,0 +1,171 @@
+<script setup lang="ts">
+import type { Locale } from '../../i18n/translations'
+import type { PlanFeatureGroup } from './PricingPlanFeatureList.vue'
+import { computed, ref } from 'vue'
+
+import { Component as ComponentIcon } from '@lucide/vue'
+
+import { subscribeUrl } from '../../data/pricingPlans'
+import {
+  formatTeamCreditsLong,
+  formatTeamCreditsShort,
+  teamCreditTiers
+} from '../../data/teamCreditTiers'
+import { t } from '../../i18n/translations'
+import Button from '../ui/button/Button.vue'
+import Slider from '../ui/slider/Slider.vue'
+import PricingCard from './PricingCard.vue'
+import PricingCredits from './PricingCredits.vue'
+import PricingPlanFeatureList from './PricingPlanFeatureList.vue'
+import PricingPlanLabel from './PricingPlanLabel.vue'
+import PricingPrice from './PricingPrice.vue'
+
+const { locale = 'en', billingPeriod } = defineProps<{
+  billingPeriod: 'monthly' | 'yearly'
+  locale?: Locale
+}>()
+
+const teamCreditTierIndex = ref<number[]>([2])
+
+const selectedTeamTier = computed(
+  () => teamCreditTiers[teamCreditTierIndex.value[0] ?? 0]
+)
+const selectedTeamPrice = computed(() =>
+  billingPeriod === 'yearly'
+    ? selectedTeamTier.value.yearlyPrice
+    : selectedTeamTier.value.monthlyPrice
+)
+
+function fmtPrice(n: number): string {
+  return `$${n.toLocaleString('en-US')}`
+}
+
+const teamSaving = computed<string | undefined>(() => {
+  const base = selectedTeamTier.value.basePrice
+  const discounted = selectedTeamPrice.value
+  if (base === discounted) return undefined
+  const pct = ((base - discounted) / base) * 100
+  return t('pricing.savePercent', locale)
+    .replace('{pct}', String(pct))
+    .replace('{amount}', fmtPrice(base - discounted))
+})
+
+const featureGroups: PlanFeatureGroup[] = [
+  {
+    titleKey: 'pricing.plan.team.everythingInProPlus',
+    features: [
+      { text: 'pricing.feature.inviteMembers' },
+      { text: 'pricing.feature.concurrentWorkflows' },
+      { text: 'pricing.feature.sharedCreditPool' },
+      { text: 'pricing.feature.roleBasedPermissions' }
+    ]
+  },
+  {
+    titleKey: 'pricing.plan.team.comingSoon',
+    features: [
+      { text: 'pricing.plan.team.sharedWorkflowsAndAssets', type: 'coming' },
+      { text: 'pricing.plan.team.projects', type: 'coming' }
+    ]
+  }
+]
+
+const ctaHref = computed(() =>
+  subscribeUrl(
+    'team',
+    billingPeriod,
+    `team_${selectedTeamTier.value.basePrice}`
+  )
+)
+</script>
+
+<template>
+  <PricingCard class="col-span-full">
+    <div class="grid grid-cols-1 gap-10 lg:grid-cols-3 lg:gap-20">
+      <div class="lg:col-span-2 lg:max-w-xl">
+        <div
+          class="ppformula-text-center flex flex-col items-start gap-2 lg:flex-row lg:items-center lg:gap-4"
+        >
+          <PricingPlanLabel :label="t('pricing.plan.team.label', locale)" />
+          <p class="text-primary-warm-gray text-sm">
+            {{ t('pricing.team.description', locale) }}
+          </p>
+        </div>
+
+        <PricingPrice
+          :price="fmtPrice(selectedTeamPrice)"
+          :period="t('pricing.plan.period', locale)"
+          :original-price="
+            selectedTeamTier.basePrice !== selectedTeamPrice
+              ? fmtPrice(selectedTeamTier.basePrice)
+              : undefined
+          "
+          :discount="teamSaving"
+          :billing-period="billingPeriod"
+          :yearly-total="fmtPrice(selectedTeamPrice * 12)"
+          :locale
+        />
+
+        <div class="mt-6">
+          <Slider
+            v-model="teamCreditTierIndex"
+            class="w-full"
+            :min="0"
+            :max="teamCreditTiers.length - 1"
+            :step="1"
+            :ticks="teamCreditTiers.length"
+          />
+          <div class="relative mt-3 h-6">
+            <div
+              v-for="(tier, i) in teamCreditTiers"
+              :key="tier.credits"
+              :class="[
+                'absolute top-0 inline-flex items-center gap-1.5',
+                'max-lg:-translate-x-[calc(50%-8px)]'
+              ]"
+              :style="{
+                left: `calc(${i / (teamCreditTiers.length - 1)} * (100% - 16px))`
+              }"
+            >
+              <ComponentIcon
+                class="hidden size-4 shrink-0 lg:block"
+                :class="
+                  i === teamCreditTierIndex[0]
+                    ? 'text-primary-comfy-orange'
+                    : 'text-primary-warm-gray'
+                "
+              />
+              <span
+                class="text-sm max-sm:text-[10px]"
+                :class="
+                  i === teamCreditTierIndex[0]
+                    ? 'text-primary-warm-white'
+                    : 'text-primary-warm-gray'
+                "
+              >
+                {{ formatTeamCreditsShort(tier.credits) }}
+              </span>
+            </div>
+          </div>
+        </div>
+
+        <PricingCredits
+          :credits="formatTeamCreditsLong(selectedTeamTier.credits)"
+          :label="t('pricing.creditsLabel', locale)"
+          estimate-key="pricing.team.videosEstimate"
+          :estimate-count="selectedTeamTier.videos.toLocaleString('en-US')"
+          :locale
+        />
+      </div>
+
+      <div>
+        <PricingPlanFeatureList :features="featureGroups" :locale />
+
+        <div class="mt-8">
+          <Button :href="ctaHref" class="w-full" variant="outline">
+            {{ t('pricing.plan.team.cta', locale) }}
+          </Button>
+        </div>
+      </div>
+    </div>
+  </PricingCard>
+</template>
diff --git a/apps/website/src/components/pricing/PricingTierCard.vue b/apps/website/src/components/pricing/PricingTierCard.vue
deleted file mode 100644
index d6ccde9143..0000000000
--- a/apps/website/src/components/pricing/PricingTierCard.vue
+++ /dev/null
@@ -1,7 +0,0 @@
-<template>
-  <div
-    class="bg-primary-comfy-ink rounded-4.5xl row-span-7 grid grid-rows-subgrid pb-3"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/apps/website/src/components/pricing/WhatsIncludedSection.vue b/apps/website/src/components/pricing/WhatsIncludedSection.vue
index 90d4eb97c7..e34c0c9d74 100644
--- a/apps/website/src/components/pricing/WhatsIncludedSection.vue
+++ b/apps/website/src/components/pricing/WhatsIncludedSection.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
 import type { Locale, TranslationKey } from '../../i18n/translations'
+import { Clock } from '@lucide/vue'
+
 import { t } from '../../i18n/translations'
 import CheckIcon from '../icons/CheckIcon.vue'
 
@@ -54,11 +56,7 @@ const features: IncludedFeature[] = [
   },
   {
     titleKey: 'pricing.included.feature11.title',
-    descriptionKey: 'pricing.included.feature11.description'
-  },
-  {
-    titleKey: 'pricing.included.feature12.title',
-    descriptionKey: 'pricing.included.feature12.description',
+    descriptionKey: 'pricing.included.feature11.description',
     isComingSoon: true
   }
 ]
@@ -92,11 +90,9 @@ const features: IncludedFeature[] = [
         >
           <!-- Title -->
           <div class="flex items-start gap-3">
-            <img
+            <Clock
               v-if="feature.isComingSoon"
-              src="/icons/clock.svg"
-              alt=""
-              class="mt-0.5 size-4 shrink-0"
+              class="mt-0.5 size-4 shrink-0 text-primary-comfy-canvas/55"
               aria-hidden="true"
             />
             <CheckIcon
@@ -105,6 +101,12 @@ const features: IncludedFeature[] = [
             />
             <p class="text-sm font-medium text-primary-comfy-canvas">
               {{ t(feature.titleKey, locale) }}
+              <span
+                v-if="feature.isComingSoon"
+                class="block text-primary-comfy-canvas/55"
+              >
+                {{ t('pricing.included.comingSoon', locale) }}
+              </span>
             </p>
           </div>
 
diff --git a/apps/website/src/components/ui/accordion/Accordion.vue b/apps/website/src/components/ui/accordion/Accordion.vue
new file mode 100644
index 0000000000..6e3dcd9ace
--- /dev/null
+++ b/apps/website/src/components/ui/accordion/Accordion.vue
@@ -0,0 +1,16 @@
+<script setup lang="ts">
+/* eslint-disable vue/no-unused-properties -- props forwarded via useForwardPropsEmits */
+import type { AccordionRootEmits, AccordionRootProps } from 'reka-ui'
+import { AccordionRoot, useForwardPropsEmits } from 'reka-ui'
+
+const props = defineProps<AccordionRootProps>()
+const emits = defineEmits<AccordionRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
+</script>
+
+<template>
+  <AccordionRoot v-slot="slotProps" data-slot="accordion" v-bind="forwarded">
+    <slot v-bind="slotProps" />
+  </AccordionRoot>
+</template>
diff --git a/apps/website/src/components/ui/accordion/AccordionContent.vue b/apps/website/src/components/ui/accordion/AccordionContent.vue
new file mode 100644
index 0000000000..f1e4050b97
--- /dev/null
+++ b/apps/website/src/components/ui/accordion/AccordionContent.vue
@@ -0,0 +1,26 @@
+<script setup lang="ts">
+/* eslint-disable vue/no-unused-properties -- props forwarded via v-bind */
+import type { AccordionContentProps } from 'reka-ui'
+import type { HTMLAttributes } from 'vue'
+import { cn } from '@comfyorg/tailwind-utils'
+import { reactiveOmit } from '@vueuse/core'
+import { AccordionContent } from 'reka-ui'
+
+const props = defineProps<
+  AccordionContentProps & { class?: HTMLAttributes['class'] }
+>()
+
+const delegatedProps = reactiveOmit(props, 'class')
+</script>
+
+<template>
+  <AccordionContent
+    data-slot="accordion-content"
+    v-bind="delegatedProps"
+    class="overflow-hidden data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
+  >
+    <div :class="cn('pt-0 pb-6', props.class)">
+      <slot />
+    </div>
+  </AccordionContent>
+</template>
diff --git a/apps/website/src/components/ui/accordion/AccordionItem.vue b/apps/website/src/components/ui/accordion/AccordionItem.vue
new file mode 100644
index 0000000000..59c65add47
--- /dev/null
+++ b/apps/website/src/components/ui/accordion/AccordionItem.vue
@@ -0,0 +1,29 @@
+<script setup lang="ts">
+/* eslint-disable vue/no-unused-properties -- props forwarded via useForwardProps */
+import type { AccordionItemProps } from 'reka-ui'
+import type { HTMLAttributes } from 'vue'
+import { cn } from '@comfyorg/tailwind-utils'
+import { reactiveOmit } from '@vueuse/core'
+import { AccordionItem, useForwardProps } from 'reka-ui'
+
+const props = defineProps<
+  AccordionItemProps & { class?: HTMLAttributes['class'] }
+>()
+
+const delegatedProps = reactiveOmit(props, 'class')
+
+const forwardedProps = useForwardProps(delegatedProps)
+</script>
+
+<template>
+  <AccordionItem
+    v-slot="slotProps"
+    data-slot="accordion-item"
+    v-bind="forwardedProps"
+    :class="
+      cn('border-b border-primary-comfy-canvas/20 last:border-b-0', props.class)
+    "
+  >
+    <slot v-bind="slotProps" />
+  </AccordionItem>
+</template>
diff --git a/apps/website/src/components/ui/accordion/AccordionTrigger.vue b/apps/website/src/components/ui/accordion/AccordionTrigger.vue
new file mode 100644
index 0000000000..b8ae074dd2
--- /dev/null
+++ b/apps/website/src/components/ui/accordion/AccordionTrigger.vue
@@ -0,0 +1,43 @@
+<script setup lang="ts">
+/* eslint-disable vue/no-unused-properties -- props forwarded via v-bind */
+import type { AccordionTriggerProps } from 'reka-ui'
+import type { HTMLAttributes } from 'vue'
+import { Minus } from '@lucide/vue'
+import { cn } from '@comfyorg/tailwind-utils'
+import { reactiveOmit } from '@vueuse/core'
+import { AccordionHeader, AccordionTrigger } from 'reka-ui'
+
+const props = defineProps<
+  AccordionTriggerProps & { class?: HTMLAttributes['class'] }
+>()
+
+const delegatedProps = reactiveOmit(props, 'class')
+</script>
+
+<template>
+  <AccordionHeader class="flex">
+    <AccordionTrigger
+      data-slot="accordion-trigger"
+      v-bind="delegatedProps"
+      :class="
+        cn(
+          'data-[state=open]:text-primary-comfy-yellow focus-visible:border-primary-comfy-yellow/50 focus-visible:ring-primary-comfy-yellow/50 flex flex-1 cursor-pointer items-center justify-between gap-4 py-6 text-left text-lg font-light text-primary-comfy-canvas transition-all outline-none focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-50 md:text-xl',
+          props.class
+        )
+      "
+    >
+      <slot />
+      <slot name="icon">
+        <span
+          aria-hidden="true"
+          class="in-data-[state=open]:text-primary-comfy-yellow relative ml-4 size-6 shrink-0 text-primary-comfy-canvas"
+        >
+          <Minus class="pointer-events-none absolute inset-0 size-6" />
+          <Minus
+            class="pointer-events-none absolute inset-0 size-6 rotate-90 transition-transform duration-300 ease-out in-data-[state=open]:rotate-0"
+          />
+        </span>
+      </slot>
+    </AccordionTrigger>
+  </AccordionHeader>
+</template>
diff --git a/apps/website/src/components/ui/badge/index.ts b/apps/website/src/components/ui/badge/index.ts
index 9409498153..ed28e17adf 100644
--- a/apps/website/src/components/ui/badge/index.ts
+++ b/apps/website/src/components/ui/badge/index.ts
@@ -8,7 +8,9 @@ export const badgeVariants = cva({
       default: 'bg-transparency-ink-t80',
       subtle: 'bg-transparency-white-t4 text-primary-comfy-canvas',
       accent:
-        'before:bg-primary-comfy-yellow relative isolate overflow-visible rounded-none bg-transparent px-2 py-0.5 text-[9px] font-bold tracking-wide text-primary-comfy-ink uppercase before:absolute before:inset-0 before:-z-10 before:-skew-x-12 before:rounded-sm'
+        'before:bg-primary-comfy-yellow relative isolate overflow-visible rounded-none bg-transparent px-2 py-0.5 text-[9px] font-bold tracking-wide text-primary-comfy-ink uppercase before:absolute before:inset-0 before:-z-10 before:-skew-x-12 before:rounded-sm',
+      callout:
+        'before:bg-primary-comfy-plum text-primary-warm-white relative isolate overflow-visible rounded-none bg-transparent px-2 py-0.5 text-[9px] font-bold tracking-tight uppercase before:absolute before:inset-0 before:-z-10 before:-skew-x-12 before:rounded-sm'
     },
     size: {
       md: 'px-4 py-1 text-xs',
diff --git a/apps/website/src/components/ui/button/Button.vue b/apps/website/src/components/ui/button/Button.vue
index 52be21d0a5..f2bcfa54ef 100644
--- a/apps/website/src/components/ui/button/Button.vue
+++ b/apps/website/src/components/ui/button/Button.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import type { PrimitiveProps } from 'reka-ui'
-import type { Component, HTMLAttributes } from 'vue'
+import type { AnchorHTMLAttributes, Component, HTMLAttributes } from 'vue'
 import type { ButtonVariants } from '.'
 import { Primitive } from 'reka-ui'
 import { cn } from '@comfyorg/tailwind-utils'
@@ -13,17 +13,19 @@ interface Props extends PrimitiveProps {
   disabled?: boolean
   prependIcon?: Component
   appendIcon?: Component
+  href?: AnchorHTMLAttributes['href']
 }
 
 const {
-  as = 'button',
+  as,
   asChild,
   variant,
   size,
   class: className,
   disabled,
   prependIcon,
-  appendIcon
+  appendIcon,
+  href
 } = defineProps<Props>()
 </script>
 
@@ -32,9 +34,10 @@ const {
     data-slot="button"
     :data-variant="variant"
     :data-size="size"
-    :as
+    :as="as ?? (href != null && !disabled ? 'a' : 'button')"
     :as-child
     :disabled
+    :href="disabled ? undefined : href"
     :class="cn(buttonVariants({ variant, size }), className)"
   >
     <slot name="prepend">
diff --git a/apps/website/src/components/ui/slider/Slider.vue b/apps/website/src/components/ui/slider/Slider.vue
new file mode 100644
index 0000000000..6d4a9b178b
--- /dev/null
+++ b/apps/website/src/components/ui/slider/Slider.vue
@@ -0,0 +1,92 @@
+<script setup lang="ts">
+import type { SliderRootEmits, SliderRootProps } from 'reka-ui'
+import type { HTMLAttributes } from 'vue'
+import { computed } from 'vue'
+import {
+  SliderRange,
+  SliderRoot,
+  SliderThumb,
+  SliderTrack,
+  useForwardPropsEmits
+} from 'reka-ui'
+import { cn } from '@comfyorg/tailwind-utils'
+
+const {
+  class: className,
+  ticks,
+  min = 0,
+  max = 100,
+  ...restProps
+} = defineProps<
+  SliderRootProps & { class?: HTMLAttributes['class']; ticks?: number }
+>()
+const emits = defineEmits<SliderRootEmits>()
+
+const forwarded = useForwardPropsEmits(
+  computed(() => ({ ...restProps, min, max })),
+  emits
+)
+
+function tickValue(i: number): number {
+  return min + ((i - 1) / (ticks! - 1)) * (max - min)
+}
+
+function isTickFilled(
+  i: number,
+  modelValue: number[] | null | undefined
+): boolean {
+  if (!modelValue?.length) return false
+  const value = tickValue(i)
+  if (modelValue.length === 1) return value <= modelValue[0]
+  const sorted = [...modelValue].sort((a, b) => a - b)
+  return value >= sorted[0] && value <= sorted[sorted.length - 1]
+}
+</script>
+
+<template>
+  <SliderRoot
+    v-slot="{ modelValue }"
+    data-slot="slider"
+    :class="
+      cn(
+        'relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col',
+        className
+      )
+    "
+    v-bind="forwarded"
+  >
+    <template v-if="ticks && ticks > 1">
+      <span
+        v-for="i in ticks"
+        :key="i"
+        data-slot="slider-tick"
+        class="pointer-events-none absolute top-1/2 size-2 -translate-1/2 rounded-full"
+        :class="
+          isTickFilled(i, modelValue)
+            ? 'bg-primary-warm-white'
+            : 'bg-primary-warm-gray'
+        "
+        :style="{
+          left: `calc(8px + ${(i - 1) / (ticks - 1)} * (100% - 16px))`
+        }"
+      />
+    </template>
+
+    <SliderTrack
+      data-slot="slider-track"
+      class="bg-primary-warm-gray relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5"
+    >
+      <SliderRange
+        data-slot="slider-range"
+        class="bg-primary-warm-white absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
+      />
+    </SliderTrack>
+
+    <SliderThumb
+      v-for="(_, key) in modelValue"
+      :key="key"
+      data-slot="slider-thumb"
+      class="bg-primary-warm-white border-primary-comfy-yellow ring-primary-comfy-yellow/50 block size-4 shrink-0 rounded-full border shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
+    />
+  </SliderRoot>
+</template>
diff --git a/apps/website/src/components/ui/toggle-group/ToggleGroup.vue b/apps/website/src/components/ui/toggle-group/ToggleGroup.vue
new file mode 100644
index 0000000000..8c79a87e40
--- /dev/null
+++ b/apps/website/src/components/ui/toggle-group/ToggleGroup.vue
@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import type { VariantProps } from 'class-variance-authority'
+import type { ToggleGroupRootEmits, ToggleGroupRootProps } from 'reka-ui'
+import { ToggleGroupRoot, useForwardPropsEmits } from 'reka-ui'
+import type { HTMLAttributes } from 'vue'
+import { computed, provide } from 'vue'
+
+import { cn } from '@comfyorg/tailwind-utils'
+
+import type { toggleVariants } from '@/components/ui/toggle'
+
+type ToggleGroupVariants = VariantProps<typeof toggleVariants>
+
+const {
+  class: className,
+  variant,
+  size,
+  spacing = 0,
+  ...restProps
+} = defineProps<
+  ToggleGroupRootProps & {
+    class?: HTMLAttributes['class']
+    variant?: ToggleGroupVariants['variant']
+    size?: ToggleGroupVariants['size']
+    spacing?: number
+  }
+>()
+
+const emits = defineEmits<ToggleGroupRootEmits>()
+
+provide('toggleGroup', {
+  variant,
+  size,
+  spacing
+})
+
+const forwarded = useForwardPropsEmits(
+  computed(() => ({ ...restProps })),
+  emits
+)
+</script>
+
+<template>
+  <ToggleGroupRoot
+    v-slot="slotProps"
+    data-slot="toggle-group"
+    :data-size="size"
+    :data-variant="variant"
+    :data-spacing="spacing"
+    :style="{
+      '--gap': spacing
+    }"
+    v-bind="forwarded"
+    :class="
+      cn(
+        'group/toggle-group ring-primary-warm-white/20 flex w-fit items-center gap-[--spacing(var(--gap))] rounded-2xl p-1.5 ring-2 data-[spacing=default]:data-[variant=outline]:shadow-xs',
+        className
+      )
+    "
+  >
+    <slot v-bind="slotProps" />
+  </ToggleGroupRoot>
+</template>
diff --git a/apps/website/src/components/ui/toggle-group/ToggleGroupItem.vue b/apps/website/src/components/ui/toggle-group/ToggleGroupItem.vue
new file mode 100644
index 0000000000..72f8f9d527
--- /dev/null
+++ b/apps/website/src/components/ui/toggle-group/ToggleGroupItem.vue
@@ -0,0 +1,56 @@
+<script setup lang="ts">
+import type { VariantProps } from 'class-variance-authority'
+import type { ToggleGroupItemProps } from 'reka-ui'
+import { ToggleGroupItem, useForwardProps } from 'reka-ui'
+import type { HTMLAttributes } from 'vue'
+import { computed, inject } from 'vue'
+
+import { cn } from '@comfyorg/tailwind-utils'
+
+import { toggleVariants } from '@/components/ui/toggle'
+
+type ToggleGroupVariants = VariantProps<typeof toggleVariants> & {
+  spacing?: number
+}
+
+const {
+  class: className,
+  variant,
+  size,
+  ...restProps
+} = defineProps<
+  ToggleGroupItemProps & {
+    class?: HTMLAttributes['class']
+    variant?: ToggleGroupVariants['variant']
+    size?: ToggleGroupVariants['size']
+  }
+>()
+
+const context = inject<ToggleGroupVariants>('toggleGroup')
+
+const forwardedProps = useForwardProps(computed(() => ({ ...restProps })))
+</script>
+
+<template>
+  <ToggleGroupItem
+    v-slot="slotProps"
+    data-slot="toggle-group-item"
+    :data-variant="context?.variant || variant"
+    :data-size="context?.size || size"
+    :data-spacing="context?.spacing"
+    v-bind="forwardedProps"
+    :class="
+      cn(
+        toggleVariants({
+          variant: context?.variant || variant,
+          size: context?.size || size
+        }),
+        'w-auto min-w-0 shrink-0 px-3 focus:z-10 focus-visible:z-10',
+        'data-[spacing=0]:rounded-none data-[spacing=0]:shadow-none data-[spacing=0]:first:rounded-l-xl data-[spacing=0]:last:rounded-r-xl data-[spacing=0]:data-[variant=outline]:border-l-0 data-[spacing=0]:data-[variant=outline]:first:border-l',
+        className
+      )
+    "
+  >
+    <slot v-bind="slotProps" />
+  </ToggleGroupItem>
+</template>
diff --git a/apps/website/src/components/ui/toggle/index.ts b/apps/website/src/components/ui/toggle/index.ts
new file mode 100644
index 0000000000..22a3fd50d7
--- /dev/null
+++ b/apps/website/src/components/ui/toggle/index.ts
@@ -0,0 +1,20 @@
+import { cva } from 'class-variance-authority'
+
+export const toggleVariants = cva(
+  "data-[state=on]:bg-primary-comfy-yellow focus-visible:border-primary-comfy-orange focus-visible:ring-primary-comfy-yellow aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive hover:text-primary-warm-white inline-flex items-center justify-center gap-2 rounded-xl text-xs font-bold whitespace-nowrap uppercase transition-[color,box-shadow] duration-300 outline-none focus-visible:ring-3 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:text-primary-comfy-ink [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        default:
+          'bg-transparency-white-t4 text-primary-warm-gray hover:cursor-pointer'
+      },
+      size: {
+        default: 'h-9 min-w-20 px-4'
+      }
+    },
+    defaultVariants: {
+      variant: 'default',
+      size: 'default'
+    }
+  }
+)
diff --git a/apps/website/src/data/pricingFaq.ts b/apps/website/src/data/pricingFaq.ts
new file mode 100644
index 0000000000..af67b73519
--- /dev/null
+++ b/apps/website/src/data/pricingFaq.ts
@@ -0,0 +1,167 @@
+import type { LocalizedText } from '../i18n/translations'
+
+interface PricingFaq {
+  id: string
+  question: LocalizedText
+  answer: LocalizedText
+}
+
+export const pricingFaqs: readonly PricingFaq[] = [
+  {
+    id: 'how-does-pricing-work',
+    question: {
+      en: 'How does Comfy Cloud pricing actually work?',
+      'zh-CN': 'Comfy Cloud 的定价究竟是如何运作的？'
+    },
+    answer: {
+      en: "Every plan includes a monthly pool of <strong>credits</strong>. Credits are spent on two things: <strong>active GPU time</strong> while a workflow is running, and <strong>Partner Nodes</strong> (proprietary models like Nano Banana Pro). You're never charged for idle time. Building or editing a workflow costs nothing. You only spend while a job is actually running.",
+      'zh-CN':
+        '每个计划都包含每月的<strong>积分</strong>池。积分用于两类消耗：工作流运行时的<strong>活跃 GPU 时间</strong>，以及<strong>合作伙伴节点</strong>（如 Nano Banana Pro 等专有模型）。空闲时间不会计费。构建或编辑工作流完全免费。只有任务真正运行时才会扣费。'
+    }
+  },
+  {
+    id: 'what-is-a-credit-worth',
+    question: {
+      en: "What's a credit worth? How far does it go?",
+      'zh-CN': '一个积分价值多少？能用多久？'
+    },
+    answer: {
+      en: 'Credits map to GPU runtime, so mileage depends on the workflow. As a reference point, a five-second video* uses roughly <strong>11 credits</strong>, so Standard covers a few hundred per month, Creator about double that, and Pro enough for over a thousand.\n\n*Based on 5s videos using the Wan 2.2 Image-to-Video template at default settings (81 frames, 18fps, 640×640, 4-step sampler). Heavier models, higher resolutions, and the inclusion of Partner nodes use more.',
+      'zh-CN':
+        '积分对应 GPU 运行时长，因此具体能用多少取决于工作流本身。作为参考：一段 5 秒视频*大约消耗 <strong>11 积分</strong>，因此 Standard 每月可支持数百段，Creator 约为其两倍，Pro 则足以生成一千多段。\n\n*基于使用 Wan 2.2 图生视频模板在默认设置（81 帧、18fps、640×640、4-step sampler）下生成 5 秒视频的估算。更复杂的模型、更高分辨率以及加入合作伙伴节点会消耗更多积分。'
+    }
+  },
+  {
+    id: 'run-out-of-credits',
+    question: {
+      en: 'What happens when I run out of credits?',
+      'zh-CN': '积分用完了会怎样？'
+    },
+    answer: {
+      en: 'You can buy <strong>top-up credits</strong> at any time without changing plans. Monthly credits are spent first; top-ups are only drawn down once your monthly allowance is used up. Top-up credits stay valid for <strong>1 year</strong> from purchase.',
+      'zh-CN':
+        '您可以随时购买<strong>充值积分</strong>，无需更换计划。月度积分会优先消耗；只有当月度额度用完后，才会开始使用充值积分。充值积分自购买之日起 <strong>1 年</strong>内有效。'
+    }
+  },
+  {
+    id: 'do-credits-roll-over',
+    question: {
+      en: 'Do unused credits roll over?',
+      'zh-CN': '未使用的积分会顺延吗？'
+    },
+    answer: {
+      en: "Monthly plan credits reset each billing cycle and don't roll over. <strong>Top-up credits do persist.</strong> They're valid for a year and aren't affected by your monthly reset. Credits work on Comfy Cloud, and on Comfy Desktop <strong>only when calling Partner Nodes.</strong> Comfy Desktop itself is free.",
+      'zh-CN':
+        '月度计划积分在每个计费周期重置，不会顺延。<strong>但充值积分会保留。</strong>有效期为一年，且不受每月重置的影响。积分可在 Comfy Cloud 上使用，在 Comfy 桌面版上<strong>仅在调用合作伙伴节点时使用</strong>。Comfy 桌面版本身免费。'
+    }
+  },
+  {
+    id: 'difference-between-plans',
+    question: {
+      en: "What's the difference between Standard, Creator, and Pro?",
+      'zh-CN': 'Standard、Creator 和 Pro 有什么区别？'
+    },
+    answer: {
+      en: '<strong>Standard -</strong> 30-min max runtime per workflow, 1 concurrent workflow via API. For individuals building workflows.\n\n<strong>Creator -</strong> Everything in Standard plus the ability to <strong>import your own models</strong> (from CivitAI or Hugging Face) and run up to 3 workflows concurrently via API.\n\n<strong>Pro -</strong> Everything in Creator plus <strong>longer runtime (up to 1 hour)</strong> per workflow and up to 5 concurrent workflows via API. For teams running Comfy in production.',
+      'zh-CN':
+        '<strong>Standard -</strong> 单个工作流最长运行 30 分钟，API 支持 1 个并发工作流。适合构建工作流的个人。\n\n<strong>Creator -</strong> 包含 Standard 的全部功能，并新增<strong>导入自有模型</strong>（来自 CivitAI 或 Hugging Face）的能力，API 支持最多 3 个并发工作流。\n\n<strong>Pro -</strong> 包含 Creator 的全部功能，并提供<strong>更长的运行时长（最长 1 小时）</strong>，API 支持最多 5 个并发工作流。适合在生产环境中运行 Comfy 的团队。'
+    }
+  },
+  {
+    id: 'how-does-team-plan-work',
+    question: {
+      en: 'How does the Team Plan work?',
+      'zh-CN': '团队计划是如何运作的？'
+    },
+    answer: {
+      en: 'The Team Plan puts your whole team on <strong>one shared credit pool.</strong> Every member draws from the same balance, so you\'re not juggling separate subscriptions. Key things to know:\n\n<strong>One pool, shared.</strong> Everyone generates against the same credit balance.\n<strong>Invite by email.</strong> Add teammates, and resend or revoke access any time.\n<strong>Owners manage billing.</strong> Assign owners who handle payment and buy top-ups for the team.\n<strong>Upgrade in place.</strong> Move an existing workspace to a team and your workflows, models, and assets stay attached.\n\nChoose your monthly credit commitment that fits your team. <a href="https://cloud.comfy.org/?pricing=team" target="_blank" rel="noopener noreferrer" class="text-primary-comfy-yellow underline">Get started today.</a>',
+      'zh-CN':
+        '团队计划让整个团队共享<strong>一个积分池</strong>。每位成员都从同一余额中扣费，无需分别管理多个订阅。要点：\n\n<strong>一池共享。</strong>所有人都从同一积分余额中生成内容。\n<strong>邮箱邀请。</strong>添加团队成员，随时重新发送或撤销访问权限。\n<strong>所有者管理账单。</strong>指定所有者负责付款，并为团队购买充值积分。\n<strong>原地升级。</strong>将现有工作区升级为团队工作区，您的工作流、模型和资产都将保留。\n\n选择适合您团队的每月积分承诺。<a href="https://cloud.comfy.org/?pricing=team" target="_blank" rel="noopener noreferrer" class="text-primary-comfy-yellow underline">立即开始。</a>'
+    }
+  },
+  {
+    id: 'team-spending-controls',
+    question: {
+      en: 'Can I control how my team spends credits?',
+      'zh-CN': '我可以控制团队消耗积分的方式吗？'
+    },
+    answer: {
+      en: "Today, owners control the shared pool and top-ups. We're actively building finer-grained controls: <strong>spending limits</strong> at the user, project, and workspace level, <strong>per-project budgets and chargebacks</strong>, <strong>auto-recharge</strong> when the pool runs low, and <strong>self-serve teams beyond 50 seats</strong>.",
+      'zh-CN':
+        '目前，所有者掌控共享积分池和充值。我们正在积极开发更细粒度的控制功能：用户、项目和工作区级别的<strong>消费上限</strong>、<strong>按项目预算与分摊</strong>、积分池余额不足时的<strong>自动充值</strong>，以及<strong>超过 50 个席位的自助式团队</strong>。'
+    }
+  },
+  {
+    id: 'team-per-seat-pricing',
+    question: {
+      en: 'Is Team pricing per-seat? Can I add a freelancer just for a project?',
+      'zh-CN':
+        '团队计划是按席位计费吗？我可以为某个项目临时加入一位自由职业者吗？'
+    },
+    answer: {
+      en: 'No. Team pricing is based on <strong>your monthly credit commit</strong>, not per-seat. Invite a freelancer, they draw from the shared credit pool while they\'re working, then remove them when the project wraps. <strong>No charge for adding or removing people.</strong> Member count is capped at <strong>50</strong> today; if you hit the cap, <a href="https://portal.usepylon.com/comfy-org/forms/question" target="_blank" rel="noopener noreferrer" class="text-primary-comfy-yellow underline">contact support</a> for additional seats.',
+      'zh-CN':
+        '不是。团队定价基于<strong>您每月承诺的积分量</strong>，而非按席位计费。邀请自由职业者后，他们在工作期间从共享积分池中扣费，项目结束后再将其移除即可。<strong>添加或移除成员都不收取额外费用。</strong>目前成员数量上限为 <strong>50</strong> 人；如果您达到上限，请<a href="https://portal.usepylon.com/comfy-org/forms/question" target="_blank" rel="noopener noreferrer" class="text-primary-comfy-yellow underline">联系支持</a>以增加席位。'
+    }
+  },
+  {
+    id: 'team-upgrade-carryover',
+    question: {
+      en: 'What carries over when I upgrade my workspace to a Team plan?',
+      'zh-CN': '将工作区升级为团队计划时，哪些内容会保留？'
+    },
+    answer: {
+      en: "Everything stays. You're upgrading the workspace itself, so <strong>workflows, models, run history, and top-up credits all remain attached</strong>. The only exception: unused monthly credits from your old plan expire at the end of your current billing cycle, since you're moving to a new credit allowance. <strong>Top-up credits carry over.</strong>",
+      'zh-CN':
+        '全部保留。您升级的是工作区本身，因此<strong>工作流、模型、运行历史和充值积分都会保留</strong>。唯一例外：原计划中未使用的月度积分会在当前计费周期结束时失效，因为您将获得新的月度积分额度。<strong>充值积分会顺延。</strong>'
+    }
+  },
+  {
+    id: 'team-tier-pricing',
+    question: {
+      en: 'What do the Team plan tiers cost, and how does the discount work?',
+      'zh-CN': '团队计划各档次的价格是多少？折扣是怎么算的？'
+    },
+    answer: {
+      en: 'Team plans come in <strong>five tiers from $200 to $2,500/month</strong>, set by a credit-commit slider. A bigger monthly commit means a bigger discount: <strong>annual plans go up to 20% off, monthly plans up to 10%</strong>. The discount starts at the $400 tier (5% annual / 2.5% monthly) and scales from there.',
+      'zh-CN':
+        '团队计划共有<strong>五个档次，从每月 $200 到 $2,500</strong>，通过积分承诺滑块进行调整。月度承诺越高，折扣越大：<strong>年付计划最高 20% 折扣，月付计划最高 10% 折扣</strong>。折扣自 $400 档位起（年付 5% / 月付 2.5%），并由此递增。'
+    }
+  },
+  {
+    id: 'team-collaboration-features',
+    question: {
+      en: 'What collaboration features are included at launch?',
+      'zh-CN': '首发时包含哪些协作功能？'
+    },
+    answer: {
+      en: 'At launch, a Team plan gives you <strong>shared infrastructure</strong>: one credit pool, one bill, one set of admins. <strong>Workflow and asset sharing inside the workspace is coming soon.</strong> In the meantime, to hand off, share the workflow, export the workflow JSON, or drop a Comfy-generated asset into another canvas.',
+      'zh-CN':
+        '在首发阶段，团队计划为您提供<strong>共享基础设施</strong>：一个积分池、一份账单、一组管理员。<strong>工作区内的工作流与资产共享功能即将上线。</strong>在此之前，您可以通过共享工作流、导出工作流 JSON 或将 Comfy 生成的资产拖入另一画布来完成交接。'
+    }
+  },
+  {
+    id: 'team-concurrency',
+    question: {
+      en: 'How does concurrency work on a Team plan? Can multiple members run workflows at the same time?',
+      'zh-CN': '团队计划的并发是如何运作的？多名成员可以同时运行工作流吗？'
+    },
+    answer: {
+      en: 'Yes. <strong>The workspace has 50 concurrent slots (matches the number of members), shared across the team</strong>. A ten-person team and a 50-person team both get the same 50 slots. If a few teammates saturate the pool, the rest queue up until slots free.',
+      'zh-CN':
+        '可以。<strong>工作区拥有 50 个并发槽位（与成员上限一致），由整个团队共享</strong>。无论是 10 人团队还是 50 人团队，都享有相同的 50 个槽位。如果少数成员占满了槽位，其他人会排队等待，直到有槽位空出。'
+    }
+  },
+  {
+    id: 'runtime-and-concurrency-limits',
+    question: {
+      en: 'What are the runtime and concurrency limits?',
+      'zh-CN': '运行时长和并发的限制是什么？'
+    },
+    answer: {
+      en: 'Each workflow has a max runtime of <strong>30 minutes</strong> on Standard and Creator, raised to <strong>1 hour</strong> on Pro. Jobs over the limit are cancelled automatically to keep the system fair and stable. You can queue up to <strong>100 workflows</strong> at once, and run <strong>1 / 3 / 5</strong> concurrently via API on Standard / Creator / Pro. On Team plan, the limit is raised to 50, matching the number of members on the team. Need higher API rate limits? Contact <a href="mailto:enterprise@comfy.org" class="text-primary-comfy-yellow underline">enterprise@comfy.org</a>.',
+      'zh-CN':
+        'Standard 和 Creator 上，单个工作流的最长运行时长为 <strong>30 分钟</strong>；Pro 上提升至 <strong>1 小时</strong>。超出限制的任务会被自动取消，以保持系统的公平与稳定。您可以同时排队最多 <strong>100 个工作流</strong>，并在 Standard / Creator / Pro 上通过 API 分别并发运行 <strong>1 / 3 / 5</strong> 个工作流。在团队计划中，此上限提升至 50，与团队成员上限一致。需要更高的 API 速率限制？请联系 <a href="mailto:enterprise@comfy.org" class="text-primary-comfy-yellow underline">enterprise@comfy.org</a>。'
+    }
+  }
+] as const
diff --git a/apps/website/src/data/pricingPlans.ts b/apps/website/src/data/pricingPlans.ts
new file mode 100644
index 0000000000..cc6fb43751
--- /dev/null
+++ b/apps/website/src/data/pricingPlans.ts
@@ -0,0 +1,108 @@
+import type { TranslationKey } from '../i18n/translations'
+
+import { SHOW_FREE_TIER } from '../config/features'
+import { externalLinks } from '../config/routes'
+
+export type BillingCycle = 'monthly' | 'yearly'
+
+interface PlanFeature {
+  text: TranslationKey
+  included?: boolean
+}
+
+export interface PricingPlan {
+  id: string
+  labelKey: TranslationKey
+  priceKey?: TranslationKey
+  yearlyPriceKey?: TranslationKey
+  yearlyTotalKey?: TranslationKey
+  creditsKey?: TranslationKey
+  estimateKey?: TranslationKey
+  ctaKey: TranslationKey
+  ctaHref: (cycle: BillingCycle) => string
+  features: PlanFeature[]
+  isPopular?: boolean
+}
+
+export const subscribeUrl = (
+  tier: string,
+  cycle: BillingCycle,
+  stop?: string
+): string => {
+  const params = new URLSearchParams({ tier, cycle })
+  if (stop) params.set('stop', stop)
+  return `${externalLinks.cloud}/cloud/subscribe?${params.toString()}`
+}
+
+const freePlan: PricingPlan = {
+  id: 'free',
+  labelKey: 'pricing.plan.free.label',
+  priceKey: 'pricing.plan.free.price',
+  creditsKey: 'pricing.plan.free.credits',
+  estimateKey: 'pricing.plan.free.estimate',
+  ctaKey: 'pricing.plan.free.cta',
+  ctaHref: () => externalLinks.cloud,
+  features: [
+    { text: 'pricing.plan.free.feature1' },
+    { text: 'pricing.plan.free.feature2' }
+  ]
+}
+
+const standardPricingPlans: PricingPlan[] = [
+  {
+    id: 'standard',
+    labelKey: 'pricing.plan.standard.label',
+    priceKey: 'pricing.plan.standard.price',
+    yearlyPriceKey: 'pricing.plan.standard.yearlyPrice',
+    yearlyTotalKey: 'pricing.plan.standard.yearlyTotal',
+    creditsKey: 'pricing.plan.standard.credits',
+    estimateKey: 'pricing.plan.standard.estimate',
+    ctaKey: 'pricing.plan.standard.cta',
+    ctaHref: (cycle) => subscribeUrl('standard', cycle),
+    features: [
+      { text: 'pricing.feature.shortRuntime' },
+      { text: 'pricing.feature.addCredits' },
+      { text: 'pricing.feature.importModels', included: false },
+      { text: 'pricing.feature.longRuntime', included: false }
+    ]
+  },
+  {
+    id: 'creator',
+    labelKey: 'pricing.plan.creator.label',
+    priceKey: 'pricing.plan.creator.price',
+    yearlyPriceKey: 'pricing.plan.creator.yearlyPrice',
+    yearlyTotalKey: 'pricing.plan.creator.yearlyTotal',
+    creditsKey: 'pricing.plan.creator.credits',
+    estimateKey: 'pricing.plan.creator.estimate',
+    ctaKey: 'pricing.plan.creator.cta',
+    ctaHref: (cycle) => subscribeUrl('creator', cycle),
+    features: [
+      { text: 'pricing.feature.shortRuntime' },
+      { text: 'pricing.feature.addCredits' },
+      { text: 'pricing.feature.importModels' },
+      { text: 'pricing.feature.longRuntime', included: false }
+    ],
+    isPopular: true
+  },
+  {
+    id: 'pro',
+    labelKey: 'pricing.plan.pro.label',
+    priceKey: 'pricing.plan.pro.price',
+    yearlyPriceKey: 'pricing.plan.pro.yearlyPrice',
+    yearlyTotalKey: 'pricing.plan.pro.yearlyTotal',
+    creditsKey: 'pricing.plan.pro.credits',
+    estimateKey: 'pricing.plan.pro.estimate',
+    ctaKey: 'pricing.plan.pro.cta',
+    ctaHref: (cycle) => subscribeUrl('pro', cycle),
+    features: [
+      { text: 'pricing.feature.shortRuntime' },
+      { text: 'pricing.feature.addCredits' },
+      { text: 'pricing.feature.importModels' },
+      { text: 'pricing.feature.longRuntime' }
+    ]
+  }
+]
+
+export const pricingPlans: PricingPlan[] = SHOW_FREE_TIER
+  ? [freePlan, ...standardPricingPlans]
+  : standardPricingPlans
diff --git a/apps/website/src/data/teamCreditTiers.ts b/apps/website/src/data/teamCreditTiers.ts
new file mode 100644
index 0000000000..fb32da3263
--- /dev/null
+++ b/apps/website/src/data/teamCreditTiers.ts
@@ -0,0 +1,54 @@
+export interface TeamCreditTier {
+  credits: number
+  basePrice: number
+  monthlyPrice: number
+  yearlyPrice: number
+  videos: number
+}
+
+export const teamCreditTiers: readonly TeamCreditTier[] = [
+  {
+    credits: 42200,
+    basePrice: 200,
+    monthlyPrice: 200,
+    yearlyPrice: 200,
+    videos: 3830
+  },
+  {
+    credits: 84400,
+    basePrice: 400,
+    monthlyPrice: 390,
+    yearlyPrice: 380,
+    videos: 7660
+  },
+  {
+    credits: 147700,
+    basePrice: 700,
+    monthlyPrice: 665,
+    yearlyPrice: 630,
+    videos: 13405
+  },
+  {
+    credits: 295400,
+    basePrice: 1400,
+    monthlyPrice: 1295,
+    yearlyPrice: 1190,
+    videos: 26810
+  },
+  {
+    credits: 527500,
+    basePrice: 2500,
+    monthlyPrice: 2250,
+    yearlyPrice: 2000,
+    videos: 47830
+  }
+] as const
+
+export function formatTeamCreditsLong(n: number): string {
+  return n.toLocaleString('en-US')
+}
+
+export function formatTeamCreditsShort(n: number): string {
+  const k = n / 1000
+  return k % 1 === 0 ? `${k}K` : `${k.toFixed(1)}K`
+}
diff --git a/apps/website/src/i18n/translations.ts b/apps/website/src/i18n/translations.ts
index fd0b4634b9..4724a8e121 100644
--- a/apps/website/src/i18n/translations.ts
+++ b/apps/website/src/i18n/translations.ts
@@ -1189,27 +1189,72 @@ const translations = {
   'buildWhat.row2a': { en: "DOESN'T EXIST", 'zh-CN': '尚不存在的' },
   'buildWhat.row2b': { en: 'YET', 'zh-CN': '事物' },
 
-  // PriceSection
-  'pricing.title': { en: 'Pricing', 'zh-CN': '价格' },
+  // PricingSection
+  'pricing.title': { en: 'Choose a plan', 'zh-CN': '价格' },
   'pricing.subtitle': {
     en: 'Access cloud-powered ComfyUI workflows with straightforward, usage-based pricing.',
     'zh-CN': '通过简单透明、按使用量计费的方式，访问云端 ComfyUI 工作流。'
   },
   'pricing.badge.popular': { en: 'MOST POPULAR', 'zh-CN': '最受欢迎' },
+  'pricing.period.monthly': { en: 'Monthly', 'zh-CN': '按月' },
+  'pricing.period.yearly': {
+    en: 'Yearly (Up to 20% off)',
+    'zh-CN': '按年（最高 20% 优惠）'
+  },
+  'pricing.period.billedMonthly': { en: 'Billed monthly', 'zh-CN': '按月计费' },
+  'pricing.period.billedYearly': {
+    en: '{total} billed yearly',
+    'zh-CN': '按年计费 {total}'
+  },
+  'pricing.savePercent': {
+    en: 'Save {pct}% ({amount})',
+    'zh-CN': '节省 {pct}%（{amount}）'
+  },
+  'pricing.team.videosEstimate': {
+    en: 'Generates ~{count} 5s videos*',
+    'zh-CN': '约可生成 {count} 个 5 秒视频*'
+  },
   'pricing.plan.period': { en: '/month', 'zh-CN': '/月' },
+  'pricing.creditsLabel': { en: 'monthly credits', 'zh-CN': '每月积分' },
+
+  'pricing.feature.shortRuntime': {
+    en: '30 minute max workflow runtime',
+    'zh-CN': '单个工作流最长运行 30 分钟'
+  },
+  'pricing.feature.addCredits': {
+    en: 'Add more credits anytime',
+    'zh-CN': '可随时增加积分'
+  },
+  'pricing.feature.importModels': {
+    en: 'Import your own models',
+    'zh-CN': '导入你自己的模型'
+  },
+  'pricing.feature.longRuntime': {
+    en: 'Longer workflow runtime (up to 1 hr)',
+    'zh-CN': '更长工作流运行时长（最长 1 小时）'
+  },
+  'pricing.feature.inviteMembers': {
+    en: 'Invite members',
+    'zh-CN': '邀请成员'
+  },
+  'pricing.feature.concurrentWorkflows': {
+    en: 'Members can run workflows concurrently',
+    'zh-CN': '成员可并行运行工作流'
+  },
+  'pricing.feature.sharedCreditPool': {
+    en: 'Shared credit pool for all members',
+    'zh-CN': '所有成员共享积分池'
+  },
+  'pricing.feature.roleBasedPermissions': {
+    en: 'Role-based permissions',
+    'zh-CN': '基于角色的权限'
+  },
 
   'pricing.plan.free.label': { en: 'FREE', 'zh-CN': '免费版' },
-  'pricing.plan.free.summary': {
-    en: "Explore Comfy's possibilities",
-    'zh-CN': '探索 Comfy 的可能性'
-  },
   'pricing.plan.free.price': { en: '$0', 'zh-CN': '$0' },
-  'pricing.plan.free.credits': {
-    en: 'Includes 400 monthly credits',
-    'zh-CN': '每月包含 400 积分'
-  },
+  'pricing.plan.free.credits': { en: '400', 'zh-CN': '400' },
   'pricing.plan.free.estimate': {
-    en: '~35 5s videos*',
+    en: 'Generates ~35 5s videos*',
     'zh-CN': '约可生成 35 个 5 秒视频*'
   },
   'pricing.plan.free.cta': { en: 'START FREE', 'zh-CN': '免费开始' },
@@ -1223,113 +1268,88 @@ const translations = {
   },
 
   'pricing.plan.standard.label': { en: 'STANDARD', 'zh-CN': '标准版' },
-  'pricing.plan.standard.summary': {
-    en: 'For individuals creating workflows',
-    'zh-CN': '面向个人工作流创作者'
-  },
   'pricing.plan.standard.price': { en: '$20', 'zh-CN': '$20' },
-  'pricing.plan.standard.credits': {
-    en: 'Includes 4,200 monthly credits with top-ups available',
-    'zh-CN': '每月包含 4,200 积分，并支持充值'
-  },
+  'pricing.plan.standard.yearlyPrice': { en: '$16', 'zh-CN': '$16' },
+  'pricing.plan.standard.yearlyTotal': { en: '$192', 'zh-CN': '$192' },
+  'pricing.plan.standard.credits': { en: '4,200', 'zh-CN': '4,200' },
   'pricing.plan.standard.estimate': {
-    en: '~380 5s videos*',
+    en: 'Generates ~380 5s videos*',
     'zh-CN': '约可生成 380 个 5 秒视频*'
   },
   'pricing.plan.standard.cta': {
     en: 'SUBSCRIBE TO STANDARD',
     'zh-CN': '订阅标准版'
   },
-  'pricing.plan.standard.featureIntro': {
-    en: 'Everything in Free, plus:',
-    'zh-CN': '包含免费版全部能力，另加：'
-  },
-  'pricing.plan.standard.feature1': {
-    en: '30-minute max runtime per workflow',
-    'zh-CN': '单个工作流最长运行 30 分钟'
-  },
-  'pricing.plan.standard.feature2': {
-    en: 'Add more credits anytime',
-    'zh-CN': '可随时增加积分'
-  },
-  'pricing.plan.standard.feature3': {
-    en: 'Run 1 workflow concurrently (via API)',
-    'zh-CN': '通过 API 并发运行 1 个工作流'
-  },
 
   'pricing.plan.creator.label': { en: 'CREATOR', 'zh-CN': '创作者版' },
-  'pricing.plan.creator.summary': {
-    en: 'Small teams building fine-tuned, repeatable workflows',
-    'zh-CN': '小团队构建精细调优、可复用的工作流'
-  },
   'pricing.plan.creator.price': { en: '$35', 'zh-CN': '$35' },
-  'pricing.plan.creator.credits': {
-    en: 'Includes 7,400 monthly credits with top-ups available',
-    'zh-CN': '每月包含 7,400 积分，并支持充值'
-  },
+  'pricing.plan.creator.yearlyPrice': { en: '$28', 'zh-CN': '$28' },
+  'pricing.plan.creator.yearlyTotal': { en: '$336', 'zh-CN': '$336' },
+  'pricing.plan.creator.credits': { en: '7,400', 'zh-CN': '7,400' },
   'pricing.plan.creator.estimate': {
-    en: '~670 5s videos*',
+    en: 'Generates ~670 5s videos*',
     'zh-CN': '约可生成 670 个 5 秒视频*'
   },
   'pricing.plan.creator.cta': {
     en: 'SUBSCRIBE TO CREATOR',
     'zh-CN': '订阅创作者版'
   },
-  'pricing.plan.creator.featureIntro': {
-    en: 'Everything in Standard, plus:',
-    'zh-CN': '包含标准版全部能力，另加：'
-  },
-  'pricing.plan.creator.feature1': {
-    en: 'Import your own LoRAs',
-    'zh-CN': '导入你自己的 LoRA'
-  },
-  'pricing.plan.creator.feature2': {
-    en: 'Run up to 3 workflows concurrently (via API)',
-    'zh-CN': '通过 API 最多并发运行 3 个工作流'
-  },
 
   'pricing.plan.pro.label': { en: 'PRO', 'zh-CN': '专业版' },
-  'pricing.plan.pro.summary': {
-    en: 'For growing teams running Comfy in production',
-    'zh-CN': '面向在生产环境使用 Comfy 的成长型团队'
-  },
   'pricing.plan.pro.price': { en: '$100', 'zh-CN': '$100' },
-  'pricing.plan.pro.credits': {
-    en: 'Includes 21,100 monthly credits with top-ups available',
-    'zh-CN': '每月包含 21,100 积分，并支持充值'
-  },
+  'pricing.plan.pro.yearlyPrice': { en: '$80', 'zh-CN': '$80' },
+  'pricing.plan.pro.yearlyTotal': { en: '$960', 'zh-CN': '$960' },
+  'pricing.plan.pro.credits': { en: '21,100', 'zh-CN': '21,100' },
   'pricing.plan.pro.estimate': {
-    en: '~1,915 5s videos*',
+    en: 'Generates ~1,915 5s videos*',
     'zh-CN': '约可生成 1,915 个 5 秒视频*'
   },
   'pricing.plan.pro.cta': { en: 'SUBSCRIBE TO PRO', 'zh-CN': '订阅专业版' },
-  'pricing.plan.pro.featureIntro': {
-    en: 'Everything in Creator, plus:',
-    'zh-CN': '包含创作者版全部能力，另加：'
+
+  'pricing.plan.team.label': { en: 'TEAM', 'zh-CN': '团队版' },
+  'pricing.plan.team.cta': {
+    en: 'SUBSCRIBE TO TEAM',
+    'zh-CN': '订阅团队版'
   },
-  'pricing.plan.pro.feature1': {
-    en: 'Longer workflow runtime (up to 1 hour)',
-    'zh-CN': '更长工作流运行时长（最长 1 小时）'
+  'pricing.plan.team.everythingInProPlus': {
+    en: 'Everything in Pro, plus:',
+    'zh-CN': '包含专业版的全部功能，另加：'
   },
-  'pricing.plan.pro.feature2': {
-    en: 'Run up to 5 workflows concurrently (via API)',
-    'zh-CN': '通过 API 最多并发运行 5 个工作流'
+  'pricing.team.description': {
+    en: 'Built for teams collaborating on workflows together.',
+    'zh-CN': '为协作开发工作流的团队打造。'
+  },
+  'pricing.plan.team.comingSoon': {
+    en: 'Coming soon...',
+    'zh-CN': '即将推出…'
+  },
+  'pricing.plan.team.sharedWorkflowsAndAssets': {
+    en: 'Shared workflows & assets',
+    'zh-CN': '共享工作流与资产'
+  },
+  'pricing.plan.team.projects': {
+    en: 'Projects',
+    'zh-CN': '项目'
+  },
+  'pricing.plan.feature.status.coming': {
+    en: 'Coming soon',
+    'zh-CN': '即将推出'
+  },
+  'pricing.plan.feature.status.included': {
+    en: 'Included',
+    'zh-CN': '已包含'
+  },
+  'pricing.plan.feature.status.notIncluded': {
+    en: 'Not included',
+    'zh-CN': '未包含'
   },
 
   'pricing.enterprise.label': { en: 'ENTERPRISE', 'zh-CN': '企业版' },
-  'pricing.enterprise.heading': {
-    en: 'Looking for Enterprise Solutions?',
-    'zh-CN': '在寻找企业级解决方案？'
-  },
   'pricing.enterprise.description': {
-    en: 'For teams running Comfy in production, and at scale.',
-    'zh-CN': '面向在生产环境和规模化场景中运行 Comfy 的团队。'
-  },
-  'pricing.enterprise.cta': { en: 'LEARN MORE', 'zh-CN': '了解更多' },
-  'pricing.enterprise.featureIntro': {
-    en: 'Everything in Pro, plus:',
-    'zh-CN': '包含专业版全部能力，另加：'
+    en: 'Need more members? Looking for more flexibility or custom features?',
+    'zh-CN': '需要更多成员？想要更多灵活性或定制功能？'
   },
+  'pricing.enterprise.cta': { en: 'Contact Us', 'zh-CN': '联系我们' },
   'pricing.enterprise.feature1': {
     en: 'Annual commitments with bulk pricing and custom compute packages',
     'zh-CN': '支持年度承诺、批量定价与定制算力套餐'
@@ -1357,6 +1377,10 @@ const translations = {
     en: "What's included\nin the Comfy plan",
     'zh-CN': 'Comfy 计划\n包含哪些内容'
   },
+  'pricing.included.comingSoon': {
+    en: '(coming soon)',
+    'zh-CN': '（即将推出）'
+  },
   'pricing.included.feature1.title': {
     en: 'Machine Setup',
     'zh-CN': '机器配置'
@@ -1370,9 +1394,9 @@ const translations = {
     'zh-CN': '单个任务时限'
   },
   'pricing.included.feature2.description': {
-    en: 'On our Standard and Creator plans, each workflow has a maximum run time of 30 minutes. On the Pro plan, the limit is increased to 1 hour. Jobs exceeding that limit are automatically cancelled to ensure fair usage and system stability.',
+    en: 'Each workflow run has a maximum duration of 30 minutes. On the Pro plan, the time limit is increased to 1 hour. Jobs exceeding that limit are automatically cancelled to ensure fair usage and system stability.',
     'zh-CN':
-      'Standard 和 Creator 计划下，每个工作流最长运行时间为 30 分钟。Pro 计划的时限可延长至 1 小时。超时任务将自动取消，以确保公平使用和系统稳定。'
+      '每个工作流运行的最长时长为 30 分钟。Pro 计划的时限可延长至 1 小时。超时任务将自动取消，以确保公平使用和系统稳定。'
   },
   'pricing.included.feature3.title': {
     en: 'Usage',
@@ -1397,9 +1421,9 @@ const translations = {
     'zh-CN': '随时加购积分'
   },
   'pricing.included.feature5.description': {
-    en: 'Purchase additional credits at any time. Top-up credits are valid for 1 year from the date of purchase and do not roll over with your monthly plan.',
+    en: 'Purchase additional credits at any time. Unused top-ups roll over to the next month automatically for up to 1 year.',
     'zh-CN':
-      '可随时购买额外积分。充值积分自购买之日起 1 年内有效，且不会随月度计划结转。'
+      '可随时购买额外积分。未使用的充值积分将自动顺延至下个月，最长可保留 1 年。'
   },
   'pricing.included.feature6.title': {
     en: 'Pre-installed models',
@@ -1416,16 +1440,16 @@ const translations = {
   'pricing.included.feature7.description': {
     en: "Comfy Cloud currently supports a variety of the most-used custom nodes from the ComfyUI community. We're expanding support regularly based on demand and compatibility.",
     'zh-CN':
-      'Comfy Cloud 目前支持 ComfyUI 社区中最常用的多种自定义节点，并根据需求和兼容性持续扩展支持范围。'
+      'Comfy Cloud 目前支持 ComfyUI 社区中最常用的多种自定义节点。我们会根据需求和兼容性持续扩展支持范围。'
   },
   'pricing.included.feature8.title': {
     en: 'Partner Nodes',
     'zh-CN': '合作伙伴节点'
   },
   'pricing.included.feature8.description': {
-    en: 'Run <strong>proprietary models</strong> through Comfy\'s <a href="https://docs.comfy.org/tutorials/partner-nodes/overview" class="text-primary-comfy-yellow underline">Partner Nodes</a>, such as Nano Banana. The amount of credits each node uses depends on the model and parameters you set in the node, but these credits are the same ones that your monthly subscription comes with. These credits can also be used across Comfy Cloud and Comfy Desktop. Read more about Partner nodes <a href="https://docs.comfy.org/tutorials/partner-nodes/overview" class="text-primary-comfy-yellow underline">here</a>.',
+    en: 'Run <strong>proprietary models</strong> through Comfy\'s <a href="https://docs.comfy.org/tutorials/partner-nodes/overview" class="text-primary-comfy-yellow underline">Partner Nodes</a>, such as Nano Banana. The amount of credits each node uses depends on the model and parameters you set in the node, but these credits are the same ones that your monthly subscription comes with. These credits can also be used across <strong>Comfy Cloud and local ComfyUI</strong>. Read more about Partner nodes <a href="https://docs.comfy.org/tutorials/partner-nodes/overview" class="text-primary-comfy-yellow underline">here</a>.',
     'zh-CN':
-      '通过 Comfy 的<a href="https://docs.comfy.org/tutorials/partner-nodes/overview" class="text-primary-comfy-yellow underline">合作伙伴节点</a>运行<strong>专有模型</strong>，如 Nano Banana。每个节点消耗的积分取决于所用模型和参数设置，且与月度订阅积分通用。积分可在 Comfy Cloud 和 Comfy 桌面版间通用。了解更多关于合作伙伴节点的信息请点击<a href="https://docs.comfy.org/tutorials/partner-nodes/overview" class="text-primary-comfy-yellow underline">此处</a>。'
+      '通过 Comfy 的<a href="https://docs.comfy.org/tutorials/partner-nodes/overview" class="text-primary-comfy-yellow underline">合作伙伴节点</a>运行<strong>专有模型</strong>，如 Nano Banana。每个节点消耗的积分取决于所用模型和参数设置，且与月度订阅积分通用。积分可在 <strong>Comfy Cloud 和本地 ComfyUI</strong> 间通用。了解更多关于合作伙伴节点的信息请点击<a href="https://docs.comfy.org/tutorials/partner-nodes/overview" class="text-primary-comfy-yellow underline">此处</a>。'
   },
   'pricing.included.feature9.title': {
     en: 'Job queue',
@@ -1445,23 +1469,19 @@ const translations = {
       'Creator 或 Pro 计划用户可从 CivitAI 或 Huggingface 导入自己的模型和 LoRA，打造专属风格。'
   },
   'pricing.included.feature11.title': {
-    en: 'Run Workflows via API',
-    'zh-CN': '通过 API 运行工作流'
-  },
-  'pricing.included.feature11.description': {
-    en: 'Run Comfy workflows programmatically via API, with concurrency limits based on your plan. Perfect for integrating ComfyUI into your applications, automating batch processing, or building production pipelines. For higher rate limits, reach out to <a href="mailto:enterprise@comfy.org" class="text-primary-comfy-yellow underline">enterprise@comfy.org</a>.',
-    'zh-CN':
-      '通过 API 以编程方式运行 Comfy 工作流，并发上限由您的计划决定。非常适合将 ComfyUI 集成到您的应用、自动化批量处理或构建生产级流水线。如需更高的速率限制，请联系 <a href="mailto:enterprise@comfy.org" class="text-primary-comfy-yellow underline">enterprise@comfy.org</a>。'
-  },
-  'pricing.included.feature12.title': {
     en: 'Parallel job execution',
     'zh-CN': '并行任务执行'
   },
-  'pricing.included.feature12.description': {
+  'pricing.included.feature11.description': {
     en: 'Run multiple workflows in parallel to speed up your pipeline.',
     'zh-CN': '并行运行多个工作流，加速你的流程。'
   },
 
+  'pricing.faq.heading': {
+    en: 'Q&A',
+    'zh-CN': '问答'
+  },
+
   // VideoPlayer
   'player.play': { en: 'Play', 'zh-CN': '播放' },
   'player.pause': { en: 'Pause', 'zh-CN': '暂停' },
diff --git a/apps/website/src/pages/cloud/pricing.astro b/apps/website/src/pages/cloud/pricing.astro
index babec9f655..b05b6c3e22 100644
--- a/apps/website/src/pages/cloud/pricing.astro
+++ b/apps/website/src/pages/cloud/pricing.astro
@@ -1,10 +1,12 @@
 ---
 import BaseLayout from '../../layouts/BaseLayout.astro'
-import PriceSection from '../../components/pricing/PriceSection.vue'
+import PricingSection from '../../components/pricing/PricingSection.vue'
 import WhatsIncludedSection from '../../components/pricing/WhatsIncludedSection.vue'
+import FAQSection from '../../components/pricing/FAQSection.vue'
 ---
 
 <BaseLayout title="Pricing — Comfy Cloud">
-  <PriceSection client:load />
+  <PricingSection client:load />
   <WhatsIncludedSection />
+  <FAQSection client:visible />
 </BaseLayout>
diff --git a/apps/website/src/pages/zh-CN/cloud/pricing.astro b/apps/website/src/pages/zh-CN/cloud/pricing.astro
index 9f17d85a12..0feb9f6014 100644
--- a/apps/website/src/pages/zh-CN/cloud/pricing.astro
+++ b/apps/website/src/pages/zh-CN/cloud/pricing.astro
@@ -1,10 +1,12 @@
 ---
 import BaseLayout from '../../../layouts/BaseLayout.astro'
-import PriceSection from '../../../components/pricing/PriceSection.vue'
+import PricingSection from '../../../components/pricing/PricingSection.vue'
 import WhatsIncludedSection from '../../../components/pricing/WhatsIncludedSection.vue'
+import FAQSection from '../../../components/pricing/FAQSection.vue'
 ---
 
 <BaseLayout title="定价 — Comfy Cloud">
-  <PriceSection locale="zh-CN" client:load />
+  <PricingSection locale="zh-CN" client:load />
   <WhatsIncludedSection locale="zh-CN" />
+  <FAQSection locale="zh-CN" client:visible />
 </BaseLayout>
diff --git a/apps/website/src/styles/global.css b/apps/website/src/styles/global.css
index 6d2e2e044a..caa184c653 100644
--- a/apps/website/src/styles/global.css
+++ b/apps/website/src/styles/global.css
@@ -62,6 +62,7 @@
 @theme {
   --color-site-dropdown: #332b38;
   --color-primary-comfy-yellow: #f2ff59;
+  --color-primary-comfy-orange: #fabc25;
   --color-primary-comfy-ink: #211927;
   --color-primary-comfy-ink-light: #2a2330;
   --color-primary-comfy-canvas: #c2bfb9;
diff --git a/browser_tests/fixtures/ComfyPage.ts b/browser_tests/fixtures/ComfyPage.ts
index fc767db226..84934c1999 100644
--- a/browser_tests/fixtures/ComfyPage.ts
+++ b/browser_tests/fixtures/ComfyPage.ts
@@ -56,12 +56,16 @@ class ComfyPropertiesPanel {
   readonly panelTitle: Locator
   readonly searchBox: Locator
   readonly titleEditor: TitleEditor
+  readonly toggleButton: Locator
 
   constructor(readonly page: Page) {
     this.root = page.getByTestId(TestIds.propertiesPanel.root)
     this.panelTitle = this.root.locator('h3')
     this.searchBox = this.root.getByPlaceholder(/^Search/)
     this.titleEditor = new TitleEditor(this.root)
+    this.toggleButton = page.getByRole('button', {
+      name: 'Toggle properties panel'
+    })
   }
 }
 
diff --git a/browser_tests/fixtures/components/SidebarTab.ts b/browser_tests/fixtures/components/SidebarTab.ts
index a2c6a15a31..27ecc485c7 100644
--- a/browser_tests/fixtures/components/SidebarTab.ts
+++ b/browser_tests/fixtures/components/SidebarTab.ts
@@ -352,20 +352,11 @@ export class AssetsSidebarTab extends SidebarTab {
     this.listViewItems = page.locator(
       '.sidebar-content-container [role="button"][tabindex="0"]'
     )
-    this.selectionFooter = page
-      .locator('.sidebar-content-container')
-      .locator('..')
-      .locator('[class*="h-18"]')
-    this.selectionCountButton = page.getByText(/Assets Selected: \d+/)
-    this.deselectAllButton = page.getByText('Deselect all')
-    this.deleteSelectedButton = page
-      .getByTestId('assets-delete-selected')
-      .or(page.locator('button:has(.icon-\\[lucide--trash-2\\])').last())
-      .first()
-    this.downloadSelectedButton = page
-      .getByTestId('assets-download-selected')
-      .or(page.locator('button:has(.icon-\\[lucide--download\\])').last())
-      .first()
+    this.selectionFooter = page.getByTestId('assets-selection-bar')
+    this.selectionCountButton = page.getByText(/\d+ selected/)
+    this.deselectAllButton = page.getByTestId('assets-deselect-selected')
+    this.deleteSelectedButton = page.getByTestId('assets-delete-selected')
+    this.downloadSelectedButton = page.getByTestId('assets-download-selected')
     this.backToAssetsButton = page.getByText('Back to all assets')
     this.skeletonLoaders = page.locator(
       '.sidebar-content-container .animate-pulse'
diff --git a/browser_tests/fixtures/selectors.ts b/browser_tests/fixtures/selectors.ts
index 81a7a9a839..34beb002e2 100644
--- a/browser_tests/fixtures/selectors.ts
+++ b/browser_tests/fixtures/selectors.ts
@@ -112,6 +112,10 @@ export const TestIds = {
     root: 'properties-panel',
     errorsTab: 'panel-tab-errors'
   },
+  assets: {
+    browserModal: 'asset-browser-modal',
+    card: 'asset-card'
+  },
   subgraphEditor: {
     hiddenSection: 'subgraph-editor-hidden-section',
     iconEye: 'icon-eye',
diff --git a/browser_tests/tests/bottomPanelShortcuts.spec.ts b/browser_tests/tests/bottomPanelShortcuts.spec.ts
index 767e4b87c2..d4df7cae8b 100644
--- a/browser_tests/tests/bottomPanelShortcuts.spec.ts
+++ b/browser_tests/tests/bottomPanelShortcuts.spec.ts
@@ -223,4 +223,23 @@ test.describe('Bottom Panel Shortcuts', { tag: '@ui' }, () => {
     await expect(comfyPage.settingDialog.root).toBeVisible()
     await expect(comfyPage.settingDialog.category('Keybinding')).toBeVisible()
   })
+
+  test('should focus keybindings search when opening manage shortcuts', async ({
+    comfyPage
+  }) => {
+    const { bottomPanel } = comfyPage
+
+    await bottomPanel.keyboardShortcutsButton.click()
+    await bottomPanel.shortcuts.manageButton.click()
+
+    await expect(comfyPage.settingDialog.root).toBeVisible()
+    await expect(comfyPage.settingDialog.category('Keybinding')).toBeVisible()
+
+    await expect(
+      comfyPage.page.getByPlaceholder('Search Keybindings...')
+    ).toBeFocused()
+    await expect(
+      comfyPage.page.getByPlaceholder('Search Settings...')
+    ).not.toBeFocused()
+  })
 })
diff --git a/browser_tests/tests/browseModelAssets.spec.ts b/browser_tests/tests/browseModelAssets.spec.ts
new file mode 100644
index 0000000000..cd313297fc
--- /dev/null
+++ b/browser_tests/tests/browseModelAssets.spec.ts
@@ -0,0 +1,61 @@
+import { expect } from '@playwright/test'
+
+import type { Asset } from '@comfyorg/ingest-types'
+import { createCloudAssetsFixture } from '@e2e/fixtures/assetApiFixture'
+import { STABLE_CHECKPOINT } from '@e2e/fixtures/data/assetFixtures'
+
+const CLOUD_ASSETS: Asset[] = [STABLE_CHECKPOINT]
+
+const test = createCloudAssetsFixture(CLOUD_ASSETS)
+
+test.describe('Browse Model Assets - Use button', { tag: '@cloud' }, () => {
+  test.beforeEach(async ({ comfyPage }) => {
+    await comfyPage.settings.setSetting('Comfy.Assets.UseAssetAPI', true)
+    await comfyPage.nodeOps.clearGraph()
+  })
+
+  test.afterEach(async ({ comfyPage }) => {
+    await comfyPage.nodeOps.clearGraph()
+  })
+
+  test('Use button ghost-places a loader populated with the model', async ({
+    comfyPage
+  }) => {
+    await comfyPage.command.executeCommand('Comfy.BrowseModelAssets')
+
+    const modal = comfyPage.page.locator(
+      '[data-component-id="AssetBrowserModal"]'
+    )
+    await expect(modal).toBeVisible()
+
+    const card = comfyPage.page.locator(
+      `[data-component-id="AssetCard"][data-asset-id="${STABLE_CHECKPOINT.id}"]`
+    )
+    await expect(card).toBeVisible()
+    await card.getByRole('button', { name: 'Use' }).click()
+
+    // Dialog closes and the ghost is armed; the node is not placed until the
+    // user clicks the canvas.
+    await expect(modal).toBeHidden()
+    await expect
+      .poll(() => comfyPage.nodeOps.getGraphNodesCount(), { timeout: 1000 })
+      .toBe(0)
+
+    const canvasBox = (await comfyPage.canvas.boundingBox())!
+    await comfyPage.canvas.click({
+      position: { x: canvasBox.width / 2, y: canvasBox.height / 2 }
+    })
+
+    await expect.poll(() => comfyPage.nodeOps.getGraphNodesCount()).toBe(1)
+    await expect
+      .poll(() => comfyPage.nodeOps.getSelectedGraphNodesCount())
+      .toBe(1)
+
+    const [loader] = await comfyPage.nodeOps.getNodeRefsByType(
+      'CheckpointLoaderSimple'
+    )
+    expect(loader).toBeDefined()
+    const widget = await loader.getWidgetByName('ckpt_name')
+    expect(await widget.getValue()).toBe(STABLE_CHECKPOINT.name)
+  })
+})
diff --git a/browser_tests/tests/cloud-asset-promoted-widget.spec.ts b/browser_tests/tests/cloud-asset-promoted-widget.spec.ts
new file mode 100644
index 0000000000..63ccd73168
--- /dev/null
+++ b/browser_tests/tests/cloud-asset-promoted-widget.spec.ts
@@ -0,0 +1,99 @@
+import { expect } from '@playwright/test'
+import type { Page } from '@playwright/test'
+
+import {
+  assetRequestIncludesTag,
+  createCloudAssetsFixture
+} from '@e2e/fixtures/assetApiFixture'
+import {
+  STABLE_CHECKPOINT,
+  STABLE_CHECKPOINT_2
+} from '@e2e/fixtures/data/assetFixtures'
+import { TestIds } from '@e2e/fixtures/selectors'
+
+const WORKFLOW = 'missing/missing_model_promoted_widget'
+const HOST_NODE_ID = 2
+const WIDGET_NAME = 'ckpt_name'
+const SELECTED_MODEL = STABLE_CHECKPOINT_2.name
+
+const test = createCloudAssetsFixture([STABLE_CHECKPOINT, STABLE_CHECKPOINT_2])
+
+interface WidgetSnapshot {
+  type: string
+  value: string
+  hasLayout: boolean
+}
+
+async function getHostWidgetSnapshot(page: Page): Promise<WidgetSnapshot> {
+  return await page.evaluate(
+    ({ nodeId, widgetName }) => {
+      const node = window.app!.graph.getNodeById(nodeId)
+      const widget = node?.widgets?.find((widget) => widget.name === widgetName)
+
+      return {
+        type: widget?.type ?? '',
+        value: String(widget?.value ?? ''),
+        hasLayout: widget?.last_y != null
+      }
+    },
+    { nodeId: HOST_NODE_ID, widgetName: WIDGET_NAME }
+  )
+}
+
+test.describe(
+  'Promoted subgraph asset widgets',
+  { tag: ['@cloud', '@canvas', '@widget'] },
+  () => {
+    test.afterEach(async ({ comfyPage }) => {
+      await comfyPage.nodeOps.clearGraph()
+    })
+
+    test('legacy asset browser selection updates the promoted host widget value', async ({
+      cloudAssetRequests,
+      comfyPage
+    }) => {
+      await comfyPage.settings.setSetting('Comfy.Assets.UseAssetAPI', true)
+      await comfyPage.workflow.loadWorkflow(WORKFLOW)
+
+      await expect
+        .poll(
+          () =>
+            cloudAssetRequests.some((url) =>
+              assetRequestIncludesTag(url, 'checkpoints')
+            ),
+          { timeout: 10_000 }
+        )
+        .toBe(true)
+      await expect
+        .poll(() => getHostWidgetSnapshot(comfyPage.page))
+        .toMatchObject({
+          type: 'asset',
+          hasLayout: true
+        })
+      const initialWidget = await getHostWidgetSnapshot(comfyPage.page)
+      expect(initialWidget.value).not.toBe(SELECTED_MODEL)
+
+      const hostNode = await comfyPage.nodeOps.getNodeRefById(HOST_NODE_ID)
+      await hostNode.centerOnNode()
+      const promotedWidget = await hostNode.getWidgetByName(WIDGET_NAME)
+      await promotedWidget.click()
+
+      const modal = comfyPage.page.getByTestId(TestIds.assets.browserModal)
+      await expect(modal).toBeVisible()
+
+      const assetCard = modal
+        .getByTestId(TestIds.assets.card)
+        .filter({ hasText: SELECTED_MODEL })
+        .first()
+      await expect(assetCard).toBeVisible()
+      await assetCard.getByRole('button', { name: 'Use' }).click()
+
+      await expect(modal).toBeHidden()
+      await expect
+        .poll(() =>
+          getHostWidgetSnapshot(comfyPage.page).then((widget) => widget.value)
+        )
+        .toBe(SELECTED_MODEL)
+    })
+  }
+)
diff --git a/browser_tests/tests/cloud.spec.ts b/browser_tests/tests/cloud.spec.ts
index 3aa339af6b..2ebacf7fe0 100644
--- a/browser_tests/tests/cloud.spec.ts
+++ b/browser_tests/tests/cloud.spec.ts
@@ -1,6 +1,9 @@
 import { expect } from '@playwright/test'
 import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
 
+const APP_URL = process.env.PLAYWRIGHT_TEST_URL || 'http://localhost:8188'
+const SHARE_AUTH_STORAGE_KEY = 'Comfy.PreservedQuery.share_auth'
+
 /**
  * Cloud distribution E2E tests.
  *
@@ -14,15 +17,31 @@ test.describe('Cloud distribution UI', { tag: '@cloud' }, () => {
   test('cloud build redirects unauthenticated users to login', async ({
     page
   }) => {
-    await page.goto('http://localhost:8188')
+    await page.goto(APP_URL)
     // Cloud build has an auth guard that redirects to /cloud/login.
     // This route only exists in the cloud distribution — it's tree-shaken
     // in the OSS build. Its presence confirms the cloud build is active.
     await expect(page).toHaveURL(/\/cloud\/login/, { timeout: 10_000 })
   })
 
+  test('preserves share auth attribution before redirecting logged-out users', async ({
+    page
+  }) => {
+    await page.goto(new URL('/?share=abc', APP_URL).toString())
+
+    await expect(page).toHaveURL(/\/cloud\/login/, { timeout: 10_000 })
+    await expect
+      .poll(() =>
+        page.evaluate(
+          (key) => sessionStorage.getItem(key),
+          SHARE_AUTH_STORAGE_KEY
+        )
+      )
+      .toBe(JSON.stringify({ share: 'abc' }))
+  })
+
   test('cloud login page renders sign-in options', async ({ page }) => {
-    await page.goto('http://localhost:8188')
+    await page.goto(APP_URL)
     await expect(page).toHaveURL(/\/cloud\/login/, { timeout: 10_000 })
     // Verify cloud-specific login UI is rendered
     await expect(page.getByRole('button', { name: /google/i })).toBeVisible()
diff --git a/browser_tests/tests/maskEditor.spec.ts b/browser_tests/tests/maskEditor.spec.ts
index d6a084a6f9..0db46ed66f 100644
--- a/browser_tests/tests/maskEditor.spec.ts
+++ b/browser_tests/tests/maskEditor.spec.ts
@@ -254,21 +254,8 @@ test.describe('Mask Editor', { tag: '@vue-nodes' }, () => {
   }) => {
     const dialog = await maskEditor.openDialog()
 
-    let maskUploadCount = 0
     let imageUploadCount = 0
 
-    await comfyPage.page.route('**/upload/mask', (route) => {
-      maskUploadCount++
-      return route.fulfill({
-        status: 200,
-        contentType: 'application/json',
-        body: JSON.stringify({
-          name: `test-mask-${maskUploadCount}.png`,
-          subfolder: 'clipspace',
-          type: 'input'
-        })
-      })
-    })
     await comfyPage.page.route('**/upload/image', (route) => {
       imageUploadCount++
       return route.fulfill({
@@ -288,20 +275,17 @@ test.describe('Mask Editor', { tag: '@vue-nodes' }, () => {
 
     await expect(dialog).toBeHidden()
 
-    // The save pipeline uploads multiple layers (mask + image variants)
+    // The save pipeline uploads four layers (masked, paint, painted, paintedMasked)
+    // through the unified /upload/image endpoint.
     expect(
-      maskUploadCount + imageUploadCount,
-      'save should trigger upload calls'
-    ).toBeGreaterThan(0)
+      imageUploadCount,
+      'save should upload all four layers via /upload/image'
+    ).toBe(4)
   })
 
   test('save failure keeps dialog open', async ({ comfyPage, maskEditor }) => {
     const dialog = await maskEditor.openDialog()
 
-    // Fail all upload routes
-    await comfyPage.page.route('**/upload/mask', (route) =>
-      route.fulfill({ status: 500 })
-    )
     await comfyPage.page.route('**/upload/image', (route) =>
       route.fulfill({ status: 500 })
     )
diff --git a/browser_tests/tests/maskEditorLoadSave.spec.ts b/browser_tests/tests/maskEditorLoadSave.spec.ts
index 100259851d..1c418c2331 100644
--- a/browser_tests/tests/maskEditorLoadSave.spec.ts
+++ b/browser_tests/tests/maskEditorLoadSave.spec.ts
@@ -34,19 +34,17 @@ test.describe('Mask Editor load/save', { tag: '@vue-nodes' }, () => {
     let observedContentType = ''
     let observedBodyLength = 0
 
-    await comfyPage.page.route('**/upload/mask', async (route) => {
+    await comfyPage.page.route('**/upload/image', async (route) => {
       const request = route.request()
-      observedContentType = (await request.headerValue('content-type')) ?? ''
-      observedBodyLength = request.postDataBuffer()?.byteLength ?? 0
+      if (!observedContentType) {
+        observedContentType = (await request.headerValue('content-type')) ?? ''
+        observedBodyLength = request.postDataBuffer()?.byteLength ?? 0
+      }
       await route.fulfill(
         fulfillJson(successResponse('clipspace-mask-123.png'))
       )
     })
 
-    await comfyPage.page.route('**/upload/image', (route) =>
-      route.fulfill(fulfillJson(successResponse('clipspace-painted-123.png')))
-    )
-
     await dialog.getByRole('button', { name: 'Save' }).click()
     await expect(dialog).toBeHidden()
     expect(observedContentType).toContain('multipart/form-data')
@@ -69,24 +67,11 @@ test.describe('Mask Editor load/save', { tag: '@vue-nodes' }, () => {
     await expect(dialog).toBeVisible()
   })
 
-  test('Save failure on partial upload keeps dialog open', async ({
-    comfyPage,
-    maskEditor
-  }) => {
+  test('Save failure keeps dialog open', async ({ comfyPage, maskEditor }) => {
     const dialog = await maskEditor.openDialog()
     await maskEditor.drawStrokeAndExpectPixels(dialog)
 
-    // The saver uploads sequentially: mask layer first, then image layers.
-    // Let the mask upload succeed and the image upload fail to exercise both
-    // endpoints and verify the dialog stays open after a partial failure.
-    let maskUploadHit = false
     let imageUploadHit = false
-    await comfyPage.page.route('**/upload/mask', (route) => {
-      maskUploadHit = true
-      return route.fulfill(
-        fulfillJson(successResponse('clipspace-mask-999.png'))
-      )
-    })
     await comfyPage.page.route('**/upload/image', (route) => {
       imageUploadHit = true
       return route.fulfill({ status: 500 })
@@ -95,7 +80,6 @@ test.describe('Mask Editor load/save', { tag: '@vue-nodes' }, () => {
     const saveButton = dialog.getByRole('button', { name: 'Save' })
     await saveButton.click()
 
-    await expect.poll(() => maskUploadHit).toBe(true)
     await expect.poll(() => imageUploadHit).toBe(true)
     await expect(dialog).toBeVisible()
     await expect(saveButton).toBeVisible()
diff --git a/browser_tests/tests/propertiesPanel/errorsTabMissingModels.spec.ts b/browser_tests/tests/propertiesPanel/errorsTabMissingModels.spec.ts
index c071201417..c41fd6145e 100644
--- a/browser_tests/tests/propertiesPanel/errorsTabMissingModels.spec.ts
+++ b/browser_tests/tests/propertiesPanel/errorsTabMissingModels.spec.ts
@@ -143,7 +143,7 @@ test.describe('Errors tab - Missing models', { tag: '@ui' }, () => {
         const objectInfo = await response.json()
         const ckptName =
           objectInfo.CheckpointLoaderSimple.input.required.ckpt_name
-        ckptName[0] = [...ckptName[0], 'fake_model.safetensors']
+        ckptName[0] = [...ckptName[0], FAKE_MODEL_NAME]
         await route.fulfill({ response, json: objectInfo })
       })
 
@@ -151,21 +151,11 @@ test.describe('Errors tab - Missing models', { tag: '@ui' }, () => {
         const url = new URL(response.url())
         return url.pathname.endsWith('/object_info') && response.ok()
       })
-      const modelFoldersResponse = comfyPage.page.waitForResponse(
-        (response) => {
-          const url = new URL(response.url())
-          return url.pathname.endsWith('/experiment/models') && response.ok()
-        }
-      )
       const refreshButton = comfyPage.page.getByTestId(
         TestIds.dialogs.missingModelRefresh
       )
 
-      await Promise.all([
-        objectInfoResponse,
-        modelFoldersResponse,
-        refreshButton.click()
-      ])
+      await Promise.all([objectInfoResponse, refreshButton.click()])
       await expect(
         comfyPage.page.getByTestId(TestIds.dialogs.missingModelsGroup)
       ).toBeHidden()
diff --git a/browser_tests/tests/sidebar/assets.spec.ts b/browser_tests/tests/sidebar/assets.spec.ts
index 9957776296..f8de38815f 100644
--- a/browser_tests/tests/sidebar/assets.spec.ts
+++ b/browser_tests/tests/sidebar/assets.spec.ts
@@ -13,10 +13,6 @@ import type {
 // Legacy coverage backed by AssetsHelper's shadow backend. New assets-sidebar
 // browser coverage should use typed route mocks in assetsSidebarTab.spec.ts.
 
-// ---------------------------------------------------------------------------
-// Shared fixtures
-// ---------------------------------------------------------------------------
-
 const SAMPLE_JOBS: RawJobListItem[] = [
   createMockJob({
     id: 'job-alpha',
@@ -180,12 +176,10 @@ test.describe('Assets sidebar - tab navigation', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Switch to Imported
     await tab.switchToImported()
     await expect(tab.importedTab).toHaveAttribute('aria-selected', 'true')
     await expect(tab.generatedTab).toHaveAttribute('aria-selected', 'false')
 
-    // Switch back to Generated
     await tab.switchToGenerated()
     await expect(tab.generatedTab).toHaveAttribute('aria-selected', 'true')
   })
@@ -194,11 +188,9 @@ test.describe('Assets sidebar - tab navigation', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Type search in Generated tab
     await tab.searchInput.fill('landscape')
     await expect(tab.searchInput).toHaveValue('landscape')
 
-    // Switch to Imported tab
     await tab.switchToImported()
     await expect(tab.searchInput).toHaveValue('')
   })
@@ -235,10 +227,8 @@ test.describe('Assets sidebar - grid view display', () => {
     await tab.open()
     await tab.switchToImported()
 
-    // Wait for imported assets to render
     await expect(tab.assetCards.first()).toBeVisible()
 
-    // Imported tab should show the mocked files
     await expect.poll(() => tab.assetCards.count()).toBeGreaterThanOrEqual(1)
   })
 
@@ -286,11 +276,9 @@ test.describe('Assets sidebar - view mode toggle', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Open settings menu and select list view
     await tab.openSettingsMenu()
     await tab.listViewOption.click()
 
-    // List view items should now be visible
     await expect(tab.listViewItems.first()).toBeVisible()
   })
 
@@ -298,16 +286,13 @@ test.describe('Assets sidebar - view mode toggle', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Switch to list view
     await tab.openSettingsMenu()
     await tab.listViewOption.click()
     await expect(tab.listViewItems.first()).toBeVisible()
 
-    // Switch back to grid view (settings popover is still open)
     await tab.gridViewOption.click()
     await tab.waitForAssets()
 
-    // Grid cards (with data-selected attribute) should be visible again
     await expect(tab.assetCards.first()).toBeVisible()
   })
 })
@@ -342,10 +327,8 @@ test.describe('Assets sidebar - search', () => {
 
     const initialCount = await tab.assetCards.count()
 
-    // Search for a specific filename that matches only one asset
     await tab.searchInput.fill('landscape')
 
-    // Wait for filter to reduce the count
     await expect.poll(() => tab.assetCards.count()).toBeLessThan(initialCount)
   })
 
@@ -355,7 +338,6 @@ test.describe('Assets sidebar - search', () => {
 
     const initialCount = await tab.assetCards.count()
 
-    // Filter then clear
     await tab.searchInput.fill('landscape')
     await expect.poll(() => tab.assetCards.count()).toBeLessThan(initialCount)
 
@@ -391,10 +373,8 @@ test.describe('Assets sidebar - selection', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Click first asset card
     await tab.assetCards.first().click()
 
-    // Should have data-selected="true"
     await expect(tab.selectedCards).toHaveCount(1)
   })
 
@@ -405,11 +385,9 @@ test.describe('Assets sidebar - selection', () => {
     const cards = tab.assetCards
     await expect.poll(() => cards.count()).toBeGreaterThanOrEqual(2)
 
-    // Click first card
     await cards.first().click()
     await expect(tab.selectedCards).toHaveCount(1)
 
-    // Ctrl+click second card
     await cards.nth(1).click({ modifiers: ['ControlOrMeta'] })
     await expect(tab.selectedCards).toHaveCount(2)
   })
@@ -420,10 +398,8 @@ test.describe('Assets sidebar - selection', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Select an asset
     await tab.assetCards.first().click()
 
-    // Footer should show selection count
     await expect(tab.selectionCountButton).toBeVisible()
   })
 
@@ -431,15 +407,10 @@ test.describe('Assets sidebar - selection', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Select an asset
     await tab.assetCards.first().click()
     await expect(tab.selectedCards).toHaveCount(1)
 
-    // Hover over the selection count button to reveal "Deselect all"
-    await tab.selectionCountButton.hover()
     await expect(tab.deselectAllButton).toBeVisible()
-
-    // Click "Deselect all"
     await tab.deselectAllButton.click()
     await expect(tab.selectedCards).toHaveCount(0)
   })
@@ -448,14 +419,11 @@ test.describe('Assets sidebar - selection', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Select an asset
     await tab.assetCards.first().click()
     await expect(tab.selectedCards).toHaveCount(1)
 
-    // Switch to Imported tab
     await tab.switchToImported()
 
-    // Switch back - selection should be cleared
     await tab.switchToGenerated()
     await tab.waitForAssets()
     await expect(tab.selectedCards).toHaveCount(0)
@@ -481,10 +449,8 @@ test.describe('Assets sidebar - context menu', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Right-click first asset
     await tab.assetCards.first().click({ button: 'right' })
 
-    // Context menu should appear with standard items
     const contextMenu = comfyPage.page.locator('.p-contextmenu')
     await expect(contextMenu).toBeVisible()
   })
@@ -565,8 +531,6 @@ test.describe('Assets sidebar - context menu', () => {
   test('Cancelling export-workflow filename prompt does not show an error toast', async ({
     comfyPage
   }) => {
-    // job-gamma is the first card; its detail carries a valid workflow so
-    // extraction succeeds and the filename prompt opens.
     await comfyPage.assets.mockJobDetail('job-gamma', JOB_GAMMA_DETAIL)
 
     const tab = comfyPage.menu.assetsTab
@@ -614,8 +578,6 @@ test.describe('Assets sidebar - context menu', () => {
   test('Export-workflow shows a warning toast when the asset has no workflow', async ({
     comfyPage
   }) => {
-    // Strip the workflow field so extraction yields null and the export
-    // action returns { success: false, error: 'No workflow…' }.
     const { workflow: _, ...detailWithoutWorkflow } = JOB_GAMMA_DETAIL
     await comfyPage.assets.mockJobDetail('job-gamma', detailWithoutWorkflow)
 
@@ -625,7 +587,6 @@ test.describe('Assets sidebar - context menu', () => {
     await tab.assetCards.first().click({ button: 'right' })
     await tab.contextMenuItem('Export workflow').click()
 
-    // Filename prompt should be skipped: extraction fails before the prompt.
     await expect(comfyPage.toast.toastWarnings).toBeVisible()
     await expect(comfyPage.toast.toastSuccesses).toBeHidden({ timeout: 1500 })
   })
@@ -639,23 +600,18 @@ test.describe('Assets sidebar - context menu', () => {
     const cards = tab.assetCards
     await expect.poll(() => cards.count()).toBeGreaterThanOrEqual(2)
 
-    // Dismiss any toasts that appeared after asset loading
     await tab.dismissToasts()
 
-    // Multi-select: use keyboard.down/up so useKeyModifier('Control') detects
-    // the modifier — click({ modifiers }) only sets the mouse event flag and
-    // does not fire a keydown event that VueUse tracks.
+    // useKeyModifier('Control') needs keyboard events, not click modifiers.
     await cards.first().click()
     await comfyPage.page.keyboard.down('Control')
     await cards.nth(1).click()
     await comfyPage.page.keyboard.up('Control')
 
-    // Verify multi-selection took effect and footer is stable before right-clicking
     await expect(tab.selectedCards).toHaveCount(2)
     await expect(tab.selectionFooter).toBeVisible()
 
-    // Use dispatchEvent instead of click({ button: 'right' }) to avoid any
-    // overlay intercepting the event, and assert directly without toPass.
+    // dispatchEvent avoids the selection footer intercepting a right click.
     const contextMenu = comfyPage.page.locator('.p-contextmenu')
     await cards.first().dispatchEvent('contextmenu', {
       bubbles: true,
@@ -664,7 +620,6 @@ test.describe('Assets sidebar - context menu', () => {
     })
     await expect(contextMenu).toBeVisible()
 
-    // Bulk menu should show bulk download action
     await expect(tab.contextMenuItem('Download all')).toBeVisible()
   })
 })
@@ -692,7 +647,6 @@ test.describe('Assets sidebar - bulk actions', () => {
 
     await tab.assetCards.first().click()
 
-    // Download button in footer should be visible
     await expect(tab.downloadSelectedButton).toBeVisible()
   })
 
@@ -704,7 +658,6 @@ test.describe('Assets sidebar - bulk actions', () => {
 
     await tab.assetCards.first().click()
 
-    // Delete button in footer should be visible
     await expect(tab.deleteSelectedButton).toBeVisible()
   })
 
@@ -712,21 +665,67 @@ test.describe('Assets sidebar - bulk actions', () => {
     const tab = comfyPage.menu.assetsTab
     await tab.open()
 
-    // Select the two single-output assets (job-alpha, job-beta).
-    // The count reflects total outputs, not cards — job-gamma has
-    // outputs_count: 2 which would inflate the total.
     const cards = tab.assetCards
     await expect.poll(() => cards.count()).toBeGreaterThanOrEqual(3)
 
-    // Cards are sorted newest-first: gamma (idx 0), beta (1), alpha (2)
     await cards.nth(1).click()
     await comfyPage.page.keyboard.down('Control')
     await cards.nth(2).click()
     await comfyPage.page.keyboard.up('Control')
 
-    // Selection count should show the count
     await expect(tab.selectionCountButton).toBeVisible()
-    await expect(tab.selectionCountButton).toHaveText(/Assets Selected:\s*2\b/)
+    await expect(tab.selectionCountButton).toHaveText(/\b2 selected\b/)
+  })
+
+  test('Selection count sums the outputs of a stacked asset', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.assetsTab
+    await tab.open()
+
+    await tab.assetCards.first().click()
+
+    await expect(tab.selectionCountButton).toBeVisible()
+    await expect(tab.selectionCountButton).toHaveText(/\b2 selected\b/)
+  })
+
+  test('Selection bar stays capped, not stretched, on a wide panel', async ({
+    comfyPage
+  }) => {
+    await comfyPage.page.setViewportSize({ width: 1600, height: 900 })
+    const tab = comfyPage.menu.assetsTab
+    await tab.open()
+
+    const gutter = comfyPage.page.locator('.p-splitter-gutter').first()
+    await expect(gutter).toBeVisible()
+    const gutterBox = await gutter.boundingBox()
+    if (!gutterBox) {
+      throw new Error('sidebar splitter gutter has no bounding box')
+    }
+    await comfyPage.page.mouse.move(
+      gutterBox.x + gutterBox.width / 2,
+      gutterBox.y + gutterBox.height / 2
+    )
+    await comfyPage.page.mouse.down()
+    await comfyPage.page.mouse.move(900, gutterBox.y + gutterBox.height / 2, {
+      steps: 12
+    })
+    await comfyPage.page.mouse.up()
+
+    await tab.assetCards.first().click()
+    await expect(tab.selectionFooter).toBeVisible()
+
+    const sidebar = comfyPage.page.locator('.side-bar-panel').first()
+    await expect
+      .poll(async () => (await sidebar.boundingBox())?.width ?? 0)
+      .toBeGreaterThan(520)
+    await expect
+      .poll(async () => {
+        const bar = await tab.selectionFooter.boundingBox()
+        const side = await sidebar.boundingBox()
+        return bar && side ? side.width - bar.width : 0
+      })
+      .toBeGreaterThan(100)
   })
 })
 
@@ -833,8 +832,7 @@ test.describe('Assets sidebar - pagination', () => {
     await comfyPage.assets.mockOutputHistory(manyJobs)
     await comfyPage.setup()
 
-    // Capture the first history fetch (terminal statuses only).
-    // Queue polling also hits /jobs but with status=in_progress,pending.
+    // Queue polling also calls /jobs, so wait for completed history only.
     const firstRequest = comfyPage.page.waitForRequest((req) => {
       if (!/\/api\/jobs\?/.test(req.url())) return false
       const url = new URL(req.url())
@@ -1002,9 +1000,7 @@ const MIXED_MEDIA_JOBS: RawJobListItem[] = [
   })
 ]
 
-// Filter button is guarded by isCloud (compile-time). The cloud CI project
-// cannot use comfyPageFixture (auth required). Enable once cloud E2E infra
-// supports authenticated comfyPage setup.
+// Filter button is guarded by isCloud; cloud CI needs authenticated setup.
 test.describe('Assets sidebar - media type filter', () => {
   test.fixme(true, 'Requires DISTRIBUTION=cloud build with auth bypass')
 
@@ -1040,12 +1036,9 @@ test.describe('Assets sidebar - media type filter', () => {
       'All three mixed-media jobs should render'
     ).toHaveCount(3)
 
-    // Open filter menu and enable only image filter (selecting a filter
-    // restricts to that type only, hiding unselected types)
     await tab.openFilterMenu()
     await tab.filterCheckbox('Image').click()
 
-    // Only the image asset should remain
     await expect(tab.assetCards).toHaveCount(1, { timeout: 5000 })
     await expect(tab.getAssetCardByName('photo.png')).toBeVisible()
   })
@@ -1056,12 +1049,10 @@ test.describe('Assets sidebar - media type filter', () => {
 
     const initialCount = await tab.assetCards.count()
 
-    // Enable image filter to restrict to images only
     await tab.openFilterMenu()
     await tab.filterCheckbox('Image').click()
     await expect(tab.assetCards).toHaveCount(1, { timeout: 5000 })
 
-    // Uncheck image filter to remove all filters (restores all assets)
     await tab.filterCheckbox('Image').click()
     await expect(tab.assetCards).toHaveCount(initialCount, { timeout: 5000 })
   })
diff --git a/browser_tests/tests/sidebar/assetsSidebarTab.spec.ts b/browser_tests/tests/sidebar/assetsSidebarTab.spec.ts
index 270c050a3b..becfffc4cb 100644
--- a/browser_tests/tests/sidebar/assetsSidebarTab.spec.ts
+++ b/browser_tests/tests/sidebar/assetsSidebarTab.spec.ts
@@ -214,7 +214,7 @@ test.describe('FE-130 assets sidebar route mocks', () => {
     await tab.open()
 
     await tab.getAssetCardByName('alpha').click()
-    await expect(tab.selectionCountButton).toHaveText(/Assets Selected:\s*1\b/)
+    await expect(tab.selectionCountButton).toHaveText(/\b1 selected\b/)
     await expect(tab.deleteSelectedButton).toBeVisible()
     await expect(tab.downloadSelectedButton).toBeVisible()
 
@@ -222,7 +222,7 @@ test.describe('FE-130 assets sidebar route mocks', () => {
     await tab.getAssetCardByName('beta').click()
     await comfyPage.page.keyboard.up('Control')
 
-    await expect(tab.selectionCountButton).toHaveText(/Assets Selected:\s*2\b/)
+    await expect(tab.selectionCountButton).toHaveText(/\b2 selected\b/)
     await expect(tab.deleteSelectedButton).toBeVisible()
     await expect(tab.downloadSelectedButton).toBeVisible()
   })
diff --git a/browser_tests/tests/sidebar/modelLibrary.spec.ts b/browser_tests/tests/sidebar/modelLibrary.spec.ts
index b49adc7cd5..96ca924e7f 100644
--- a/browser_tests/tests/sidebar/modelLibrary.spec.ts
+++ b/browser_tests/tests/sidebar/modelLibrary.spec.ts
@@ -233,4 +233,64 @@ test.describe('Model library sidebar - empty state', () => {
     await expect(tab.folderNodes).toHaveCount(0)
     await expect(tab.leafNodes).toHaveCount(0)
   })
+
+  test.describe('Model library sidebar - add node', () => {
+    test.beforeEach(async ({ comfyPage }) => {
+      await comfyPage.modelLibrary.mockFoldersWithFiles(MOCK_FOLDERS)
+      await comfyPage.setup()
+      await comfyPage.nodeOps.clearGraph()
+    })
+
+    test.afterEach(async ({ comfyPage }) => {
+      await comfyPage.modelLibrary.clearMocks()
+    })
+
+    test('Clicking a model defers creation until placed on the canvas', async ({
+      comfyPage
+    }) => {
+      const tab = comfyPage.menu.modelLibraryTab
+      await tab.open()
+      await tab.getFolderByLabel('checkpoints').click()
+      await expect(tab.getLeafByLabel('sd_xl_base_1.0')).toBeVisible()
+
+      await tab.getLeafByLabel('sd_xl_base_1.0').click()
+
+      await expect
+        .poll(() => comfyPage.nodeOps.getGraphNodesCount(), { timeout: 1000 })
+        .toBe(0)
+
+      const canvasBox = (await comfyPage.canvas.boundingBox())!
+      await comfyPage.canvas.click({
+        position: { x: canvasBox.width / 2, y: canvasBox.height / 2 }
+      })
+
+      await expect.poll(() => comfyPage.nodeOps.getGraphNodesCount()).toBe(1)
+      await expect
+        .poll(() => comfyPage.nodeOps.getSelectedGraphNodesCount())
+        .toBe(1)
+
+      const [loader] = await comfyPage.nodeOps.getNodeRefsByType(
+        'CheckpointLoaderSimple'
+      )
+      expect(loader).toBeDefined()
+      const widget = await loader.getWidgetByName('ckpt_name')
+      expect(await widget.getValue()).toBe('sd_xl_base_1.0.safetensors')
+    })
+
+    test('Ghost preview shows the model in the loader widget before placing', async ({
+      comfyPage
+    }) => {
+      const tab = comfyPage.menu.modelLibraryTab
+      await tab.open()
+      await tab.getFolderByLabel('checkpoints').click()
+      await expect(tab.getLeafByLabel('sd_xl_base_1.0')).toBeVisible()
+
+      await tab.getLeafByLabel('sd_xl_base_1.0').click()
+
+      const ghost = comfyPage.page.locator(
+        '[data-node-id="preview-CheckpointLoaderSimple"]'
+      )
+      await expect(ghost).toContainText('sd_xl_base_1.0.safetensors')
+    })
+  })
 })
diff --git a/browser_tests/tests/subgraph/subgraphLifecycle.spec.ts b/browser_tests/tests/subgraph/subgraphLifecycle.spec.ts
index 1eaf7293da..d35529da1f 100644
--- a/browser_tests/tests/subgraph/subgraphLifecycle.spec.ts
+++ b/browser_tests/tests/subgraph/subgraphLifecycle.spec.ts
@@ -1,6 +1,9 @@
+import type { ConsoleMessage } from '@playwright/test'
 import { expect } from '@playwright/test'
 
+import type { ComfyPage } from '@e2e/fixtures/ComfyPage'
 import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
+import { TestIds } from '@e2e/fixtures/selectors'
 import { getPseudoPreviewWidgets } from '@e2e/fixtures/utils/promotedWidgets'
 
 const domPreviewSelector = '.image-preview'
@@ -95,4 +98,225 @@ test.describe('Subgraph Lifecycle', { tag: ['@subgraph'] }, () => {
       await expect(comfyPage.page.locator(domPreviewSelector)).toHaveCount(0)
     })
   })
+
+  test.describe('Detach Race Repro', { tag: ['@vue-nodes'] }, () => {
+    const SUBGRAPH_NODE_TITLE = 'New Subgraph'
+
+    // Queues legacy onNodeRemoved/onSelectionChange so unpack completes first,
+    // widening the race window so a guard regression deterministically surfaces.
+    async function deferLegacyHandlers(comfyPage: ComfyPage) {
+      return await comfyPage.page.evaluateHandle(() => {
+        const graph = window.app!.graph!
+        const canvas = window.app!.canvas!
+        const queue: Array<() => void> = []
+        const originalNodeRemoved = graph.onNodeRemoved
+        const originalSelectionChange = canvas.onSelectionChange
+        graph.onNodeRemoved = function (node) {
+          queue.push(() => originalNodeRemoved?.call(this, node))
+        }
+        canvas.onSelectionChange = function (selected) {
+          queue.push(() => originalSelectionChange?.call(this, selected))
+        }
+        return {
+          drain: () => {
+            for (const fn of queue.splice(0)) fn()
+          },
+          restore: () => {
+            graph.onNodeRemoved = originalNodeRemoved
+            canvas.onSelectionChange = originalSelectionChange
+          }
+        }
+      })
+    }
+
+    type DeferredHandlers = Awaited<ReturnType<typeof deferLegacyHandlers>>
+
+    // Defers only the legacy selection-change callback, so the detached host
+    // node lingers in the reactive selection while onNodeRemoved still runs
+    // normally and clears it from the canvas. This isolates the panel render
+    // path: a panel mounted during this window reads the stale selection.
+    async function deferSelectionChange(
+      comfyPage: ComfyPage
+    ): Promise<DeferredHandlers> {
+      return await comfyPage.page.evaluateHandle(() => {
+        const canvas = window.app!.canvas!
+        const queue: Array<() => void> = []
+        const original = canvas.onSelectionChange
+        canvas.onSelectionChange = function (selected) {
+          queue.push(() => original?.call(this, selected))
+        }
+        return {
+          drain: () => {
+            for (const fn of queue.splice(0)) fn()
+          },
+          restore: () => {
+            canvas.onSelectionChange = original
+          }
+        }
+      })
+    }
+
+    function isNullGraphErrorText(text: string): boolean {
+      return text.includes('NullGraphError') || text.endsWith('has no graph')
+    }
+
+    // Vue's default errorHandler routes render throws to console.error,
+    // not pageerror - listen to both.
+    function captureNullGraphErrors(comfyPage: ComfyPage) {
+      const captured: string[] = []
+      const onPageError = (err: Error) => {
+        if (
+          err.name === 'NullGraphError' ||
+          isNullGraphErrorText(err.message ?? '')
+        ) {
+          captured.push(`pageerror ${err.name}: ${err.message}`)
+        }
+      }
+      const onConsoleMessage = (msg: ConsoleMessage) => {
+        if (msg.type() !== 'error') return
+        const text = msg.text()
+        if (isNullGraphErrorText(text)) {
+          captured.push(`console.error: ${text}`)
+        }
+      }
+      comfyPage.page.on('pageerror', onPageError)
+      comfyPage.page.on('console', onConsoleMessage)
+      return {
+        getErrors: () => [...captured],
+        stop: () => {
+          comfyPage.page.off('pageerror', onPageError)
+          comfyPage.page.off('console', onConsoleMessage)
+        }
+      }
+    }
+
+    async function unpackViaContextMenu(comfyPage: ComfyPage, title: string) {
+      const fixture = await comfyPage.vueNodes.getFixtureByTitle(title)
+      await comfyPage.contextMenu.openForVueNode(fixture.header)
+      await comfyPage.contextMenu.clickMenuItemExact('Unpack Subgraph')
+    }
+
+    async function reopenRightSidePanel(comfyPage: ComfyPage) {
+      const { propertiesPanel } = comfyPage.menu
+      await propertiesPanel.toggleButton.click()
+      await expect(propertiesPanel.root).toBeHidden()
+      await propertiesPanel.toggleButton.click()
+      await comfyPage.nextFrame()
+    }
+
+    // Unpacks the subgraph behind deferred teardown, runs an optional
+    // interaction while the node is detached but not yet cleaned up, then
+    // drains the deferred handlers and reports any NullGraphErrors seen.
+    async function unpackAndCaptureNullGraphErrors(
+      comfyPage: ComfyPage,
+      options: {
+        defer: (comfyPage: ComfyPage) => Promise<DeferredHandlers>
+        duringWindow?: (comfyPage: ComfyPage) => Promise<void>
+      }
+    ): Promise<string[]> {
+      const subgraphNode =
+        comfyPage.vueNodes.getNodeByTitle(SUBGRAPH_NODE_TITLE)
+      const errors = captureNullGraphErrors(comfyPage)
+      const deferred = await options.defer(comfyPage)
+      try {
+        await unpackViaContextMenu(comfyPage, SUBGRAPH_NODE_TITLE)
+        await expect(subgraphNode).toHaveCount(0)
+        await options.duringWindow?.(comfyPage)
+        await deferred.evaluate((handlers) => handlers.drain())
+        // Let drained-handler reactive flushes settle before stop().
+        await comfyPage.nextFrame()
+        return errors.getErrors()
+      } finally {
+        await deferred.evaluate((handlers) => handlers.restore())
+        await deferred.dispose()
+        errors.stop()
+      }
+    }
+
+    test.beforeEach(async ({ comfyPage }) => {
+      await comfyPage.settings.setSetting('Comfy.RightSidePanel.IsOpen', true)
+      await comfyPage.workflow.loadWorkflow(
+        'subgraphs/subgraph-with-promoted-text-widget'
+      )
+      const subgraphNode =
+        comfyPage.vueNodes.getNodeByTitle(SUBGRAPH_NODE_TITLE)
+      await expect(subgraphNode).toBeVisible()
+
+      const fixture =
+        await comfyPage.vueNodes.getFixtureByTitle(SUBGRAPH_NODE_TITLE)
+      await fixture.header.click()
+      await expect(
+        comfyPage.page.getByTestId(TestIds.propertiesPanel.root)
+      ).toBeVisible()
+      await comfyPage.nextFrame()
+    })
+
+    test('unpack does not surface NullGraphError on the LGraphNode render path', async ({
+      comfyPage
+    }) => {
+      const nullGraphErrors = await unpackAndCaptureNullGraphErrors(comfyPage, {
+        defer: deferLegacyHandlers
+      })
+      expect(
+        nullGraphErrors,
+        'LGraphNode render path: detach race must not surface NullGraphError'
+      ).toEqual([])
+    })
+
+    test('unpack does not surface NullGraphError from the TabSubgraphInputs panel', async ({
+      comfyPage
+    }) => {
+      const nullGraphErrors = await unpackAndCaptureNullGraphErrors(comfyPage, {
+        defer: deferLegacyHandlers
+      })
+      expect(
+        nullGraphErrors,
+        'TabSubgraphInputs panel: detach race must not surface NullGraphError'
+      ).toEqual([])
+    })
+
+    test('unpack with subgraph editor open does not surface NullGraphError from the SubgraphEditor panel', async ({
+      comfyPage
+    }) => {
+      await comfyPage.page.getByTestId(TestIds.subgraphEditor.toggle).click()
+      await comfyPage.nextFrame()
+
+      const nullGraphErrors = await unpackAndCaptureNullGraphErrors(comfyPage, {
+        defer: deferLegacyHandlers
+      })
+      expect(
+        nullGraphErrors,
+        'SubgraphEditor panel: detach race must not surface NullGraphError'
+      ).toEqual([])
+    })
+
+    test('reopening the right side panel after unpack does not surface NullGraphError', async ({
+      comfyPage
+    }) => {
+      const nullGraphErrors = await unpackAndCaptureNullGraphErrors(comfyPage, {
+        defer: deferSelectionChange,
+        duringWindow: reopenRightSidePanel
+      })
+      expect(
+        nullGraphErrors,
+        'TabSubgraphInputs remount: stale selection must not surface NullGraphError'
+      ).toEqual([])
+    })
+
+    test('reopening the right side panel with the subgraph editor open does not surface NullGraphError', async ({
+      comfyPage
+    }) => {
+      await comfyPage.page.getByTestId(TestIds.subgraphEditor.toggle).click()
+      await comfyPage.nextFrame()
+
+      const nullGraphErrors = await unpackAndCaptureNullGraphErrors(comfyPage, {
+        defer: deferSelectionChange,
+        duringWindow: reopenRightSidePanel
+      })
+      expect(
+        nullGraphErrors,
+        'SubgraphEditor remount: stale selection must not surface NullGraphError'
+      ).toEqual([])
+    })
+  })
 })
diff --git a/browser_tests/tests/vueNodes/groups/groups.spec.ts b/browser_tests/tests/vueNodes/groups/groups.spec.ts
index a5ef085a99..9d922a58c0 100644
--- a/browser_tests/tests/vueNodes/groups/groups.spec.ts
+++ b/browser_tests/tests/vueNodes/groups/groups.spec.ts
@@ -280,3 +280,36 @@ test.describe('Vue Node Groups', { tag: ['@screenshot', '@vue-nodes'] }, () => {
     await expect.poll(bypassCount, "won't toggle double selected node").toBe(7)
   })
 })
+
+test.describe(
+  'Vue Node Group Context Menu',
+  { tag: ['@vue-nodes', '@canvas'] },
+  () => {
+    test('right-clicking a group opens the Vue context menu instead of the legacy menu', async ({
+      comfyPage
+    }) => {
+      // Deselect so the right-click selects the group itself.
+      await comfyPage.keyboard.selectAll()
+      await comfyPage.page.keyboard.press(CREATE_GROUP_HOTKEY)
+      await expect
+        .poll(() => comfyPage.page.evaluate(() => graph!.groups.length))
+        .toBe(1)
+      await comfyPage.page.mouse.click(100, 100)
+      await comfyPage.nextFrame()
+
+      const groupPos = await getGroupTitlePosition(comfyPage, 'Group')
+      await comfyPage.page.mouse.click(groupPos.x, groupPos.y, {
+        button: 'right'
+      })
+
+      await expect(comfyPage.contextMenu.primeVueMenu).toBeVisible()
+      await expect(comfyPage.contextMenu.litegraphContextMenu).toBeHidden()
+      await expect(comfyPage.contextMenu.litegraphMenu).toBeHidden()
+
+      // Group-only action confirms it is the group menu.
+      await expect(
+        comfyPage.contextMenu.primeVueMenu.getByText('Fit Group To Nodes')
+      ).toBeVisible()
+    })
+  }
+)
diff --git a/browser_tests/tests/vueNodes/interactions/node/move.spec.ts b/browser_tests/tests/vueNodes/interactions/node/move.spec.ts
index fdef92810c..381c57b074 100644
--- a/browser_tests/tests/vueNodes/interactions/node/move.spec.ts
+++ b/browser_tests/tests/vueNodes/interactions/node/move.spec.ts
@@ -335,6 +335,30 @@ test.describe('Vue Node Moving', { tag: '@vue-nodes' }, () => {
     await comfyPage.canvasOps.moveMouseToEmptyArea()
   })
 
+  test('pointerCancel stops autopan', async ({ comfyPage }) => {
+    const ksampler = await comfyPage.vueNodes.getFixtureByTitle('KSampler')
+    await ksampler.header.click({ trial: true })
+    await comfyPage.page.mouse.down()
+
+    const getOffset = () => comfyPage.canvasOps.getOffset()
+    const initialOffset = await getOffset()
+    await comfyPage.page.mouse.move(10, 10, { steps: 20 })
+    await expect.poll(getOffset, 'drag with autopan').not.toEqual(initialOffset)
+
+    await test.step('move outside pan range and cancel drag', async () => {
+      await comfyPage.page.mouse.move(400, 400, { steps: 20 })
+      await ksampler.header.evaluate((node) =>
+        node.dispatchEvent(new PointerEvent('pointercancel', { bubbles: true }))
+      )
+    })
+
+    const secondaryOffset = await getOffset()
+
+    await comfyPage.page.mouse.move(10, 10, { steps: 20 })
+    await comfyPage.nextFrame()
+    expect(await getOffset(), 'drag canceled').toEqual(secondaryOffset)
+  })
+
   test(
     '@mobile should allow moving nodes by dragging on touch devices',
     { tag: '@screenshot' },
diff --git a/package.json b/package.json
index 079590ae00..bb4ef07edd 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@comfyorg/comfyui-frontend",
-  "version": "1.47.2",
+  "version": "1.47.3",
   "private": true,
   "description": "Official front-end implementation of ComfyUI",
   "homepage": "https://comfy.org",
diff --git a/packages/registry-types/src/comfyRegistryTypes.ts b/packages/registry-types/src/comfyRegistryTypes.ts
index 182adf6eea..d7e82f2217 100644
--- a/packages/registry-types/src/comfyRegistryTypes.ts
+++ b/packages/registry-types/src/comfyRegistryTypes.ts
@@ -36,7 +36,7 @@ export interface paths {
         put?: never;
         /**
          * Create a new customer
-         * @description Creates a new customer using the provided token. No request body is needed as user information is extracted from the token.
+         * @description Creates a new customer. User identity is taken from the bearer token; the optional request body carries a Cloudflare Turnstile token used for server-side bot verification at signup (BE-1490). The body is optional — clients that do not run the Turnstile widget (e.g. the local OSS build) may omit it.
          */
         post: operations["createCustomer"];
         delete?: never;
@@ -239,6 +239,30 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/admin/sync-api-key-deletion": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Revoke a registry API key by hash (reverse delete-sync)
+         * @description Reverse-direction delete-sync (cloud → comfy-api registry, BE-1542). When a
+         *     workspace API key is deleted in cloud (the new source of truth), cloud calls
+         *     this endpoint so the comfy-api registry's api_keys row is removed too,
+         *     keeping the two stores convergent. Idempotent: deleting an unknown hash is a
+         *     no_op. M2M/admin-only; carries the key hash, never plaintext.
+         */
+        post: operations["SyncApiKeyDeletion"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/admin/generate-token": {
         parameters: {
             query?: never;
@@ -361,6 +385,26 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/customers/usage/timeseries": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /**
+         * Get customer's usage time series
+         * @description Returns the authenticated customer's gross usage spend, grouped by model, endpoint, or product, as one stacked data point per billing period, plus a per-group breakdown and a summary, for rendering a custom usage dashboard. Sourced from invoice line items (real USD). Replaces the embeddable iframe.
+         */
+        get: operations["GetCustomerUsageTimeSeries"];
+        put?: never;
+        post?: never;
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/customers/balance": {
         parameters: {
             query?: never;
@@ -1808,6 +1852,26 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/proxy/ideogram/ideogram-v4/generate": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Proxy request to Ideogram 4.0 for image generation
+         * @description Forwards text-to-image generation requests to Ideogram's 4.0 API and returns the results.
+         */
+        post: operations["ideogramV4Generate"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/proxy/kling/v1/account/costs": {
         parameters: {
             query?: never;
@@ -1893,6 +1957,57 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/proxy/kling/text-to-video/kling-3.0-turbo": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /** KlingAI 3.0 Turbo Create Video from Text */
+        post: operations["klingV2CreateVideoFromText"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/kling/image-to-video/kling-3.0-turbo": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /** KlingAI 3.0 Turbo Create Video from Image */
+        post: operations["klingV2CreateVideoFromImage"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/kling/tasks": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /** KlingAI 3.0 Turbo Query Task by ID */
+        get: operations["klingV2QueryTask"];
+        put?: never;
+        post?: never;
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/proxy/kling/v1/videos/video-extend": {
         parameters: {
             query?: never;
@@ -2384,6 +2499,46 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/proxy/bfl/v1/flux-tools/vto-v1": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Proxy request to BFL Flux Tools VTO v1 for virtual try-on
+         * @description Forwards virtual try-on requests to BFL's Flux Tools VTO v1 API and returns the results. Person and garment images are mapped to the underlying input image slots.
+         */
+        post: operations["bflVtoV1Generate"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/bfl/v1/flux-tools/erase-v1": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Proxy request to BFL Flux Tools Erase v1 for object removal
+         * @description Forwards erase requests to BFL's Flux Tools Erase v1 API and returns the results. Uses an input image and a mask identifying the object or region to remove.
+         */
+        post: operations["bflEraseV1Generate"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/proxy/bfl/flux-pro-1.0-expand/generate": {
         parameters: {
             query?: never;
@@ -2919,6 +3074,26 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/proxy/runway/video_to_video": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Runway Video to Video Generation
+         * @description Edits a video into a new video using Runway's API
+         */
+        post: operations["runwayVideoToVideo"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/proxy/veo/generate": {
         parameters: {
             query?: never;
@@ -3658,6 +3833,41 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/proxy/tripo/v2/openapi/import": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Import an External 3D Model into Tripo
+         * @description Composite endpoint for Tripo model import (PN-328). The client first uploads the
+         *     model file to ComfyUI API storage (POST /customers/storage) and then calls this
+         *     endpoint with the resulting download URL. The backend performs the full Tripo
+         *     import flow server-side: downloads the file from storage, obtains short-lived STS
+         *     upload credentials from Tripo, uploads the file to Tripo's object storage (SigV4),
+         *     and creates an import_model task referencing the uploaded object. Returns Tripo's
+         *     create-task response; poll /proxy/tripo/v2/openapi/task/{task_id} for completion.
+         *     The resulting task id is usable with Tripo post-processing tasks (texture_model,
+         *     animate_rig, convert_model, ...).
+         *
+         *     This is a synthetic comfy-api route (Tripo has no single-call equivalent); it
+         *     exists so that Tripo's temporary storage credentials never leave the backend and
+         *     no model binary ever travels inside this request.
+         *
+         *     The url host must be ComfyUI API storage (storage.googleapis.com).
+         *     Supported formats: glb, fbx, obj, stl. Maximum file size: 150MB.
+         */
+        post: operations["tripoImportModel"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/proxy/tripo/v2/openapi/task": {
         parameters: {
             query?: never;
@@ -4038,6 +4248,66 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/proxy/byteplus/api/v3/files": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Upload a file to BytePlus ModelArk
+         * @description Proxies POST https://ark.ap-southeast.bytepluses.com/api/v3/files. Uploads a binary file to ModelArk for later use (e.g. video understanding). See https://docs.byteplus.com/en/docs/ModelArk/1870405 for upstream details.
+         */
+        post: operations["byteplusFileUpload"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/byteplus/api/v3/files/{id}": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /**
+         * Retrieve BytePlus ModelArk file information
+         * @description Proxies GET https://ark.ap-southeast.bytepluses.com/api/v3/files/{id}. See https://docs.byteplus.com/en/docs/ModelArk/1870406 for upstream details.
+         */
+        get: operations["byteplusFileGet"];
+        put?: never;
+        post?: never;
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/byteplus/api/v3/responses": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Create a BytePlus ModelArk model response
+         * @description Proxies POST https://ark.ap-southeast.bytepluses.com/api/v3/responses. Creates a model response that supports text, image, video and file inputs, tool calls, structured output and deep-reasoning. See https://docs.byteplus.com/en/docs/ModelArk/1585128 for the upstream tutorial and request reference; the response object is documented at https://docs.byteplus.com/en/docs/ModelArk/1783703.
+         */
+        post: operations["byteplusResponseCreate"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/proxy/seedance/visual-validate/sessions": {
         parameters: {
             query?: never;
@@ -4755,6 +5025,212 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/proxy/anthropic/v1/messages": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Create a message via Anthropic Claude
+         * @description Forwards a Messages API request to Anthropic's `/v1/messages` endpoint
+         *     and returns the model's reply. Supports both JSON responses and
+         *     Server-Sent Events streaming (selected via `stream: true` in the body).
+         */
+        post: operations["anthropicCreateMessage"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/openrouter/api/v1/chat/completions": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Create a chat completion via OpenRouter
+         * @description Forwards a Chat Completions request to OpenRouter's `/api/v1/chat/completions`
+         *     endpoint and returns the model's reply. Streaming (`stream: true`) is
+         *     rejected: billing relies on the `usage.cost` value OpenRouter returns,
+         *     which is not guaranteed on every SSE stream. Billing is based on the
+         *     `usage.cost` field in the response body.
+         */
+        post: operations["openrouterCreateChatCompletion"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/krea/generate/image/krea/krea-2/medium": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Krea 2 Medium
+         * @description Best for expressive illustrations.
+         */
+        post: operations["kreaGenerateImageMedium"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/krea/generate/image/krea/krea-2/medium-turbo": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Krea 2 Medium Turbo
+         * @description Faster, more affordable variant of Krea 2 Medium.
+         */
+        post: operations["kreaGenerateImageMediumTurbo"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/krea/generate/image/krea/krea-2/large": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Krea 2 Large
+         * @description Best for expressive photorealism.
+         */
+        post: operations["kreaGenerateImageLarge"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/krea/assets": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Upload an asset
+         * @description Upload an asset
+         */
+        post: operations["kreaUploadAsset"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/krea/jobs/{job_id}": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /**
+         * Get a job by ID
+         * @description Get a job by ID
+         */
+        get: operations["kreaGetJob"];
+        put?: never;
+        post?: never;
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/beeble/v1/switchx/generations": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Start SwitchX Generation
+         * @description Start a SwitchX compositing job.
+         */
+        post: operations["beebleCreateSwitchXJob"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/beeble/v1/uploads": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Create Beeble Upload URL
+         * @description Create a presigned upload URL for a media file. The returned beeble_uri can be used as source_uri, reference_image_uri, or alpha_uri in SwitchX generation calls.
+         */
+        post: operations["beebleCreateUpload"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/beeble/v1/switchx/generations/{job_id}": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /**
+         * Get SwitchX Job Status
+         * @description Poll the status of a SwitchX job.
+         */
+        get: operations["beebleGetSwitchXStatus"];
+        put?: never;
+        post?: never;
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/proxy/quiver/v1/svgs/generations": {
         parameters: {
             query?: never;
@@ -4963,6 +5439,63 @@ export interface paths {
         patch?: never;
         trace?: never;
     };
+    "/proxy/bria/v2/video/edit/green_screen": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Apply a green screen to a video using Bria
+         * @description Initiates an asynchronous green-screen (chroma key) job for a video using Bria's API.
+         *     The original background is replaced with a solid broadcast-green, chroma-green, or blue
+         *     screen suitable for compositing.
+         *
+         *     Returns HTTP 202 with request_id and status_url. Poll the status endpoint for results.
+         *
+         *     Supported input containers: .mp4, .mov, .webm, .avi, .gif
+         *     Supported input codecs: H.264, H.265 (HEVC), VP9, AV1, PhotoJPEG
+         *     Max input duration: 60 seconds. Input resolution up to 16000x16000.
+         */
+        post: operations["briaVideoGreenScreen"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
+    "/proxy/bria/v2/video/edit/replace_background": {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        get?: never;
+        put?: never;
+        /**
+         * Replace the background of a video using Bria
+         * @description Initiates an asynchronous background-replacement job for a video using Bria's API.
+         *     The original background is composited out and replaced with the supplied background
+         *     image or video.
+         *
+         *     Returns HTTP 202 with request_id and status_url. Poll the status endpoint for results.
+         *
+         *     Supported input containers: .mp4, .mov, .webm, .avi, .gif
+         *     Supported input codecs: H.264, H.265 (HEVC), VP9, AV1, PhotoJPEG
+         *     Max input duration: 60 seconds. Input resolution up to 16000x16000.
+         *     The background asset must match the foreground aspect ratio.
+         */
+        post: operations["briaVideoReplaceBackground"];
+        delete?: never;
+        options?: never;
+        head?: never;
+        patch?: never;
+        trace?: never;
+    };
     "/proxy/bria/v2/image/edit/remove_background": {
         parameters: {
             query?: never;
@@ -5878,8 +6411,9 @@ export interface paths {
          * Generate music from video
          * @description Generate music from a video using Sonilo video-to-music AI.
          *     Accepts either a video file upload or a video URL, with an optional prompt.
-         *     Returns a streaming NDJSON response with duration, titles, audio chunks, and completion events.
-         *     Max video duration: 6 minutes. Max upload size: 1024MB.
+         *     Returns a streaming NDJSON response with one or more parallel audio streams
+         *     (titles, audio chunks, and completion events).
+         *     Max video duration: 6 minutes. Max upload size: 300MB.
          */
         post: operations["soniloVideoToMusicGenerate"];
         delete?: never;
@@ -5900,8 +6434,8 @@ export interface paths {
         /**
          * Generate music from text prompt
          * @description Generate music from a text prompt using Sonilo text-to-music AI.
-         *     Requires a prompt describing the desired music. Duration is optional and will be inferred if not provided.
-         *     Returns a streaming NDJSON response with duration, titles, audio chunks, and completion events.
+         *     Requires a prompt describing the desired music and a caller-specified duration.
+         *     Returns a streaming NDJSON response with titles, audio chunks, and completion events.
          */
         post: operations["soniloTextToMusicGenerate"];
         delete?: never;
@@ -5914,6 +6448,16 @@ export interface paths {
 export type webhooks = Record<string, never>;
 export interface components {
     schemas: {
+        /**
+         * @description One of a customer's API keys, for cloud's migrate-on-miss to seed into
+         *     workspace_api_keys by hash. M2M/admin-only; carries the hash, never plaintext.
+         */
+        MigrationAPIKey: {
+            key_hash: string;
+            key_prefix?: string;
+            name?: string;
+            description?: string;
+        };
         FreepikMagnificUpscalerCreativeRequest: {
             /** @description Base64 image or URL to upscale. The resulted image can't exceed maximum allowed size of 25.3 million pixels. */
             image: string;
@@ -6270,6 +6814,11 @@ export interface components {
          * @enum {string}
          */
         SubscriptionDuration: "MONTHLY" | "ANNUAL";
+        /**
+         * @description State of a withheld first-time free tier credit grant. "verification_required" means the grant was denied pending account verification (e.g. unverified email or a blocked email domain). "deferred" means the grant was temporarily deferred and may succeed on a later request. Absent when no grant was withheld.
+         * @enum {string}
+         */
+        FreeTierGrantState: "verification_required" | "deferred";
         FeaturesResponse: {
             /**
              * @description The conversion rate for partner nodes
@@ -6389,6 +6938,86 @@ export interface components {
             error: string;
             message: string;
         };
+        /** @description Grouped gross spend per billing period, breakdown, and summary for a customer. */
+        CustomerUsageTimeSeries: {
+            /**
+             * @description Dimension the spend is grouped by.
+             * @enum {string}
+             */
+            group_by: "model" | "endpoint" | "product";
+            /**
+             * @description Bucket size of the time series.
+             * @enum {string}
+             */
+            granularity: "hour" | "day" | "month";
+            /**
+             * Format: date-time
+             * @description Inclusive start of the returned range.
+             */
+            starting_on: string;
+            /**
+             * Format: date-time
+             * @description Exclusive end of the returned range.
+             */
+            ending_before: string;
+            /** @description Distinct group keys present in the range, ordered by spend descending. */
+            groups: string[];
+            /** @description One entry per (billing period, group) with non-zero gross spend. */
+            buckets: components["schemas"]["UsageBucket"][];
+            /** @description Per-group totals over the whole range, ordered by spend descending. */
+            breakdown: components["schemas"]["UsageBreakdownRow"][];
+            summary: components["schemas"]["UsageSummary"];
+        };
+        UsageBucket: {
+            /**
+             * Format: date-time
+             * @description Start of the billing period this bucket belongs to.
+             */
+            period_start: string;
+            /**
+             * Format: date-time
+             * @description End of the billing period this bucket belongs to.
+             */
+            period_end: string;
+            /** @description Group value (e.g. model name) this bucket belongs to. */
+            group_key: string;
+            /**
+             * Format: double
+             * @description Gross spend in this period for this group, in microamount (1/1,000,000 USD).
+             */
+            cost_micros: number;
+        };
+        UsageBreakdownRow: {
+            group_key: string;
+            /**
+             * Format: double
+             * @description Total gross spend for this group over the range, in microamount.
+             */
+            cost_micros: number;
+            /**
+             * Format: double
+             * @description Fraction of total spend attributable to this group (0-1).
+             */
+            share: number;
+        };
+        UsageSummary: {
+            /**
+             * Format: double
+             * @description Total gross spend over the range, in microamount.
+             */
+            spend_micros: number;
+            balance?: components["schemas"]["UsageBalance"];
+        };
+        /** @description Current remaining balance, mirroring /customers/balance. */
+        UsageBalance: {
+            /** Format: double */
+            amount_micros?: number;
+            /** Format: double */
+            prepaid_balance_micros?: number;
+            /** Format: double */
+            cloud_credit_balance_micros?: number;
+            currency?: string;
+        };
         CreateCouponRequest: {
             /** @description Name of the coupon displayed to customers */
             name?: string;
@@ -6822,6 +7451,11 @@ export interface components {
             /** @description The pip freeze output */
             pip_freeze?: string;
         };
+        /** @description Optional request body for customer creation (BE-1490). Carries the Cloudflare Turnstile token produced by the frontend widget, verified server-side at signup. All fields are optional; clients that do not run the Turnstile widget may send an empty body or omit the body entirely. */
+        CreateCustomerRequest: {
+            /** @description The Cloudflare Turnstile token (cf-turnstile-response) produced by the frontend widget. Verified server-side against Cloudflare siteverify. Omit or leave empty for clients without Turnstile (e.g. local OSS), which are exempt from the verification requirement. */
+            turnstile_token?: string;
+        };
         Customer: {
             /** @description The firebase UID of the user */
             id: string;
@@ -7051,6 +7685,23 @@ export interface components {
                 style_type?: string;
             }[];
         };
+        /** @description Parameters for the Ideogram 4.0 (V4) text-to-image generation proxy request. Supply exactly one of text_prompt or json_prompt. */
+        IdeogramV4Request: {
+            /** @description Natural-language prompt. Enables Magic Prompt automatically. Supply exactly one of text_prompt or json_prompt. */
+            text_prompt?: string;
+            /** @description Structured V4 prompt. Disables Magic Prompt; consumed directly. Supply exactly one of text_prompt or json_prompt. */
+            json_prompt?: {
+                [key: string]: unknown;
+            };
+            /**
+             * @description Output resolution in WIDTHxHEIGHT. Omit to let the model pick an aspect ratio. Supported 2K values: 2048x2048, 1440x2880, 2880x1440, 1664x2496, 2496x1664, 1792x2240, 2240x1792, 1440x2560, 2560x1440, 1600x2560, 2560x1600, 1728x2304, 2304x1728, 1296x3168, 3168x1296, 1152x2944, 2944x1152, 1248x3328, 3328x1248, 1280x3072, 3072x1280.
+             * @example 2048x2048
+             */
+            resolution?: string;
+            rendering_speed?: components["schemas"]["RenderingSpeed"];
+            /** @description Opt into post-generation copyright detection (Hive likeness and logo checks). */
+            enable_copyright_detection?: boolean;
+        };
         IdeogramV3RemixRequest: {
             /** Format: binary */
             image?: string;
@@ -7425,6 +8076,150 @@ export interface components {
             /** @description Customized Task ID. Must be unique within a single user account. */
             external_task_id?: string;
         };
+        /** @description General configuration such as callback address and watermark options. */
+        KlingV2Options: {
+            /** @description Callback notification URL for task results. The server notifies when the task status changes. */
+            callback_url?: string;
+            /** @description Customized Task ID. Does not overwrite the system-generated task ID but can be used for queries. Must be unique within a single user account. */
+            external_task_id?: string;
+            /** @description Whether to generate watermarked results simultaneously. Custom watermarks are not supported. */
+            watermark_info?: {
+                /** @description true means generate watermarked result, false means do not generate. Default false. */
+                enabled?: boolean;
+            };
+        };
+        KlingV2Text2VideoRequest: {
+            /** @description Prompt that may include both positive and negative descriptions. Recommended length under 2500 characters. Multi-shot videos use the format "shot n, m, words; shot n, m, words;". */
+            prompt: string;
+            /** @description Output configuration such as resolution, aspect ratio and duration. */
+            settings?: {
+                /** @description Clarity of the generated video. One of "720p" or "1080p". Default "720p". */
+                resolution?: string;
+                /** @description Aspect ratio (width:height) of the generated frames. One of "16:9", "9:16" or "1:1". Default "16:9". */
+                aspect_ratio?: string;
+                /** @description Video length in seconds. Supported values 3 through 15. Default 5. */
+                duration?: number;
+            };
+            options?: components["schemas"]["KlingV2Options"];
+        };
+        KlingV2Image2VideoRequest: {
+            /** @description Collection of references such as prompts and images. Fields related to the same material belong in the same object. */
+            contents: {
+                /** @description Reference type. One of "prompt" or "first_frame". */
+                type?: string;
+                /** @description Text prompt. Provided when type is "prompt". May include positive and negative descriptions; cannot exceed 2500 characters. */
+                text?: string;
+                /** @description First-frame material. Provided when type is "first_frame". May be a URL or Base64 content. Supports .jpg, .jpeg and .png up to 50MB; width and height must be at least 300px with an aspect ratio between 1:2.5 and 2.5:1. */
+                url?: string;
+            }[];
+            /** @description Output configuration such as resolution and duration. */
+            settings?: {
+                /** @description Clarity of the generated video. One of "720p" or "1080p". Default "720p". */
+                resolution?: string;
+                /** @description Video length in seconds. Supported values 3 through 15. Default 5. */
+                duration?: number;
+            };
+            options?: components["schemas"]["KlingV2Options"];
+        };
+        /** @description Response returned when a Kling 3.0 Turbo task is created. */
+        KlingV2CreateTaskResponse: {
+            /** @description Error code. 0 indicates success. */
+            code?: number;
+            /** @description Error message. */
+            message?: string;
+            /** @description Request ID generated by the system. */
+            request_id?: string;
+            data?: {
+                /** @description The created task ID. */
+                id?: string;
+                /** @description Task status. One of "submitted", "processing", "succeeded" or "failed". */
+                status?: string;
+                /**
+                 * Format: int64
+                 * @description Task creation time. Unix timestamp in milliseconds.
+                 */
+                create_time?: number;
+                /**
+                 * Format: int64
+                 * @description Task update time. Unix timestamp in milliseconds.
+                 */
+                update_time?: number;
+                /** @description The custom task ID for this task, if any. */
+                external_id?: string;
+            };
+        };
+        /** @description A generated output. The fields present depend on `type` (video, image, audio, voice or element). */
+        KlingV2Output: {
+            /** @description Output content type. One of "video", "image", "audio", "voice" or "element". */
+            type?: string;
+            /** @description Output ID generated by the system. */
+            id?: string;
+            /** @description URL of the generated result (hotlink-protected). Cleared after 30 days. */
+            url?: string;
+            /** @description URL of the watermarked result (hotlink-protected). */
+            watermark_url?: string;
+            /** @description Duration of the generated video in seconds. */
+            duration?: string;
+            /** @description Grouping marker, present only for grouped images. */
+            group_id?: string;
+            /** @description MP3 URL of the generated audio (hotlink-protected). */
+            mp3_url?: string;
+            /** @description WAV URL of the generated audio (hotlink-protected). */
+            wav_url?: string;
+            /** @description Duration of the generated MP3 audio in seconds. */
+            mp3_duration?: string;
+            /** @description Duration of the generated WAV audio in seconds. */
+            wav_duration?: string;
+            /** @description Name of the generated material. */
+            name?: string;
+            /** @description Source of the material. "kling" denotes the official library; numbers are creator IDs. */
+            owned_by?: string;
+            /** @description Status of the material. One of "succeeded" or "deleted". */
+            status?: string;
+        };
+        /** @description A single Kling 3.0 Turbo task record. */
+        KlingV2Task: {
+            /** @description The task ID. */
+            id?: string;
+            /** @description Task status. One of "submitted", "processing", "succeeded" or "failed". */
+            status?: string;
+            /** @description Task status information, displaying the failure reason when the task fails. */
+            message?: string;
+            /**
+             * Format: int64
+             * @description Task creation time. Unix timestamp in milliseconds.
+             */
+            create_time?: number;
+            /**
+             * Format: int64
+             * @description Task update time. Unix timestamp in milliseconds.
+             */
+            update_time?: number;
+            /** @description The custom task ID for this task, if any. */
+            external_id?: string;
+            /** @description Generated outputs for the task. */
+            outputs?: components["schemas"]["KlingV2Output"][];
+            /** @description Billing details for the task. */
+            billing?: {
+                /** @description Consumption account type. "cash" for balance, "unit" for a resource package. */
+                charge_type?: string;
+                /** @description Consumption amount, accurate to two decimal places. */
+                amount?: string;
+                /** @description Consumable resource bundle type (only present when charge_type is "unit"). One of "video", "image" or "audio". */
+                package_type?: string;
+            }[];
+        };
+        /** @description Response returned when querying Kling 3.0 Turbo tasks by ID. */
+        KlingV2QueryTaskResponse: {
+            /** @description Error code. 0 indicates success. */
+            code?: number;
+            /** @description Error message. */
+            message?: string;
+            /** @description Request ID generated by the system. */
+            request_id?: string;
+            /** @description Tasks matching the query. */
+            data?: components["schemas"]["KlingV2Task"][];
+        };
         KlingVideoExtendRequest: {
             /** @description The ID of the video to be extended. Supports videos generated by text-to-video, image-to-video, and previous video extension operations. Cannot exceed 3 minutes total duration after extension. */
             video_id?: string;
@@ -8366,6 +9161,74 @@ export interface components {
          * @enum {string}
          */
         BFLStatus: "Task not found" | "Pending" | "Request Moderated" | "Content Moderated" | "Ready" | "Error";
+        /** @description Request body for the BFL Flux Tools VTO v1 virtual try-on API. */
+        BFLVtoV1Request: {
+            /**
+             * @description Text prompt for VTO generation.
+             * @example TRY-ON: The person of image 1 wearing the garments of image 2.
+             */
+            prompt: string;
+            /** @description Person image (maps internally to input_image). */
+            person: string;
+            /** @description Image of one or more garments (maps internally to input_image_2). */
+            garment: string;
+            /**
+             * @description Optional seed for reproducibility.
+             * @example 42
+             */
+            seed?: number;
+            /**
+             * @description Tolerance level for input and output moderation. Between 0 and 5 for public use.
+             * @default 2
+             */
+            safety_tolerance: number;
+            /**
+             * @description Output format for the generated image.
+             * @default jpeg
+             */
+            output_format: components["schemas"]["BFLOutputFormat"];
+            /**
+             * Format: uri
+             * @description URL to receive webhook notifications.
+             */
+            webhook_url?: string;
+            /** @description Optional secret for webhook signature verification. */
+            webhook_secret?: string;
+        };
+        /** @description Request body for the BFL Flux Tools Erase v1 object removal API. */
+        BFLEraseV1Request: {
+            /** @description Base64-encoded input image or HTTP(S) image URL. */
+            image: string;
+            /** @description Base64-encoded black/white mask or HTTP(S) image URL. White pixels indicate the object to remove; black pixels are preserved. Must have the same dimensions as the input image. */
+            mask: string;
+            /**
+             * @description Number of pixels to dilate the mask by before removal. Dilation helps cover object edges. Maximum is 25 pixels.
+             * @default 10
+             */
+            dilate_pixels: number;
+            /**
+             * @description Optional seed for reproducibility.
+             * @example 42
+             */
+            seed?: number;
+            /**
+             * @description Tolerance level for input and output moderation. Between 0 and 5, 0 being most strict, 5 being least strict.
+             * @default 2
+             */
+            safety_tolerance: number;
+            /**
+             * @description Output format for the generated image.
+             * @default png
+             */
+            output_format: components["schemas"]["BFLOutputFormat"];
+            /**
+             * Format: uri
+             * @description URL to receive webhook notifications.
+             */
+            webhook_url?: string;
+            /** @description Optional secret for webhook signature verification. */
+            webhook_secret?: string;
+        };
         /** @description Request body for the BFL Flux 2 Pro image generation API. */
         BFLFlux2ProGenerateRequest: {
             /** @description Text description of the image to generate. */
@@ -8733,7 +9596,7 @@ export interface components {
          * OutputFormat
          * @enum {string}
          */
-        BFLOutputFormat: "jpeg" | "png";
+        BFLOutputFormat: "jpeg" | "png" | "webp";
         /** ValidationError */
         BFLValidationError: {
             /** Location */
@@ -10424,10 +11287,10 @@ export interface components {
             request?: components["schemas"]["LumaGenerationRequest"] | components["schemas"]["LumaImageGenerationRequest"] | components["schemas"]["LumaUpscaleVideoGenerationRequest"] | components["schemas"]["LumaAudioGenerationRequest"];
         };
         /**
-         * @description Output aspect ratio
+         * @description Output aspect ratio. The ray-3.2 video models support the subset 9:16, 3:4, 1:1, 4:3, 16:9, 21:9.
          * @enum {string}
          */
-        LumaAgentsAspectRatio: "3:1" | "2:1" | "16:9" | "3:2" | "1:1" | "2:3" | "9:16" | "1:2" | "1:3";
+        LumaAgentsAspectRatio: "3:1" | "2:1" | "21:9" | "16:9" | "3:2" | "4:3" | "1:1" | "3:4" | "2:3" | "9:16" | "1:2" | "1:3";
         /**
          * @description Style preset
          * @enum {string}
@@ -10439,10 +11302,10 @@ export interface components {
          */
         LumaAgentsOutputFormat: "png" | "jpeg";
         /**
-         * @description The kind of generation to perform
+         * @description The kind of generation to perform. image/image_edit are produced by the uni-1 / uni-1-max models; video/video_edit/video_reframe are produced by the ray-3.2 model.
          * @enum {string}
          */
-        LumaAgentsGenerationType: "image" | "image_edit";
+        LumaAgentsGenerationType: "image" | "image_edit" | "video" | "video_edit" | "video_reframe";
         /**
          * @description Current state of the generation
          * @enum {string}
@@ -10453,14 +11316,16 @@ export interface components {
          * @enum {string}
          */
         LumaAgentsFailureCode: "content_moderated" | "generation_failed" | "budget_exhausted" | "output_not_found";
-        /** @description Reference image for style/content guidance or guided generation */
+        /** @description Reference to an image or video. Used for style/content guidance, guided generation, video-edit/video-reframe sources, and guide keyframes. Provide exactly one of generation_id, url, or data. */
         LumaAgentsImageRef: {
-            /** @description Base64-encoded image data */
+            /** @description Base64-encoded image or video data */
             data?: string;
-            /** @description MIME type (e.g. image/jpeg). Required with data. */
+            /** @description MIME type. Required with data (and with url for video sources, e.g. video/mp4 on video_edit / video_reframe). */
             media_type?: string;
-            /** @description Publicly accessible image URL */
+            /** @description Publicly accessible image or video URL */
             url?: string;
+            /** @description UUID of a prior completed generation to reuse as the source. Used by ray-3.2 video_edit / video_reframe. */
+            generation_id?: string;
         };
         /** @description The Luma Agents generation request object */
         LumaAgentsGenerationRequest: {
@@ -10469,15 +11334,40 @@ export interface components {
             aspect_ratio?: components["schemas"]["LumaAgentsAspectRatio"];
             /** @description Reference images for style/content guidance. Up to 9 for type 'image', up to 8 for type 'image_edit'. */
             image_ref?: components["schemas"]["LumaAgentsImageRef"][];
-            /** @description Model to use */
+            /** @description Model to use. uni-1 / uni-1-max for image generation, ray-3.2 for video generation, editing, and reframing. */
             model?: string;
             output_format?: components["schemas"]["LumaAgentsOutputFormat"];
             source?: components["schemas"]["LumaAgentsImageRef"];
             style?: components["schemas"]["LumaAgentsStyle"];
             type?: components["schemas"]["LumaAgentsGenerationType"];
+            video?: components["schemas"]["LumaAgentsVideoOptions"];
             /** @description Enable web search grounding */
             web_search?: boolean;
         };
+        /**
+         * @description Output resolution for ray-3.2 video. Defaults to 720p. 360p is the draft tier. HDR requires 720p or 1080p.
+         * @enum {string}
+         */
+        LumaAgentsVideoResolution: "360p" | "540p" | "720p" | "1080p";
+        /**
+         * @description Clip duration for ray-3.2 video / video_edit. Defaults to 5s. HDR generation (type video) is restricted to 5s.
+         * @enum {string}
+         */
+        LumaAgentsVideoDuration: "5s" | "10s";
+        /** @description Video output settings for ray-3.2. Only the fields that affect validation and billing are modelled here; additional fields (edit controls, end_frame, loop, source_position) are forwarded to Luma untouched. */
+        LumaAgentsVideoOptions: {
+            resolution?: components["schemas"]["LumaAgentsVideoResolution"];
+            duration?: components["schemas"]["LumaAgentsVideoDuration"];
+            /** @description Render in HDR. Requires 720p/1080p. Rejected for video_reframe. */
+            hdr?: boolean;
+            /** @description Export an EXR file alongside the MP4. Requires hdr true. Rejected for video_reframe. */
+            exr_export?: boolean;
+            /** @description Loop the generated clip. Create-only (type video). */
+            loop?: boolean;
+            start_frame?: components["schemas"]["LumaAgentsImageRef"];
+            /** @description Guide-frame images. A single keyframe makes a type "video" request a single-keyframe extend, which always bills as one 5s block. */
+            keyframes?: components["schemas"]["LumaAgentsImageRef"][];
+        };
         /** @description A generated output entry */
         LumaAgentsGenerationOutput: {
             /** @description Media type (e.g. image) */
@@ -10887,6 +11777,68 @@ export interface components {
             /** @description Task ID */
             id?: string;
         };
+        /** @description Request to edit an input video into a new video using Runway's API. */
+        RunwayVideoToVideoRequest: {
+            /** @description Model to use for generation */
+            model: components["schemas"]["RunwayVideoToVideoModelEnum"];
+            /** @description A non-empty string up to 1000 characters describing what should appear in the output. */
+            promptText: string;
+            /** @description The input video to edit (HTTPS URL, Runway upload URI, or data URI). Must be 30 seconds or shorter. */
+            videoUri: string;
+            /** @description Timed guidance images placed at specific points in the input video. Up to 5 keyframes. */
+            keyframes?: components["schemas"]["RunwayVideoToVideoKeyframe"][];
+            /** @description A list of up to 5 image keyframes for guiding the edit at specific points in the video. */
+            promptImage?: components["schemas"]["RunwayVideoToVideoPromptImage"][];
+            /**
+             * Format: int64
+             * @description Random seed for generation.
+             */
+            seed?: number;
+            /** @description Settings that affect the behavior of the content moderation system. */
+            contentModeration?: components["schemas"]["RunwayContentModeration"];
+        };
+        /** @description Timed guidance image placed at a specific point in the input video. */
+        RunwayVideoToVideoKeyframe: {
+            /** @description A HTTPS URL, Runway or data URI containing an encoded image. */
+            uri: string;
+            /** @description Absolute timestamp in seconds from the start of the input video when this guidance image should apply. */
+            seconds: number;
+        } | {
+            /** @description A HTTPS URL, Runway or data URI containing an encoded image. */
+            uri: string;
+            /** @description Position as a fraction [0.0, 1.0] of the input video duration when this guidance image should apply. */
+            at: number;
+        };
+        /** @description An image keyframe for guiding the edit at a specific point in the video. */
+        RunwayVideoToVideoPromptImage: {
+            /** @description A HTTPS URL, Runway or data URI containing an encoded image. */
+            uri: string;
+            position: components["schemas"]["RunwayVideoToVideoPromptImagePosition"];
+        };
+        /** @description The position in the output video where the image should apply. */
+        RunwayVideoToVideoPromptImagePosition: ("first" | "last") | {
+            /** @enum {string} */
+            type: "timestamp";
+            /** @description Absolute timestamp in seconds from the start of the output video. */
+            timestampSeconds: number;
+        } | {
+            /** @enum {string} */
+            type: "position";
+            /** @description Position as a fraction [0.0, 1.0] of the total video duration. */
+            positionPercentage: number;
+        };
+        /** @description Settings that affect the behavior of the content moderation system. */
+        RunwayContentModeration: {
+            /**
+             * @description When set to `low`, the content moderation system will be less strict about preventing generations that include recognizable public figures.
+             * @enum {string}
+             */
+            publicFigureThreshold?: "auto" | "low";
+        };
+        RunwayVideoToVideoResponse: {
+            /** @description Task ID */
+            id?: string;
+        };
         RunwayTextToImageResponse: {
             /** @description Task ID */
             id?: string;
@@ -10919,6 +11871,11 @@ export interface components {
          * @enum {string}
          */
         RunwayModelEnum: "gen4_turbo" | "gen3a_turbo";
+        /**
+         * @description Available Runway models for video-to-video generation.
+         * @enum {string}
+         */
+        RunwayVideoToVideoModelEnum: "aleph2";
         /** @description Represents an image with its position in the video sequence. */
         RunwayPromptImageDetailedObject: {
             /** @description A HTTPS URL or data URI containing an encoded image. */
@@ -12575,39 +13532,90 @@ export interface components {
             authors?: string[];
         };
         Rodin3DGenerateRequest: {
-            /** @description The reference images to generate 3D Assets. */
-            images: string;
-            /** @description Text prompt used by the upstream Rodin API. Required by upstream for text-to-3D requests (no images uploaded); optional for image-to-3D requests where it acts as additional guidance. */
+            /** @description Images to be used in generation, up to 5 images. As the form data request will preserve the order of the images, the first image will be the image for material generation. For Image-to-3D generation: required (one or more images are needed, maximum 5 images). For Text-to-3D generation: null. */
+            images?: string;
+            /** @description A textual prompt to guide the model generation. For Image-to-3D generation: optional (if not provided, an AI-generated prompt based on the provided images will be used). For Text-to-3D generation: required. */
             prompt?: string;
-            /** @description Seed. */
+            /** @description Default is false. If true, the original transparency channel of the images will be used when processing the image. */
+            use_original_alpha?: boolean;
+            condition_mode?: components["schemas"]["RodinConditionModeType"];
+            /** @description Optional. A seed value for randomization in the mesh generation, ranging from 0 to 65535 (both inclusive). If not provided, the seed will be randomly generated. */
             seed?: number;
-            tier?: components["schemas"]["RodinTierType"];
+            geometry_file_format?: components["schemas"]["RodinGeometryFileFormatType"];
             material?: components["schemas"]["RodinMaterialType"];
             quality?: components["schemas"]["RodinQualityType"];
+            /** @description Optional. Customize poly count for generation, providing more accurate control over mesh face count. When mesh_mode = Raw: range from 500 to 1,000,000 (default 500,000). When mesh_mode = Quad: range from 1,000 to 200,000 (default 18,000). When this parameter is invoked, the `quality` parameter will not take effect. */
+            quality_override?: number;
+            tier?: components["schemas"]["RodinTierType"];
+            /** @description Optional. When generating the human-like model, this parameter controls the generation result to T/A pose. When true, your model will be either T pose or A pose. */
+            TAPose?: boolean;
+            /** @description Optional. This is a controlnet that controls the maximum size of the generated model. This array must contain 3 elements, Width (Y-axis), Height (Z-axis), and Length (X-axis), in this exact fixed sequence (y, z, x). */
+            bbox_condition?: number[];
             mesh_mode?: components["schemas"]["RodinMeshModeType"];
-            /** @description Optional list of upstream addon flags (e.g. "HighPack"). */
-            addons?: string[];
+            /** @description Optional. Default is true. If true, the generated models will be simplified. This parameter takes effect when mesh_mode is set to Raw. */
+            mesh_simplify?: boolean;
+            /** @description Optional. Default is false. If true, the generated models will be smoothed (similar to Rodin Gen-1). This parameter takes effect when mesh_mode is set to Quad. */
+            mesh_smooth?: boolean;
+            /** @description Optional. The default is []. Possible value is `HighPack`. By selecting HighPack: generate 4K resolution texture instead of the default 2K. If Quad mode, the number of faces will be ~16 times the number of faces selected in the `quality` parameter. */
+            addons?: components["schemas"]["RodinAddonType"][];
+            /** @description Optional. Default is false. If true, an additional high-quality render image will be provided in the download list. */
+            preview_render?: boolean;
+            /** @description Optional. Default is false. If true, high-quality texture will be provided. */
+            hd_texture?: boolean;
+            /** @description Optional. Default is false. If true, this parameter applies images preprocessing to remove lighting information from textures. */
+            texture_delight?: boolean;
+            texture_mode?: components["schemas"]["RodinTextureModeType"];
+            /** @description Optional. Default is false. If true, micro detail scale is applied. This parameter is only available in the Gen-2.5-Extreme-High tier. */
+            is_micro?: boolean;
+            /** @description Optional. Default is false. If true, this parameter will determine whether the generated model is symmetric. */
+            is_symmetric?: boolean;
+            geometry_instruct_mode?: components["schemas"]["RodinGeometryInstructModeType"];
         };
         /**
-         * @description Rodin Tier para options
+         * @description Tier of generation. The default value is Regular. Sketch: fast generation with basic details, suitable for initial concepts. Regular: balanced quality and speed, ideal for general use. Detail: enhanced details compared to Regular, recommended for intricate results (longer processing time). Smooth: clearer and sharper output than Regular, with slightly longer processing time. Set the value to `Gen-2` to invoke Gen-2 generation. Use the `Gen-2.5-*` values to invoke Gen-2.5 generation: Gen-2.5-Extreme-Low (quick simple assets), Gen-2.5-Low (clean assets and small hardsurface props), Gen-2.5-Medium (moderately complex models), Gen-2.5-High (high-quality assets with richer structural representation and smooth surfaces), Gen-2.5-Extreme-High (high-frequency detail reproduction).
          * @enum {string}
          */
-        RodinTierType: "Regular" | "Sketch" | "Detail" | "Smooth";
+        RodinTierType: "Regular" | "Sketch" | "Detail" | "Smooth" | "Gen-2" | "Gen-2.5-Extreme-Low" | "Gen-2.5-Low" | "Gen-2.5-Medium" | "Gen-2.5-High" | "Gen-2.5-Extreme-High";
         /**
-         * @description Rodin Material para options
+         * @description Optional. The material type. Default is PBR. PBR: Physically Based Materials, including base color texture, metallicness texture, normal texture and roughness texture, providing high realism and physically accurate behavior over dynamic lighting. Shaded: only base color texture with baked lighting, providing stylized visuals. All: both PBR and Shaded will be delivered. None: asset without material.
          * @enum {string}
          */
-        RodinMaterialType: "PBR" | "Shaded";
+        RodinMaterialType: "PBR" | "Shaded" | "All" | "None";
         /**
-         * @description Rodin Quality para options
+         * @description Optional. The face count of the generated model. Default is medium.
          * @enum {string}
          */
         RodinQualityType: "extra-low" | "low" | "medium" | "high";
         /**
-         * @description Rodin Mesh_Mode para options
+         * @description Optional. It controls the type of faces of generated models. Default is Quad. The Raw mode generates triangular face models. The Quad mode generates quadrilateral face models. When its value is Raw, `quality` will be fixed to medium and `addons` will be fixed to []. For Rodin Sketch tier, only triangular faces can be generated.
          * @enum {string}
          */
         RodinMeshModeType: "Quad" | "Raw";
+        /**
+         * @description Useful only for multi-image 3D generation. Optional. Chooses the mode of the multi-image generation. Default is concat. For `fuse` mode (uploading images of multiple objects), fuse mode will extract and fuse all the features of all the objects from the images for generation. For `concat` mode (uploading images of a single object), concat mode will inform the Rodin model to expect these images to be multi-view images of a single object.
+         * @enum {string}
+         */
+        RodinConditionModeType: "fuse" | "concat";
+        /**
+         * @description Optional. The format of the output geometry file. Default is glb.
+         * @enum {string}
+         */
+        RodinGeometryFileFormatType: "glb" | "usdz" | "fbx" | "obj" | "stl";
+        /**
+         * @description Optional. Higher values invest more thinking effort and produce better results, at the cost of longer generation time.
+         * @enum {string}
+         */
+        RodinTextureModeType: "legacy" | "extreme-low" | "low" | "medium" | "high";
+        /**
+         * @description Optional. Default is `faithful`. The Creative mode enhances generative robustness while ensuring output consistency, allowing for more flexible and creative generation while maintaining quality and consistency across outputs. Available for Gen-2.5-Medium and Gen-2.5-High tiers.
+         * @enum {string}
+         */
+        RodinGeometryInstructModeType: "faithful" | "creative";
+        /**
+         * @description Possible value is `HighPack`. By selecting HighPack: generate 4K resolution texture instead of the default 2K. If Quad mode, the number of faces will be ~16 times the number of faces selected in the `quality` parameter. Additional 1 credit per generation.
+         * @enum {string}
+         */
+        RodinAddonType: "HighPack";
         Rodin3DCheckStatusRequest: {
             /** @description subscription from generate endpoint */
             subscription_key: string;
@@ -12617,13 +13625,15 @@ export interface components {
             task_uuid: string;
         };
         Rodin3DGenerateResponse: {
-            /** @description message */
+            /** @description Error message, if any. Possible values include NO_ACTIVE_SUBSCRIPTION, SUBSCRIPTION_PLAN_TOO_LOW, INSUFFICIENT_FUND, INVALID_REQUEST, USER_NOT_FOUND, GROUP_NOT_FOUND, PERMISSION_DENIED, UNKNOWN. */
+            error?: string | null;
+            /** @description Success message or detailed error information. */
             message?: string;
-            /** @description prompt */
+            /** @description Echoed prompt (when applicable). */
             prompt?: string;
-            /** @description Time */
+            /** @description Submission timestamp. */
             submit_time?: string;
-            /** @description Task UUID */
+            /** @description Task UUID. Use this for status/download requests. */
             uuid?: string;
             jobs?: components["schemas"]["RodinGenerateJobsData"];
         };
@@ -14446,7 +15456,7 @@ export interface components {
              * @description The ID of the model to call. Available models include seedance-1-5-pro-251215, seedance-1-0-pro-250528, seedance-1-0-pro-fast-251015, seedance-1-0-lite-t2v-250428, seedance-1-0-lite-i2v-250428
              * @enum {string}
              */
-            model: "seedance-1-5-pro-251215" | "seedance-1-0-pro-250528" | "seedance-1-0-lite-t2v-250428" | "seedance-1-0-lite-i2v-250428" | "seedance-1-0-pro-fast-251015" | "dreamina-seedance-2-0-260128" | "dreamina-seedance-2-0-fast-260128";
+            model: "seedance-1-5-pro-251215" | "seedance-1-0-pro-250528" | "seedance-1-0-lite-t2v-250428" | "seedance-1-0-lite-i2v-250428" | "seedance-1-0-pro-fast-251015" | "dreamina-seedance-2-0-260128" | "dreamina-seedance-2-0-fast-260128" | "dreamina-seedance-2-0-mini";
             /** @description The input content for the model to generate a video */
             content: components["schemas"]["BytePlusVideoGenerationContent"][];
             /**
@@ -14473,7 +15483,7 @@ export interface components {
              *     Note: Seedance 2.0 & 2.0 fast do not support 1080p.
              * @enum {string}
              */
-            resolution?: "480p" | "720p" | "1080p";
+            resolution?: "480p" | "720p" | "1080p" | "4k";
             /**
              * @description Aspect ratio of the generated video. Seedance 2.0 & 2.0 fast, 1.5 pro default: adaptive.
              * @enum {string}
@@ -14594,6 +15604,679 @@ export interface components {
                 total_tokens?: number;
             };
         };
+        /** @description Multipart upload payload for POST /api/v3/files. The binary `file` is required; everything else mirrors the upstream optional fields. See https://docs.byteplus.com/en/docs/ModelArk/1870405. */
+        BytePlusFileUploadRequest: {
+            /**
+             * Format: binary
+             * @description The binary file to upload.
+             */
+            file: string;
+            /**
+             * @description Purpose of the uploaded file. `user_data` is a general-purpose value
+             *     and the only one currently documented by BytePlus.
+             * @default user_data
+             */
+            purpose: string;
+            /**
+             * @description Unix timestamp (seconds, UTC) at which the file should be expired.
+             *     Range: [now + 86400, now + 2592000] (1 day to 30 days).
+             *     Default: now + 604800 (7 days).
+             */
+            expire_at?: number;
+            preprocess_configs?: components["schemas"]["BytePlusFilePreprocessConfigs"];
+        };
+        /** @description Preprocessing rules applied to the uploaded file by file type. */
+        BytePlusFilePreprocessConfigs: {
+            video?: {
+                /**
+                 * Format: float
+                 * @description Number of frames per second sampled from the video at upload
+                 *     time. Higher values capture more detail but consume more tokens
+                 *     during inference (range [10k, 80k] tokens per video).
+                 * @default 1
+                 */
+                fps: number | null;
+                /**
+                 * @description Video-understanding model ID or endpoint ID whose frame-sampling
+                 *     strategy should be applied during preprocessing. If omitted, the
+                 *     pre-`seed-1.8` default strategy is used.
+                 */
+                model?: string;
+            } | null;
+        } | null;
+        /** @description File object returned by POST /api/v3/files and GET /api/v3/files/{id}. See https://docs.byteplus.com/en/docs/ModelArk/1873424. */
+        BytePlusFile: {
+            /** @description Fixed to `file`. */
+            object?: string;
+            /** @description The unique ID of the file. */
+            id?: string;
+            /** @description The purpose of the file. */
+            purpose?: string;
+            /** @description File size in bytes. Returned only when status is `active`. */
+            bytes?: number;
+            /** @description Unix timestamp (seconds) when the file was uploaded. */
+            created_at?: number;
+            /** @description Unix timestamp (seconds) when the file expires. */
+            expire_at?: number;
+            /** @description MIME type of the file. Returned only when status is `active`. */
+            mime_type?: string;
+            /**
+             * @description Processing status of the file.
+             * @enum {string}
+             */
+            status?: "processing" | "active" | "failed";
+            /** @description Error details returned only when status is `failed`. */
+            error?: {
+                /** @description Error code. */
+                code?: string;
+                /** @description Error description. */
+                message?: string;
+            } | null;
+            preprocess_configs?: components["schemas"]["BytePlusFilePreprocessConfigs"];
+        };
+        /** @description One entry in the `input` array of a Responses request. Discriminated by the `type` field. See https://docs.byteplus.com/en/docs/ModelArk/1585128. */
+        BytePlusResponseInputItem: components["schemas"]["BytePlusResponseInputMessage"] | components["schemas"]["BytePlusResponseInputFunctionCall"] | components["schemas"]["BytePlusResponseInputFunctionCallOutput"] | components["schemas"]["BytePlusResponseInputReasoning"];
+        /** @description A message sent to the model (or a stored prior message when `status` is set). Role precedence: developer/system > user; assistant messages represent prior model output. */
+        BytePlusResponseInputMessage: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "message";
+            /** @enum {string} */
+            role: "user" | "system" | "assistant" | "developer";
+            content: string | components["schemas"]["BytePlusResponseMessageContent"][];
+            /** @description Enables Continuation mode. Set the last message's role to `assistant` and `partial` to true; the model continues from its existing content. */
+            partial?: boolean;
+            /**
+             * @description Status of a previously stored message. Only used when echoing previous inputs back to the model.
+             * @enum {string}
+             */
+            status?: "in_progress" | "completed" | "incomplete";
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description One content item inside a message. Discriminated by `type`: `input_text` for text, `input_image` for images, `input_video` for videos, `input_file` for PDF/file uploads. File-backed types may reference a Files API id via `file_id`. */
+        BytePlusResponseMessageContent: components["schemas"]["BytePlusResponseInputText"] | components["schemas"]["BytePlusResponseInputImage"] | components["schemas"]["BytePlusResponseInputVideo"] | components["schemas"]["BytePlusResponseInputFile"];
+        BytePlusResponseInputText: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "input_text";
+            text: string;
+            /** @description Translation-scenario configuration. Only supported by seed-translation-250728. */
+            translation_options?: {
+                source_language?: string;
+                target_language: string;
+            } & {
+                [key: string]: unknown;
+            };
+        } & {
+            [key: string]: unknown;
+        };
+        BytePlusResponseInputImage: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "input_image";
+            /** @description ID of a file uploaded via the Files API. Must be `active`. */
+            file_id?: string;
+            /** @description Image URL or `data:image/...;base64,...` payload. */
+            image_url?: string;
+            /**
+             * @default auto
+             * @enum {string}
+             */
+            detail: "high" | "low" | "auto";
+            /** @description Optional pixel-count bounds. Overrides `detail` when set. Image pixel count must stay in [196, 36_000_000]. */
+            image_pixel_limit?: ({
+                max_pixels?: number;
+                min_pixels?: number;
+            } & {
+                [key: string]: unknown;
+            }) | null;
+        } & {
+            [key: string]: unknown;
+        };
+        BytePlusResponseInputVideo: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "input_video";
+            /** @description ID of a file uploaded via the Files API. Must be `active`. */
+            file_id?: string;
+            /** @description Video URL or `data:video/...;base64,...` payload. */
+            video_url?: string;
+            /**
+             * Format: float
+             * @description Frames-per-second extracted from the video.
+             */
+            fps?: number;
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description File input (currently PDF only). Provide exactly one of `file_id`, `file_data`, or `file_url`. `filename` is required with `file_data`. */
+        BytePlusResponseInputFile: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "input_file";
+            /** @description ID of a file uploaded via the Files API. Must be `active`. */
+            file_id?: string;
+            /** @description Base64-encoded file (single file <= 50 MB). */
+            file_data?: string;
+            /** @description Required when `file_data` is set. */
+            filename?: string;
+            /** @description Publicly accessible URL (single file <= 50 MB). */
+            file_url?: string;
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description A tool/function invocation produced by the model in a prior turn. */
+        BytePlusResponseInputFunctionCall: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "function_call";
+            /** @description JSON-encoded string of the function arguments. */
+            arguments: string;
+            /** @description Unique ID of the tool call generated by the model. */
+            call_id: string;
+            name: string;
+            status?: string;
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description Output returned by a tool, paired with the function_call via call_id. */
+        BytePlusResponseInputFunctionCallOutput: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "function_call_output";
+            call_id: string;
+            output: string;
+            status?: string;
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description Chain-of-thought block. Used both as input (manual reasoning injection for seed-1-8, seed-2-0, deepseek-v3-2) and as a response output item. As input, prefer `previous_response_id` in multi-turn conversations. */
+        BytePlusResponseInputReasoning: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "reasoning";
+            id?: string;
+            /** @enum {string} */
+            status?: "in_progress" | "completed" | "incomplete";
+            summary?: ({
+                /**
+                 * @default summary_text
+                 * @enum {string}
+                 */
+                type: "summary_text";
+                text?: string;
+            } & {
+                [key: string]: unknown;
+            })[];
+            /** @description Original (un-summarized) reasoning content. Returned on output items; not used on input. */
+            content?: ({
+                /**
+                 * @default reasoning_text
+                 * @enum {string}
+                 */
+                type: "reasoning_text";
+                text?: string;
+            } & {
+                [key: string]: unknown;
+            })[];
+            /** @description Encrypted+compressed original reasoning content. Returned only when `reasoning.encrypted_content` is in the request's `include` list. Supported from seed-2-0-pro-260328. */
+            encrypted_content?: string;
+        } & {
+            [key: string]: unknown;
+        };
+        BytePlusResponseCreateRequest: {
+            /** @description Model ID or Endpoint ID. See https://docs.byteplus.com/en/docs/ModelArk/1330310 for the model list and https://docs.byteplus.com/en/docs/ModelArk/1099522 for Endpoint IDs. */
+            model: string;
+            /** @description Text content or list of input items provided to the model. */
+            input: string | components["schemas"]["BytePlusResponseInputItem"][];
+            /** @description System/developer message prepended as the first instruction. Not compatible with `caching` — if `caching.type` is `enabled`, setting `instructions` returns an error. */
+            instructions?: string | null;
+            /** @description ID of the previous response, used to continue a multi-turn conversation. Insert ~100ms between requests to avoid failures. */
+            previous_response_id?: string | null;
+            /** @description Unix timestamp (seconds, UTC) at which the stored response and cache expire. Range (creation_time, creation_time + 604800]. Default: creation_time + 259200 (3 days). */
+            expire_at?: number;
+            /** @description Maximum output tokens (response + chain-of-thought). */
+            max_output_tokens?: number | null;
+            /** @description Controls deep-thinking mode. */
+            thinking?: {
+                /**
+                 * @description `enabled`: always reason before responding.
+                 *     `disabled`: respond without additional reasoning.
+                 *     `auto`: model decides per-query.
+                 * @enum {string}
+                 */
+                type?: "enabled" | "disabled" | "auto";
+            } & {
+                [key: string]: unknown;
+            };
+            /** @description Limits the workload of deep thinking. */
+            reasoning?: {
+                /**
+                 * @description `minimal` disables thinking entirely. With `thinking.type =
+                 *     disabled`, only `minimal` is allowed.
+                 * @enum {string}
+                 */
+                effort?: "minimal" | "low" | "medium" | "high";
+            } & {
+                [key: string]: unknown;
+            };
+            /** @description Additional output fields to include. Currently supported: `reasoning.encrypted_content` (encrypted+compressed reasoning for manual multi-turn reuse). */
+            include?: string[];
+            /** @description Context-cache configuration. */
+            caching?: {
+                /** @enum {string} */
+                type?: "enabled" | "disabled";
+                /**
+                 * @description When true, only create the public prefix cache; the model does not respond.
+                 * @default false
+                 */
+                prefix: boolean;
+            } & {
+                [key: string]: unknown;
+            };
+            /**
+             * @description When true, the response is persisted and retrievable by ID for multi-turn use.
+             * @default true
+             */
+            store: boolean | null;
+            /**
+             * Format: float
+             * @default 1
+             */
+            temperature: number | null;
+            /**
+             * Format: float
+             * @default 0.7
+             */
+            top_p: number | null;
+            /** @description Output-format configuration. */
+            text?: {
+                format?: components["schemas"]["BytePlusResponseTextFormat"];
+            } & {
+                [key: string]: unknown;
+            };
+            tools?: components["schemas"]["BytePlusResponseTool"][];
+            /** @description Tool-selection mode. Only seed-1-6 models support this field. */
+            tool_choice?: ("none" | "auto" | "required") | components["schemas"]["BytePlusResponseToolChoiceObject"];
+            max_tool_calls?: number;
+            context_management?: components["schemas"]["BytePlusResponseContextManagement"];
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description A tool the model may invoke. Currently only `function` is supported. */
+        BytePlusResponseTool: {
+            /**
+             * @default function
+             * @enum {string}
+             */
+            type: "function";
+            name: string;
+            description?: string;
+            /** @description JSON Schema describing the function's parameters. */
+            parameters: {
+                [key: string]: unknown;
+            };
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description Forces the model to call a specific tool. When `type` is `function`, `name` is required. */
+        BytePlusResponseToolChoiceObject: {
+            /** @enum {string} */
+            type: "function";
+            name?: string;
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description Text-output format discriminated by `type`. `text` returns natural language, `json_object` returns a free-form JSON object, `json_schema` constrains output to a caller-supplied JSON Schema. */
+        BytePlusResponseTextFormat: components["schemas"]["BytePlusResponseTextFormatText"] | components["schemas"]["BytePlusResponseTextFormatJSONObject"] | components["schemas"]["BytePlusResponseTextFormatJSONSchema"];
+        BytePlusResponseTextFormatText: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "text";
+        } & {
+            [key: string]: unknown;
+        };
+        BytePlusResponseTextFormatJSONObject: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "json_object";
+        } & {
+            [key: string]: unknown;
+        };
+        BytePlusResponseTextFormatJSONSchema: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "json_schema";
+            /** @description Caller-defined name for the JSON structure. */
+            name: string;
+            /** @description JSON Schema the model output must conform to. */
+            schema: {
+                [key: string]: unknown;
+            };
+            /** @description Hint the model uses when generating the response. */
+            description?: string | null;
+            /** @default false */
+            strict: boolean | null;
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description Context-management strategies (`clear_thinking`, `clear_tool_uses`) applied to keep the context window manageable. */
+        BytePlusResponseContextManagement: {
+            edits?: components["schemas"]["BytePlusResponseContextEdit"][];
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description A single context-edit strategy, discriminated by `type`. */
+        BytePlusResponseContextEdit: components["schemas"]["BytePlusResponseContextEditClearThinking"] | components["schemas"]["BytePlusResponseContextEditClearToolUses"];
+        /** @description Clears chain-of-thought content per the `keep` strategy. */
+        BytePlusResponseContextEditClearThinking: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "clear_thinking";
+            keep: ({
+                /**
+                 * @default thinking_turns
+                 * @enum {string}
+                 */
+                type: "thinking_turns";
+                /**
+                 * @description Retain chain-of-thought for the most recent N turns.
+                 * @default 1
+                 */
+                value: number;
+            } & {
+                [key: string]: unknown;
+            }) | "all";
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description Clears tool-call content when the conversation exceeds a threshold. */
+        BytePlusResponseContextEditClearToolUses: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "clear_tool_uses";
+            keep: {
+                /**
+                 * @default tool_uses
+                 * @enum {string}
+                 */
+                type: "tool_uses";
+                /**
+                 * @description Retain tool-call content for the most recent N turns.
+                 * @default 3
+                 */
+                value: number;
+            } & {
+                [key: string]: unknown;
+            };
+            /** @description Tool names that are never cleared. */
+            exclude_tools?: string[];
+            /**
+             * @description Whether to clear tool-call parameters.
+             * @default false
+             */
+            clear_tool_input: boolean;
+            trigger: {
+                /**
+                 * @default tool_uses
+                 * @enum {string}
+                 */
+                type: "tool_uses";
+                /** @description Trigger cleanup when tool-call turns reach N. */
+                value: number;
+            } & {
+                [key: string]: unknown;
+            };
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description Non-streaming response body returned by POST /api/v3/responses. See https://docs.byteplus.com/en/docs/ModelArk/1783703. */
+        BytePlusResponseObject: {
+            /** @description Unique ID of the response. Use as `previous_response_id` to continue the conversation. */
+            id: string;
+            /**
+             * @default response
+             * @enum {string}
+             */
+            object: "response";
+            /** @description Unix timestamp (seconds) when the response was created. */
+            created_at: number;
+            /** @description Model ID that generated the response. */
+            model: string;
+            /** @enum {string} */
+            status: "in_progress" | "completed" | "incomplete" | "failed" | "cancelled";
+            /**
+             * @description TPM-guarantee-package usage. `default` means none.
+             * @enum {string}
+             */
+            service_tier?: "default";
+            error?: components["schemas"]["BytePlusResponseError"];
+            /** @description Populated when `status` is `incomplete`. */
+            incomplete_details?: ({
+                /** @description e.g. `max_output_tokens`, `content_filter`. */
+                reason?: string;
+            } & {
+                [key: string]: unknown;
+            }) | null;
+            /** @description Echo of the request's `instructions` field. */
+            instructions?: string | null;
+            previous_response_id?: string | null;
+            max_output_tokens?: number | null;
+            max_tool_calls?: number | null;
+            /** Format: float */
+            temperature?: number | null;
+            /** Format: float */
+            top_p?: number | null;
+            store?: boolean | null;
+            stream?: boolean | null;
+            /** @description Echo of the request's `text` field. */
+            text?: {
+                format?: components["schemas"]["BytePlusResponseTextFormat"];
+            } & {
+                [key: string]: unknown;
+            };
+            tools?: components["schemas"]["BytePlusResponseTool"][];
+            tool_choice?: ("none" | "auto" | "required") | components["schemas"]["BytePlusResponseToolChoiceObject"];
+            thinking?: {
+                /** @enum {string} */
+                type?: "enabled" | "disabled" | "auto";
+            } & {
+                [key: string]: unknown;
+            };
+            reasoning?: {
+                /** @enum {string} */
+                effort?: "minimal" | "low" | "medium" | "high";
+            } & {
+                [key: string]: unknown;
+            };
+            caching?: {
+                /** @enum {string} */
+                type?: "enabled" | "disabled";
+                prefix?: boolean;
+            } & {
+                [key: string]: unknown;
+            };
+            context_management?: components["schemas"]["BytePlusResponseAppliedContextManagement"];
+            /** @description Ordered output items produced by the model. */
+            output: components["schemas"]["BytePlusResponseOutputItem"][];
+            usage?: components["schemas"]["BytePlusResponseUsage"];
+            /** @description Unix timestamp (seconds) when the stored response expires. */
+            expire_at?: number;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /** @description Error details. Null when the response succeeded. */
+        BytePlusResponseError: {
+            code: string;
+            message: string;
+        } | null;
+        /** @description One item in a response's `output` array. Discriminated by `type`: `message` for assistant messages, `function_call` for tool invocations, `reasoning` for chain-of-thought blocks. Mirrors the input item shapes the model can read back via `previous_response_id`. */
+        BytePlusResponseOutputItem: components["schemas"]["BytePlusResponseOutputMessage"] | components["schemas"]["BytePlusResponseInputFunctionCall"] | components["schemas"]["BytePlusResponseInputReasoning"];
+        /** @description An assistant message produced by the model. */
+        BytePlusResponseOutputMessage: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "message";
+            id: string;
+            /**
+             * @default assistant
+             * @enum {string}
+             */
+            role: "assistant";
+            /** @enum {string} */
+            status?: "in_progress" | "completed" | "incomplete";
+            /** @description True when this message is a continuation-mode partial reply. */
+            partial?: boolean;
+            content: components["schemas"]["BytePlusResponseOutputContent"][];
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description One content block in an assistant message. `output_text` carries natural-language text and optional annotations; `refusal` carries a refusal message. */
+        BytePlusResponseOutputContent: components["schemas"]["BytePlusResponseOutputText"] | components["schemas"]["BytePlusResponseOutputRefusal"];
+        BytePlusResponseOutputText: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "output_text";
+            text: string;
+            annotations?: {
+                [key: string]: unknown;
+            }[];
+        } & {
+            [key: string]: unknown;
+        };
+        BytePlusResponseOutputRefusal: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "refusal";
+            refusal: string;
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description Token-usage breakdown for billing and observability. */
+        BytePlusResponseUsage: {
+            /** @description Total tokens in the request. */
+            input_tokens: number;
+            /** @description Breakdown of input tokens (cache hits, etc). */
+            input_tokens_details?: {
+                /** @description Tokens served from the context cache. */
+                cached_tokens?: number;
+            } & {
+                [key: string]: unknown;
+            };
+            /** @description Total tokens generated by the model. */
+            output_tokens: number;
+            /** @description Breakdown of output tokens (reasoning, etc). */
+            output_tokens_details?: {
+                /** @description Tokens consumed by chain-of-thought. */
+                reasoning_tokens?: number;
+            } & {
+                [key: string]: unknown;
+            };
+            /** @description input_tokens + output_tokens. */
+            total_tokens: number;
+            /** @description Per-tool invocation counts. */
+            tool_usage?: {
+                /** @description Number of image-processing tool calls. */
+                image_process?: number;
+                /** @description Number of MCP tool calls. */
+                mcp?: number;
+                /** @description Number of web-search tool invocations. */
+                web_search?: number;
+            } & {
+                [key: string]: unknown;
+            };
+            /** @description Per-tool breakdown of sub-tool invocation counts. */
+            tool_usage_details?: {
+                /** @description e.g. `{"zoom":1,"point":1,"grounding":1}`. */
+                image_process?: {
+                    [key: string]: unknown;
+                };
+                /** @description e.g. `{"mcp_server_tos":1,"mcp_server_tls":1}`. */
+                mcp?: {
+                    [key: string]: unknown;
+                };
+                /** @description e.g. `{"toutiao":1,"moji":1,"search_engine":1}`. */
+                web_search?: {
+                    [key: string]: unknown;
+                };
+            } & {
+                [key: string]: unknown;
+            };
+        };
+        /** @description Context-management strategies that were actually applied during this response. Unlike the request-side `BytePlusResponseContextManagement` (which configures strategies), this echoes the strategies the server invoked, with counts of what was cleared. */
+        BytePlusResponseAppliedContextManagement: {
+            applied_edits?: components["schemas"]["BytePlusResponseAppliedContextEdit"][];
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description One applied context-edit, discriminated by `type`. */
+        BytePlusResponseAppliedContextEdit: components["schemas"]["BytePlusResponseAppliedContextEditClearThinking"] | components["schemas"]["BytePlusResponseAppliedContextEditClearToolUses"];
+        BytePlusResponseAppliedContextEditClearThinking: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "clear_thinking";
+            /** @description Number of reasoning turns that were removed. */
+            cleared_thinking_turns?: number;
+        } & {
+            [key: string]: unknown;
+        };
+        BytePlusResponseAppliedContextEditClearToolUses: {
+            /**
+             * @description discriminator enum property added by openapi-typescript
+             * @enum {string}
+             */
+            type: "clear_tool_uses";
+            /** @description Number of tool invocations that were removed. */
+            cleared_tool_uses?: number;
+        } & {
+            [key: string]: unknown;
+        };
+        BytePlusResponseReasoningSummaryPart: {
+            /**
+             * @default summary_text
+             * @enum {string}
+             */
+            type: "summary_text";
+            text?: string;
+        } & {
+            [key: string]: unknown;
+        };
         SeedanceCreateVisualValidateSessionRequest: {
             /** @description Optional human-readable label for the asset group that will be created by this verification. Stored locally and returned by seedanceListVisualValidationGroups so users can identify their groups in selectors. */
             name?: string;
@@ -14696,10 +16379,16 @@ export interface components {
             message: string;
         };
         SeedanceVirtualLibraryCreateAssetRequest: {
-            /** @description Publicly accessible URL of the image asset to upload to the caller's virtual portrait library. */
+            /** @description Publicly accessible URL of the asset to upload to the caller's virtual portrait library. */
             url: string;
             /** @description Client-supplied content hash used as the per-customer dedup key. Re-submitting the same hash returns the existing asset id without re-uploading to BytePlus. */
             hash: string;
+            /**
+             * @description BytePlus asset type. The AIGC virtual library accepts both Image and Video. Defaults to Image for backward compatibility with existing clients.
+             * @default Image
+             * @enum {string}
+             */
+            asset_type: "Image" | "Video";
         };
         SeedanceVirtualLibraryCreateAssetResponse: {
             /** @description BytePlus-issued asset id. Clients poll seedanceGetAsset with this until status == Active. */
@@ -14710,7 +16399,7 @@ export interface components {
              * @description The ID of the model to call
              * @enum {string}
              */
-            model: "wan2.5-t2v-preview" | "wan2.5-i2v-preview" | "wan2.6-t2v" | "wan2.6-i2v" | "wan2.6-r2v" | "wan2.7-i2v" | "wan2.7-t2v" | "wan2.7-r2v" | "wan2.7-videoedit" | "happyhorse-1.0-t2v" | "happyhorse-1.0-i2v" | "happyhorse-1.0-r2v" | "happyhorse-1.0-video-edit";
+            model: "wan2.5-t2v-preview" | "wan2.5-i2v-preview" | "wan2.6-t2v" | "wan2.6-i2v" | "wan2.6-r2v" | "wan2.7-i2v" | "wan2.7-t2v" | "wan2.7-r2v" | "wan2.7-videoedit" | "happyhorse-1.0-t2v" | "happyhorse-1.0-i2v" | "happyhorse-1.0-r2v" | "happyhorse-1.0-video-edit" | "happyhorse-1.1-t2v" | "happyhorse-1.1-i2v" | "happyhorse-1.1-r2v";
             /** @description Enter basic information, such as prompt words, etc. */
             input: {
                 /**
@@ -16716,6 +18405,1704 @@ export interface components {
             /** @description A url to the generated video */
             url?: string | null;
         };
+        /** @description Request body for Anthropic Messages API (`/v1/messages`). Mirrors the upstream schema with strict typing only on fields the proxy reads (model, prompt extraction, streaming, billing). Other top-level fields (`tools`, `temperature`, `top_p`, `thinking`, `metadata`, etc.) pass through unchanged via `additionalProperties`. */
+        AnthropicCreateMessageRequest: {
+            /** @description Anthropic model identifier (e.g. `claude-sonnet-4-5`, `claude-opus-4-7`). */
+            model: string;
+            /** @description Maximum number of tokens to generate before stopping. */
+            max_tokens: number;
+            /** @description When true, the response is a `text/event-stream` of Anthropic message events instead of a single JSON body. */
+            stream?: boolean;
+            /** @description Top-level system prompt. Anthropic also accepts an array form via passthrough. */
+            system?: string;
+            /** @description Conversation turns. See Anthropic Messages API docs for the full content-block taxonomy. */
+            messages: components["schemas"]["AnthropicMessageParam"][];
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description A single conversation turn. The proxy only reads `role` and `content` (string or array of content blocks) for prompt capture; additional fields pass through. */
+        AnthropicMessageParam: {
+            /** @enum {string} */
+            role: "user" | "assistant";
+            /** @description Either a string shorthand or an array of content blocks (text, image, document, tool_use, tool_result, ...). */
+            content: unknown;
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description JSON shape of a non-streaming Messages API response. Most fields pass through; the proxy reads `usage` for billing. */
+        AnthropicCreateMessageResponse: {
+            id?: string;
+            type?: string;
+            role?: string;
+            model?: string;
+            stop_reason?: string | null;
+            stop_sequence?: string | null;
+            usage?: components["schemas"]["AnthropicMessagesUsage"];
+        } & {
+            [key: string]: unknown;
+        };
+        /** @description Token usage for an Anthropic Messages API call. */
+        AnthropicMessagesUsage: {
+            input_tokens?: number;
+            output_tokens?: number;
+            cache_creation_input_tokens?: number;
+            cache_read_input_tokens?: number;
+            cache_creation?: components["schemas"]["AnthropicCacheCreationUsage"];
+        };
+        /** @description Per-TTL breakdown of cache-write input tokens for an Anthropic Messages API call. */
+        AnthropicCacheCreationUsage: {
+            ephemeral_5m_input_tokens?: number;
+            ephemeral_1h_input_tokens?: number;
+        };
+        /**
+         * MetadataLevel
+         * @description Opt-in level for surfacing routing metadata on the response under `openrouter_metadata`.
+         * @enum {string}
+         */
+        OpenRouterMetadataLevel: "disabled" | "enabled";
+        /**
+         * AnthropicCacheControlTtl
+         * @enum {string}
+         */
+        OpenRouterAnthropicCacheControlTtl: "5m" | "1h";
+        /**
+         * AnthropicCacheControlDirectiveType
+         * @enum {string}
+         */
+        OpenRouterAnthropicCacheControlDirectiveType: "ephemeral";
+        /**
+         * AnthropicCacheControlDirective
+         * @description Enable automatic prompt caching. When set at the top level, the system automatically applies cache breakpoints to the last cacheable block in the request. Currently supported for Anthropic Claude models.
+         */
+        OpenRouterAnthropicCacheControlDirective: {
+            ttl?: components["schemas"]["OpenRouterAnthropicCacheControlTtl"];
+            type: components["schemas"]["OpenRouterAnthropicCacheControlDirectiveType"];
+        };
+        /**
+         * ChatDebugOptions
+         * @description Debug options for inspecting request transformations (streaming only)
+         */
+        OpenRouterChatDebugOptions: {
+            /** @description If true, includes the transformed upstream request body in a debug chunk at the start of the stream. Only works with streaming mode. */
+            echo_upstream_body?: boolean;
+        };
+        /** ImageConfig */
+        OpenRouterImageConfig: string | number | unknown[];
+        /**
+         * ChatAudioOutput
+         * @description Audio output data or reference
+         */
+        OpenRouterChatAudioOutput: {
+            /** @description Base64 encoded audio data */
+            data?: string;
+            /** @description Audio expiration timestamp */
+            expires_at?: number;
+            /** @description Audio output identifier */
+            id?: string;
+            /** @description Audio transcript */
+            transcript?: string;
+        };
+        /** ChatContentItemsDiscriminatorMappingFileFile */
+        OpenRouterChatContentItemsDiscriminatorMappingFileFile: {
+            /** @description File content as base64 data URL or URL */
+            file_data?: string;
+            /** @description File ID for previously uploaded files */
+            file_id?: string;
+            /** @description Original filename */
+            filename?: string;
+        };
+        /**
+         * ChatContentItemsDiscriminatorMappingImageUrlImageUrlDetail
+         * @description Image detail level for vision models
+         * @enum {string}
+         */
+        OpenRouterChatContentItemsDiscriminatorMappingImageUrlImageUrlDetail: "auto" | "low" | "high";
+        /** ChatContentItemsDiscriminatorMappingImageUrlImageUrl */
+        OpenRouterChatContentItemsDiscriminatorMappingImageUrlImageUrl: {
+            /** @description Image detail level for vision models */
+            detail?: components["schemas"]["OpenRouterChatContentItemsDiscriminatorMappingImageUrlImageUrlDetail"];
+            /** @description URL of the image (data: URLs supported) */
+            url: string;
+        };
+        /** ChatContentItemsDiscriminatorMappingInputAudioInputAudio */
+        OpenRouterChatContentItemsDiscriminatorMappingInputAudioInputAudio: {
+            /** @description Base64 encoded audio data */
+            data: string;
+            /** @description Audio format (e.g., wav, mp3, flac, m4a, ogg, aiff, aac, pcm16, pcm24). Supported formats vary by provider. */
+            format: string;
+        };
+        /**
+         * LegacyChatContentVideoType
+         * @enum {string}
+         */
+        OpenRouterLegacyChatContentVideoType: "input_video";
+        /**
+         * ChatContentVideoInput
+         * @description Video input object
+         */
+        OpenRouterChatContentVideoInput: {
+            /** @description URL of the video (data: URLs supported) */
+            url: string;
+        };
+        /**
+         * ChatContentCacheControlType
+         * @enum {string}
+         */
+        OpenRouterChatContentCacheControlType: "ephemeral";
+        /**
+         * ChatContentCacheControl
+         * @description Cache control for the content part
+         */
+        OpenRouterChatContentCacheControl: {
+            ttl?: components["schemas"]["OpenRouterAnthropicCacheControlTtl"];
+            type: components["schemas"]["OpenRouterChatContentCacheControlType"];
+        };
+        /**
+         * ChatContentTextType
+         * @enum {string}
+         */
+        OpenRouterChatContentTextType: "text";
+        /**
+         * ChatContentVideoType
+         * @enum {string}
+         */
+        OpenRouterChatContentVideoType: "video_url";
+        /**
+         * ChatContentItems
+         * @description Content part for chat completion messages
+         */
+        OpenRouterChatContentItems: {
+            /**
+             * @description Discriminator value: file
+             * @enum {string}
+             */
+            type: "file";
+            file: components["schemas"]["OpenRouterChatContentItemsDiscriminatorMappingFileFile"];
+        } | {
+            /**
+             * @description Discriminator value: image_url
+             * @enum {string}
+             */
+            type: "image_url";
+            image_url: components["schemas"]["OpenRouterChatContentItemsDiscriminatorMappingImageUrlImageUrl"];
+        } | {
+            /**
+             * @description Discriminator value: input_audio
+             * @enum {string}
+             */
+            type: "input_audio";
+            input_audio: components["schemas"]["OpenRouterChatContentItemsDiscriminatorMappingInputAudioInputAudio"];
+        } | {
+            type: components["schemas"]["OpenRouterLegacyChatContentVideoType"];
+            video_url: components["schemas"]["OpenRouterChatContentVideoInput"];
+        } | {
+            type: components["schemas"]["OpenRouterChatContentTextType"];
+            cache_control?: components["schemas"]["OpenRouterChatContentCacheControl"];
+            text: string;
+        } | {
+            type: components["schemas"]["OpenRouterChatContentVideoType"];
+            video_url: components["schemas"]["OpenRouterChatContentVideoInput"];
+        };
+        /** ChatMessagesDiscriminatorMappingAssistantContent1 */
+        OpenRouterChatMessagesDiscriminatorMappingAssistantContent1: components["schemas"]["OpenRouterChatContentItems"][];
+        /**
+         * ChatMessagesDiscriminatorMappingAssistantContent
+         * @description Assistant message content
+         */
+        OpenRouterChatMessagesDiscriminatorMappingAssistantContent: string | components["schemas"]["OpenRouterChatMessagesDiscriminatorMappingAssistantContent1"] | unknown;
+        /** ChatAssistantImagesItemsImageUrl */
+        OpenRouterChatAssistantImagesItemsImageUrl: {
+            /** @description URL or base64-encoded data of the generated image */
+            url: string;
+        };
+        /** ChatAssistantImagesItems */
+        OpenRouterChatAssistantImagesItems: {
+            image_url: components["schemas"]["OpenRouterChatAssistantImagesItemsImageUrl"];
+        };
+        /**
+         * ChatAssistantImages
+         * @description Generated images from image generation models
+         */
+        OpenRouterChatAssistantImages: components["schemas"]["OpenRouterChatAssistantImagesItems"][];
+        /**
+         * ReasoningFormat
+         * @enum {string}
+         */
+        OpenRouterReasoningFormat: "unknown" | "openai-responses-v1" | "azure-openai-responses-v1" | "xai-responses-v1" | "anthropic-claude-v1" | "google-gemini-v1";
+        /**
+         * ReasoningDetailUnion
+         * @description Reasoning detail union schema
+         */
+        OpenRouterReasoningDetailUnion: {
+            /** @description Discriminator value: reasoning.encrypted */
+            type: string;
+            data: string;
+            format?: components["schemas"]["OpenRouterReasoningFormat"];
+            id?: string | null;
+            index?: number;
+        } | {
+            /** @description Discriminator value: reasoning.summary */
+            type: string;
+            format?: components["schemas"]["OpenRouterReasoningFormat"];
+            id?: string | null;
+            index?: number;
+            summary: string;
+        } | {
+            /** @description Discriminator value: reasoning.text */
+            type: string;
+            format?: components["schemas"]["OpenRouterReasoningFormat"];
+            id?: string | null;
+            index?: number;
+            signature?: string | null;
+            text?: string | null;
+        };
+        /**
+         * ChatReasoningDetails
+         * @description Reasoning details for extended thinking models
+         */
+        OpenRouterChatReasoningDetails: components["schemas"]["OpenRouterReasoningDetailUnion"][];
+        /** ChatToolCallFunction */
+        OpenRouterChatToolCallFunction: {
+            /** @description Function arguments as JSON string */
+            arguments: string;
+            /** @description Function name to call */
+            name: string;
+        };
+        /**
+         * ChatToolCallType
+         * @enum {string}
+         */
+        OpenRouterChatToolCallType: "function";
+        /**
+         * ChatToolCall
+         * @description Tool call made by the assistant
+         */
+        OpenRouterChatToolCall: {
+            function: components["schemas"]["OpenRouterChatToolCallFunction"];
+            /** @description Tool call identifier */
+            id: string;
+            type: components["schemas"]["OpenRouterChatToolCallType"];
+        };
+        /**
+         * ChatContentText
+         * @description Text content part
+         */
+        OpenRouterChatContentText: {
+            cache_control?: components["schemas"]["OpenRouterChatContentCacheControl"];
+            text: string;
+            type: components["schemas"]["OpenRouterChatContentTextType"];
+        };
+        /** ChatMessagesDiscriminatorMappingDeveloperContent1 */
+        OpenRouterChatMessagesDiscriminatorMappingDeveloperContent1: components["schemas"]["OpenRouterChatContentText"][];
+        /**
+         * ChatMessagesDiscriminatorMappingDeveloperContent
+         * @description Developer message content
+         */
+        OpenRouterChatMessagesDiscriminatorMappingDeveloperContent: string | components["schemas"]["OpenRouterChatMessagesDiscriminatorMappingDeveloperContent1"];
+        /** ChatSystemMessageContent1 */
+        OpenRouterChatSystemMessageContent1: components["schemas"]["OpenRouterChatContentText"][];
+        /**
+         * ChatSystemMessageContent
+         * @description System message content
+         */
+        OpenRouterChatSystemMessageContent: string | components["schemas"]["OpenRouterChatSystemMessageContent1"];
+        /**
+         * ChatSystemMessageRole
+         * @enum {string}
+         */
+        OpenRouterChatSystemMessageRole: "system";
+        /** ChatToolMessageContent1 */
+        OpenRouterChatToolMessageContent1: components["schemas"]["OpenRouterChatContentItems"][];
+        /**
+         * ChatToolMessageContent
+         * @description Tool response content
+         */
+        OpenRouterChatToolMessageContent: string | components["schemas"]["OpenRouterChatToolMessageContent1"];
+        /**
+         * ChatToolMessageRole
+         * @enum {string}
+         */
+        OpenRouterChatToolMessageRole: "tool";
+        /** ChatUserMessageContent1 */
+        OpenRouterChatUserMessageContent1: components["schemas"]["OpenRouterChatContentItems"][];
+        /**
+         * ChatUserMessageContent
+         * @description User message content
+         */
+        OpenRouterChatUserMessageContent: string | components["schemas"]["OpenRouterChatUserMessageContent1"];
+        /**
+         * ChatUserMessageRole
+         * @enum {string}
+         */
+        OpenRouterChatUserMessageRole: "user";
+        /**
+         * ChatMessages
+         * @description Chat completion message with role-based discrimination
+         */
+        OpenRouterChatMessages: {
+            /**
+             * @description Discriminator value: assistant
+             * @enum {string}
+             */
+            role: "assistant";
+            audio?: components["schemas"]["OpenRouterChatAudioOutput"];
+            /** @description Assistant message content */
+            content?: components["schemas"]["OpenRouterChatMessagesDiscriminatorMappingAssistantContent"];
+            images?: components["schemas"]["OpenRouterChatAssistantImages"];
+            /** @description Optional name for the assistant */
+            name?: string;
+            /** @description Reasoning output */
+            reasoning?: string | null;
+            reasoning_details?: components["schemas"]["OpenRouterChatReasoningDetails"];
+            /** @description Refusal message if content was refused */
+            refusal?: string | null;
+            /** @description Tool calls made by the assistant */
+            tool_calls?: components["schemas"]["OpenRouterChatToolCall"][];
+        } | {
+            /**
+             * @description Discriminator value: developer
+             * @enum {string}
+             */
+            role: "developer";
+            /** @description Developer message content */
+            content: components["schemas"]["OpenRouterChatMessagesDiscriminatorMappingDeveloperContent"];
+            /** @description Optional name for the developer message */
+            name?: string;
+        } | {
+            role: components["schemas"]["OpenRouterChatSystemMessageRole"];
+            /** @description System message content */
+            content: components["schemas"]["OpenRouterChatSystemMessageContent"];
+            /** @description Optional name for the system message */
+            name?: string;
+        } | {
+            role: components["schemas"]["OpenRouterChatToolMessageRole"];
+            /** @description Tool response content */
+            content: components["schemas"]["OpenRouterChatToolMessageContent"];
+            /** @description ID of the assistant message tool call this message responds to */
+            tool_call_id: string;
+        } | {
+            role: components["schemas"]["OpenRouterChatUserMessageRole"];
+            /** @description User message content */
+            content: components["schemas"]["OpenRouterChatUserMessageContent"];
+            /** @description Optional name for the user */
+            name?: string;
+        };
+        /**
+         * ChatRequestModalitiesItems
+         * @enum {string}
+         */
+        OpenRouterChatRequestModalitiesItems: "text" | "image" | "audio";
+        /**
+         * ModelName
+         * @description Model to use for completion
+         */
+        OpenRouterModelName: string;
+        /**
+         * ChatModelNames
+         * @description Models to use for completion
+         */
+        OpenRouterChatModelNames: components["schemas"]["OpenRouterModelName"][];
+        /**
+         * ContextCompressionEngine
+         * @description The compression engine to use. Defaults to "middle-out".
+         * @enum {string}
+         */
+        OpenRouterContextCompressionEngine: "middle-out";
+        /**
+         * PdfParserEngine0
+         * @enum {string}
+         */
+        OpenRouterPdfParserEngine0: "mistral-ocr" | "native" | "cloudflare-ai";
+        /**
+         * PdfParserEngine1
+         * @enum {string}
+         */
+        OpenRouterPdfParserEngine1: "pdf-text";
+        /**
+         * PDFParserEngine
+         * @description The engine to use for parsing PDF files. "pdf-text" is deprecated and automatically redirected to "cloudflare-ai".
+         */
+        OpenRouterPDFParserEngine: components["schemas"]["OpenRouterPdfParserEngine0"] | components["schemas"]["OpenRouterPdfParserEngine1"];
+        /**
+         * PDFParserOptions
+         * @description Options for PDF parsing.
+         */
+        OpenRouterPDFParserOptions: {
+            engine?: components["schemas"]["OpenRouterPDFParserEngine"];
+        };
+        /**
+         * WebSearchEngine
+         * @description The search engine to use for web search.
+         * @enum {string}
+         */
+        OpenRouterWebSearchEngine: "native" | "exa" | "firecrawl" | "parallel";
+        /**
+         * WebSearchPluginId
+         * @enum {string}
+         */
+        OpenRouterWebSearchPluginId: "web";
+        /**
+         * WebSearchPluginUserLocationType
+         * @enum {string}
+         */
+        OpenRouterWebSearchPluginUserLocationType: "approximate";
+        /**
+         * WebSearchPluginUserLocation
+         * @description Approximate user location for location-biased search results. Passed through to native providers that support it (e.g. Anthropic).
+         */
+        OpenRouterWebSearchPluginUserLocation: {
+            city?: string | null;
+            country?: string | null;
+            region?: string | null;
+            timezone?: string | null;
+            type: components["schemas"]["OpenRouterWebSearchPluginUserLocationType"];
+        };
+        /**
+         * WebFetchPluginId
+         * @enum {string}
+         */
+        OpenRouterWebFetchPluginId: "web-fetch";
+        /** ChatRequestPluginsItems */
+        OpenRouterChatRequestPluginsItems: {
+            /**
+             * @description Discriminator value: auto-router
+             * @enum {string}
+             */
+            id: "auto-router";
+            /** @description List of model patterns to filter which models the auto-router can route between. Supports wildcards (e.g., "anthropic/*" matches all Anthropic models). When not specified, uses the default supported models list. */
+            allowed_models?: string[];
+            /** @description Set to false to disable the auto-router plugin for this request. Defaults to true. */
+            enabled?: boolean;
+        } | {
+            /**
+             * @description Discriminator value: context-compression
+             * @enum {string}
+             */
+            id: "context-compression";
+            /** @description Set to false to disable the context-compression plugin for this request. Defaults to true. */
+            enabled?: boolean;
+            engine?: components["schemas"]["OpenRouterContextCompressionEngine"];
+        } | {
+            /**
+             * @description Discriminator value: file-parser
+             * @enum {string}
+             */
+            id: "file-parser";
+            /** @description Set to false to disable the file-parser plugin for this request. Defaults to true. */
+            enabled?: boolean;
+            pdf?: components["schemas"]["OpenRouterPDFParserOptions"];
+        } | {
+            /**
+             * @description Discriminator value: fusion
+             * @enum {string}
+             */
+            id: "fusion";
+            /** @description Slugs of models to run in parallel as the "expert panel" the judge analyzes. Each model receives the same user prompt with web_search + web_fetch enabled. Capped at 8 models to bound cost amplification. When omitted, defaults to the Quality preset from the /labs/fusion UI (~anthropic/claude-opus-latest, ~openai/gpt-latest, ~google/gemini-pro-latest). */
+            analysis_models?: string[];
+            /** @description Set to false to disable the fusion plugin for this request. Defaults to true. */
+            enabled?: boolean;
+            /** @description Maximum number of tool-calling steps each panelist (analysis model) and the judge model may take during their agentic web-research loop. Models with web_search/web_fetch enabled iterate until they produce a text response or hit this ceiling. Defaults to 8. Capped at 16. */
+            max_tool_calls?: number;
+            /** @description Slug of the model that performs both the judge step (with web_search + web_fetch) and the final synthesis. When omitted, defaults to the first model in the Quality preset. */
+            model?: string;
+        } | {
+            /**
+             * @description Discriminator value: moderation
+             * @enum {string}
+             */
+            id: "moderation";
+        } | {
+            /**
+             * @description Discriminator value: pareto-router
+             * @enum {string}
+             */
+            id: "pareto-router";
+            /** @description Set to false to disable the pareto-router plugin for this request. Defaults to true. */
+            enabled?: boolean;
+            /**
+             * Format: double
+             * @description Minimum desired coding score between 0 and 1, where 1 is best. Higher values select from stronger coding models (sourced from Artificial Analysis coding percentiles). Maps internally to one of three tiers (low, medium, high). Omit to use the router default tier.
+             */
+            min_coding_score?: number;
+        } | {
+            /**
+             * @description Discriminator value: response-healing
+             * @enum {string}
+             */
+            id: "response-healing";
+            /** @description Set to false to disable the response-healing plugin for this request. Defaults to true. */
+            enabled?: boolean;
+        } | {
+            id: components["schemas"]["OpenRouterWebSearchPluginId"];
+            /** @description Set to false to disable the web-search plugin for this request. Defaults to true. */
+            enabled?: boolean;
+            engine?: components["schemas"]["OpenRouterWebSearchEngine"];
+            /** @description A list of domains to exclude from web search results. Supports wildcards (e.g. "*.substack.com") and path filtering (e.g. "openai.com/blog"). */
+            exclude_domains?: string[];
+            /** @description A list of domains to restrict web search results to. Supports wildcards (e.g. "*.substack.com") and path filtering (e.g. "openai.com/blog"). */
+            include_domains?: string[];
+            max_results?: number;
+            /** @description Maximum number of times the model can invoke web search in a single turn. Passed through to native providers that support it (e.g. Anthropic). */
+            max_uses?: number;
+            search_prompt?: string;
+            user_location?: components["schemas"]["OpenRouterWebSearchPluginUserLocation"];
+        } | {
+            id: components["schemas"]["OpenRouterWebFetchPluginId"];
+            /** @description Only fetch from these domains. */
+            allowed_domains?: string[];
+            /** @description Never fetch from these domains. */
+            blocked_domains?: string[];
+            /** @description Maximum content length in approximate tokens. Content exceeding this limit is truncated. */
+            max_content_tokens?: number;
+            /** @description Maximum number of web fetches per request. Once exceeded, the tool returns an error. */
+            max_uses?: number;
+        };
+        /**
+         * ProviderPreferencesDataCollection
+         * @description Data collection setting. If no available model provider meets the requirement, your request will return an error.
+         *     - allow: (default) allow providers which store user data non-transiently and may train on it
+         *
+         *     - deny: use only providers which do not collect user data.
+         * @enum {string}
+         */
+        OpenRouterProviderPreferencesDataCollection: "deny" | "allow";
+        /**
+         * ProviderName
+         * @enum {string}
+         */
+        OpenRouterProviderName: "AkashML" | "AI21" | "AionLabs" | "Alibaba" | "Ambient" | "Baidu" | "Amazon Bedrock" | "Amazon Nova" | "Anthropic" | "Arcee AI" | "AtlasCloud" | "Avian" | "Azure" | "BaseTen" | "BytePlus" | "Black Forest Labs" | "Cerebras" | "Chutes" | "Cirrascale" | "Clarifai" | "Cloudflare" | "Cohere" | "Crucible" | "Crusoe" | "DeepInfra" | "DeepSeek" | "DekaLLM" | "Featherless" | "Fireworks" | "Friendli" | "GMICloud" | "Google" | "Google AI Studio" | "Groq" | "Hyperbolic" | "Inception" | "Inceptron" | "InferenceNet" | "Ionstream" | "Infermatic" | "Io Net" | "Inflection" | "Liquid" | "Mara" | "Mancer 2" | "Minimax" | "ModelRun" | "Mistral" | "Modular" | "Moonshot AI" | "Morph" | "NCompass" | "Nebius" | "Nex AGI" | "NextBit" | "Novita" | "Nvidia" | "OpenAI" | "OpenInference" | "Parasail" | "Poolside" | "Perceptron" | "Perplexity" | "Phala" | "Recraft" | "Reka" | "Relace" | "SambaNova" | "Seed" | "SiliconFlow" | "Sourceful" | "StepFun" | "Stealth" | "StreamLake" | "Switchpoint" | "Together" | "Upstage" | "Venice" | "WandB" | "Xiaomi" | "xAI" | "Z.AI" | "FakeProvider";
+        /** ProviderPreferencesIgnoreItems */
+        OpenRouterProviderPreferencesIgnoreItems: components["schemas"]["OpenRouterProviderName"] | string;
+        /**
+         * BigNumberUnion
+         * @description Price per million prompt tokens
+         */
+        OpenRouterBigNumberUnion: string;
+        /**
+         * ProviderPreferencesMaxPrice
+         * @description The object specifying the maximum price you want to pay for this request. USD price per million tokens, for prompt and completion.
+         */
+        OpenRouterProviderPreferencesMaxPrice: {
+            audio?: components["schemas"]["OpenRouterBigNumberUnion"];
+            completion?: components["schemas"]["OpenRouterBigNumberUnion"];
+            image?: components["schemas"]["OpenRouterBigNumberUnion"];
+            prompt?: components["schemas"]["OpenRouterBigNumberUnion"];
+            request?: components["schemas"]["OpenRouterBigNumberUnion"];
+        };
+        /** ProviderPreferencesOnlyItems */
+        OpenRouterProviderPreferencesOnlyItems: components["schemas"]["OpenRouterProviderName"] | string;
+        /** ProviderPreferencesOrderItems */
+        OpenRouterProviderPreferencesOrderItems: components["schemas"]["OpenRouterProviderName"] | string;
+        /**
+         * PercentileLatencyCutoffs
+         * @description Percentile-based latency cutoffs. All specified cutoffs must be met for an endpoint to be preferred.
+         */
+        OpenRouterPercentileLatencyCutoffs: {
+            /**
+             * Format: double
+             * @description Maximum p50 latency (seconds)
+             */
+            p50?: number | null;
+            /**
+             * Format: double
+             * @description Maximum p75 latency (seconds)
+             */
+            p75?: number | null;
+            /**
+             * Format: double
+             * @description Maximum p90 latency (seconds)
+             */
+            p90?: number | null;
+            /**
+             * Format: double
+             * @description Maximum p99 latency (seconds)
+             */
+            p99?: number | null;
+        };
+        /**
+         * PreferredMaxLatency
+         * @description Preferred maximum latency (in seconds). Can be a number (applies to p50) or an object with percentile-specific cutoffs. Endpoints above the threshold(s) may still be used, but are deprioritized in routing. When using fallback models, this may cause a fallback model to be used instead of the primary model if it meets the threshold.
+         */
+        OpenRouterPreferredMaxLatency: number | components["schemas"]["OpenRouterPercentileLatencyCutoffs"] | unknown;
+        /**
+         * PercentileThroughputCutoffs
+         * @description Percentile-based throughput cutoffs. All specified cutoffs must be met for an endpoint to be preferred.
+         */
+        OpenRouterPercentileThroughputCutoffs: {
+            /**
+             * Format: double
+             * @description Minimum p50 throughput (tokens/sec)
+             */
+            p50?: number | null;
+            /**
+             * Format: double
+             * @description Minimum p75 throughput (tokens/sec)
+             */
+            p75?: number | null;
+            /**
+             * Format: double
+             * @description Minimum p90 throughput (tokens/sec)
+             */
+            p90?: number | null;
+            /**
+             * Format: double
+             * @description Minimum p99 throughput (tokens/sec)
+             */
+            p99?: number | null;
+        };
+        /**
+         * PreferredMinThroughput
+         * @description Preferred minimum throughput (in tokens per second). Can be a number (applies to p50) or an object with percentile-specific cutoffs. Endpoints below the threshold(s) may still be used, but are deprioritized in routing. When using fallback models, this may cause a fallback model to be used instead of the primary model if it meets the threshold.
+         */
+        OpenRouterPreferredMinThroughput: number | components["schemas"]["OpenRouterPercentileThroughputCutoffs"] | unknown;
+        /**
+         * Quantization
+         * @enum {string}
+         */
+        OpenRouterQuantization: "int4" | "int8" | "fp4" | "fp6" | "fp8" | "fp16" | "bf16" | "fp32" | "unknown";
+        /**
+         * ProviderSort
+         * @description The provider sorting strategy (price, throughput, latency)
+         * @enum {string}
+         */
+        OpenRouterProviderSort: "price" | "throughput" | "latency" | "exacto";
+        /**
+         * ProviderSortConfigBy
+         * @description The provider sorting strategy (price, throughput, latency)
+         * @enum {string}
+         */
+        OpenRouterProviderSortConfigBy: "price" | "throughput" | "latency" | "exacto";
+        /**
+         * ProviderSortConfigPartition
+         * @description Partitioning strategy for sorting: "model" (default) groups endpoints by model before sorting (fallback models remain fallbacks), "none" sorts all endpoints together regardless of model.
+         * @enum {string}
+         */
+        OpenRouterProviderSortConfigPartition: "model" | "none";
+        /**
+         * ProviderSortConfig
+         * @description The provider sorting strategy (price, throughput, latency)
+         */
+        OpenRouterProviderSortConfig: {
+            /** @description The provider sorting strategy (price, throughput, latency) */
+            by?: components["schemas"]["OpenRouterProviderSortConfigBy"];
+            /** @description Partitioning strategy for sorting: "model" (default) groups endpoints by model before sorting (fallback models remain fallbacks), "none" sorts all endpoints together regardless of model. */
+            partition?: components["schemas"]["OpenRouterProviderSortConfigPartition"];
+        };
+        /**
+         * ProviderPreferencesSort
+         * @description The sorting strategy to use for this request, if "order" is not specified. When set, no load balancing is performed.
+         */
+        OpenRouterProviderPreferencesSort: components["schemas"]["OpenRouterProviderSort"] | components["schemas"]["OpenRouterProviderSortConfig"] | unknown;
+        /**
+         * ProviderPreferences
+         * @description When multiple model providers are available, optionally indicate your routing preference.
+         */
+        OpenRouterProviderPreferences: {
+            /**
+             * @description Whether to allow backup providers to serve requests
+             *     - true: (default) when the primary provider (or your custom providers in "order") is unavailable, use the next best provider.
+             *     - false: use only the primary/custom provider, and return the upstream error if it's unavailable.
+             */
+            allow_fallbacks?: boolean | null;
+            /**
+             * @description Data collection setting. If no available model provider meets the requirement, your request will return an error.
+             *     - allow: (default) allow providers which store user data non-transiently and may train on it
+             *
+             *     - deny: use only providers which do not collect user data.
+             */
+            data_collection?: components["schemas"]["OpenRouterProviderPreferencesDataCollection"];
+            /** @description Whether to restrict routing to only models that allow text distillation. When true, only models where the author has allowed distillation will be used. */
+            enforce_distillable_text?: boolean | null;
+            /** @description List of provider slugs to ignore. If provided, this list is merged with your account-wide ignored provider settings for this request. */
+            ignore?: components["schemas"]["OpenRouterProviderPreferencesIgnoreItems"][] | null;
+            /** @description The object specifying the maximum price you want to pay for this request. USD price per million tokens, for prompt and completion. */
+            max_price?: components["schemas"]["OpenRouterProviderPreferencesMaxPrice"];
+            /** @description List of provider slugs to allow. If provided, this list is merged with your account-wide allowed provider settings for this request. */
+            only?: components["schemas"]["OpenRouterProviderPreferencesOnlyItems"][] | null;
+            /** @description An ordered list of provider slugs. The router will attempt to use the first provider in the subset of this list that supports your requested model, and fall back to the next if it is unavailable. If no providers are available, the request will fail with an error message. */
+            order?: components["schemas"]["OpenRouterProviderPreferencesOrderItems"][] | null;
+            preferred_max_latency?: components["schemas"]["OpenRouterPreferredMaxLatency"];
+            preferred_min_throughput?: components["schemas"]["OpenRouterPreferredMinThroughput"];
+            /** @description A list of quantization levels to filter the provider by. */
+            quantizations?: components["schemas"]["OpenRouterQuantization"][] | null;
+            /** @description Whether to filter providers to only those that support the parameters you've provided. If this setting is omitted or set to false, then providers will receive only the parameters they support, and ignore the rest. */
+            require_parameters?: boolean | null;
+            /** @description The sorting strategy to use for this request, if "order" is not specified. When set, no load balancing is performed. */
+            sort?: components["schemas"]["OpenRouterProviderPreferencesSort"];
+            /** @description Whether to restrict routing to only ZDR (Zero Data Retention) endpoints. When true, only endpoints that do not retain prompts will be used. */
+            zdr?: boolean | null;
+        };
+        /**
+         * ChatRequestReasoningEffort
+         * @description Constrains effort on reasoning for reasoning models
+         * @enum {string}
+         */
+        OpenRouterChatRequestReasoningEffort: "xhigh" | "high" | "medium" | "low" | "minimal" | "none";
+        /**
+         * ChatReasoningSummaryVerbosityEnum
+         * @enum {string}
+         */
+        OpenRouterChatReasoningSummaryVerbosityEnum: "auto" | "concise" | "detailed";
+        /**
+         * ChatRequestReasoning
+         * @description Configuration options for reasoning models
+         */
+        OpenRouterChatRequestReasoning: {
+            /** @description Constrains effort on reasoning for reasoning models */
+            effort?: components["schemas"]["OpenRouterChatRequestReasoningEffort"];
+            summary?: components["schemas"]["OpenRouterChatReasoningSummaryVerbosityEnum"];
+        };
+        /**
+         * FormatJsonObjectConfigType
+         * @enum {string}
+         */
+        OpenRouterFormatJsonObjectConfigType: "json_object";
+        /**
+         * ChatJsonSchemaConfig
+         * @description JSON Schema configuration object
+         */
+        OpenRouterChatJsonSchemaConfig: {
+            /** @description Schema description for the model */
+            description?: string;
+            /** @description Schema name (a-z, A-Z, 0-9, underscores, dashes, max 64 chars) */
+            name: string;
+            /** @description JSON Schema object */
+            schema?: {
+                [key: string]: unknown;
+            };
+            /** @description Enable strict schema adherence */
+            strict?: boolean | null;
+        };
+        /**
+         * ChatRequestResponseFormat
+         * @description Response format configuration
+         */
+        OpenRouterChatRequestResponseFormat: {
+            /**
+             * @description Discriminator value: grammar
+             * @enum {string}
+             */
+            type: "grammar";
+            /** @description Custom grammar for text generation */
+            grammar: string;
+        } | {
+            type: components["schemas"]["OpenRouterFormatJsonObjectConfigType"];
+        } | {
+            /**
+             * @description Discriminator value: json_schema
+             * @enum {string}
+             */
+            type: "json_schema";
+            json_schema: components["schemas"]["OpenRouterChatJsonSchemaConfig"];
+        } | {
+            /**
+             * @description Discriminator value: python
+             * @enum {string}
+             */
+            type: "python";
+        } | {
+            /**
+             * @description Discriminator value: text
+             * @enum {string}
+             */
+            type: "text";
+        };
+        /**
+         * ChatRequestServiceTier
+         * @description The service tier to use for processing this request.
+         * @enum {string}
+         */
+        OpenRouterChatRequestServiceTier: "auto" | "default" | "flex" | "priority" | "scale";
+        /**
+         * ChatRequestStop
+         * @description Stop sequences (up to 4)
+         */
+        OpenRouterChatRequestStop: string | string[] | unknown;
+        /**
+         * StopServerToolsWhenFinishReasonIsType
+         * @enum {string}
+         */
+        OpenRouterStopServerToolsWhenFinishReasonIsType: "finish_reason_is";
+        /**
+         * StopServerToolsWhenHasToolCallType
+         * @enum {string}
+         */
+        OpenRouterStopServerToolsWhenHasToolCallType: "has_tool_call";
+        /**
+         * StopServerToolsWhenMaxCostType
+         * @enum {string}
+         */
+        OpenRouterStopServerToolsWhenMaxCostType: "max_cost";
+        /**
+         * StopServerToolsWhenMaxTokensUsedType
+         * @enum {string}
+         */
+        OpenRouterStopServerToolsWhenMaxTokensUsedType: "max_tokens_used";
+        /**
+         * StopServerToolsWhenStepCountIsType
+         * @enum {string}
+         */
+        OpenRouterStopServerToolsWhenStepCountIsType: "step_count_is";
+        /**
+         * StopServerToolsWhenCondition
+         * @description A single condition that, when met, halts the server-tool agent loop.
+         */
+        OpenRouterStopServerToolsWhenCondition: {
+            type: components["schemas"]["OpenRouterStopServerToolsWhenFinishReasonIsType"];
+            reason: string;
+        } | {
+            type: components["schemas"]["OpenRouterStopServerToolsWhenHasToolCallType"];
+            tool_name: string;
+        } | {
+            type: components["schemas"]["OpenRouterStopServerToolsWhenMaxCostType"];
+            /** Format: double */
+            max_cost_in_dollars: number;
+        } | {
+            type: components["schemas"]["OpenRouterStopServerToolsWhenMaxTokensUsedType"];
+            max_tokens: number;
+        } | {
+            type: components["schemas"]["OpenRouterStopServerToolsWhenStepCountIsType"];
+            step_count: number;
+        };
+        /**
+         * StopServerToolsWhen
+         * @description Stop conditions for the server-tool agent loop. Any condition firing halts the loop (OR logic). When set, this overrides `max_tool_calls`.
+         */
+        OpenRouterStopServerToolsWhen: components["schemas"]["OpenRouterStopServerToolsWhenCondition"][];
+        /**
+         * ChatStreamOptions
+         * @description Streaming configuration options
+         */
+        OpenRouterChatStreamOptions: {
+            /** @description Deprecated: This field has no effect. Full usage details are always included. */
+            include_usage?: boolean;
+        };
+        /**
+         * ChatToolChoice0
+         * @enum {string}
+         */
+        OpenRouterChatToolChoice0: "none";
+        /**
+         * ChatToolChoice1
+         * @enum {string}
+         */
+        OpenRouterChatToolChoice1: "auto";
+        /**
+         * ChatToolChoice2
+         * @enum {string}
+         */
+        OpenRouterChatToolChoice2: "required";
+        /** ChatNamedToolChoiceFunction */
+        OpenRouterChatNamedToolChoiceFunction: {
+            /** @description Function name to call */
+            name: string;
+        };
+        /**
+         * ChatNamedToolChoiceType
+         * @enum {string}
+         */
+        OpenRouterChatNamedToolChoiceType: "function";
+        /**
+         * ChatNamedToolChoice
+         * @description Named tool choice for specific function
+         */
+        OpenRouterChatNamedToolChoice: {
+            function: components["schemas"]["OpenRouterChatNamedToolChoiceFunction"];
+            type: components["schemas"]["OpenRouterChatNamedToolChoiceType"];
+        };
+        /**
+         * ChatToolChoice
+         * @description Tool choice configuration
+         */
+        OpenRouterChatToolChoice: components["schemas"]["OpenRouterChatToolChoice0"] | components["schemas"]["OpenRouterChatToolChoice1"] | components["schemas"]["OpenRouterChatToolChoice2"] | components["schemas"]["OpenRouterChatNamedToolChoice"];
+        /**
+         * ChatFunctionToolOneOf0Function
+         * @description Function definition for tool calling
+         */
+        OpenRouterChatFunctionToolOneOf0Function: {
+            /** @description Function description for the model */
+            description?: string;
+            /** @description Function name (a-z, A-Z, 0-9, underscores, dashes, max 64 chars) */
+            name: string;
+            /** @description Function parameters as JSON Schema object */
+            parameters?: {
+                [key: string]: unknown;
+            };
+            /** @description Enable strict schema adherence */
+            strict?: boolean | null;
+        };
+        /**
+         * ChatFunctionToolOneOf0Type
+         * @enum {string}
+         */
+        OpenRouterChatFunctionToolOneOf0Type: "function";
+        /** ChatFunctionTool0 */
+        OpenRouterChatFunctionTool0: {
+            cache_control?: components["schemas"]["OpenRouterChatContentCacheControl"];
+            /** @description Function definition for tool calling */
+            function: components["schemas"]["OpenRouterChatFunctionToolOneOf0Function"];
+            type: components["schemas"]["OpenRouterChatFunctionToolOneOf0Type"];
+        };
+        /**
+         * DatetimeServerToolConfig
+         * @description Configuration for the openrouter:datetime server tool
+         */
+        OpenRouterDatetimeServerToolConfig: {
+            /** @description IANA timezone name (e.g. "America/New_York"). Defaults to UTC. */
+            timezone?: string;
+        };
+        /**
+         * DatetimeServerToolType
+         * @enum {string}
+         */
+        OpenRouterDatetimeServerToolType: "openrouter:datetime";
+        /**
+         * DatetimeServerTool
+         * @description OpenRouter built-in server tool: returns the current date and time
+         */
+        OpenRouterDatetimeServerTool: {
+            parameters?: components["schemas"]["OpenRouterDatetimeServerToolConfig"];
+            type: components["schemas"]["OpenRouterDatetimeServerToolType"];
+        };
+        /**
+         * ImageGenerationServerToolConfig
+         * @description Configuration for the openrouter:image_generation server tool. Accepts all image_config params (aspect_ratio, quality, size, background, output_format, output_compression, moderation, etc.) plus a model field.
+         */
+        OpenRouterImageGenerationServerToolConfig: {
+            /** @description Which image generation model to use (e.g. "openai/gpt-5-image"). Defaults to "openai/gpt-5-image". */
+            model?: string;
+        };
+        /**
+         * ImageGenerationServerToolOpenRouterType
+         * @enum {string}
+         */
+        OpenRouterImageGenerationServerToolOpenRouterType: "openrouter:image_generation";
+        /**
+         * ImageGenerationServerTool_OpenRouter
+         * @description OpenRouter built-in server tool: generates images from text prompts using an image generation model
+         */
+        ImageGenerationServerTool_OpenRouter: {
+            parameters?: components["schemas"]["OpenRouterImageGenerationServerToolConfig"];
+            type: components["schemas"]["OpenRouterImageGenerationServerToolOpenRouterType"];
+        };
+        /**
+         * SearchModelsServerToolConfig
+         * @description Configuration for the openrouter:experimental__search_models server tool
+         */
+        OpenRouterSearchModelsServerToolConfig: {
+            /** @description Maximum number of models to return. Defaults to 5, max 20. */
+            max_results?: number;
+        };
+        /**
+         * ChatSearchModelsServerToolType
+         * @enum {string}
+         */
+        OpenRouterChatSearchModelsServerToolType: "openrouter:experimental__search_models";
+        /**
+         * ChatSearchModelsServerTool
+         * @description OpenRouter built-in server tool: searches and filters AI models available on OpenRouter
+         */
+        OpenRouterChatSearchModelsServerTool: {
+            parameters?: components["schemas"]["OpenRouterSearchModelsServerToolConfig"];
+            type: components["schemas"]["OpenRouterChatSearchModelsServerToolType"];
+        };
+        /**
+         * WebFetchEngineEnum
+         * @description Which fetch engine to use. "auto" (default) uses native if the provider supports it, otherwise Exa. "native" forces the provider's built-in fetch. "exa" uses Exa Contents API. "openrouter" uses direct HTTP fetch. "firecrawl" uses Firecrawl scrape (requires BYOK).
+         * @enum {string}
+         */
+        OpenRouterWebFetchEngineEnum: "auto" | "native" | "openrouter" | "firecrawl" | "exa";
+        /**
+         * WebFetchServerToolConfig
+         * @description Configuration for the openrouter:web_fetch server tool
+         */
+        OpenRouterWebFetchServerToolConfig: {
+            /** @description Only fetch from these domains. */
+            allowed_domains?: string[];
+            /** @description Never fetch from these domains. */
+            blocked_domains?: string[];
+            engine?: components["schemas"]["OpenRouterWebFetchEngineEnum"];
+            /** @description Maximum content length in approximate tokens. Content exceeding this limit is truncated. */
+            max_content_tokens?: number;
+            /** @description Maximum number of web fetches per request. Once exceeded, the tool returns an error. */
+            max_uses?: number;
+        };
+        /**
+         * WebFetchServerToolType
+         * @enum {string}
+         */
+        OpenRouterWebFetchServerToolType: "openrouter:web_fetch";
+        /**
+         * WebFetchServerTool
+         * @description OpenRouter built-in server tool: fetches full content from a URL (web page or PDF)
+         */
+        OpenRouterWebFetchServerTool: {
+            parameters?: components["schemas"]["OpenRouterWebFetchServerToolConfig"];
+            type: components["schemas"]["OpenRouterWebFetchServerToolType"];
+        };
+        /**
+         * WebSearchEngineEnum
+         * @description Which search engine to use. "auto" (default) uses native if the provider supports it, otherwise Exa. "native" forces the provider's built-in search. "exa" forces the Exa search API. "firecrawl" uses Firecrawl (requires BYOK). "parallel" uses the Parallel search API.
+         * @enum {string}
+         */
+        OpenRouterWebSearchEngineEnum: "auto" | "native" | "exa" | "firecrawl" | "parallel";
+        /**
+         * SearchQualityLevel
+         * @description How much context to retrieve per result. Applies to Exa and Parallel engines; ignored with native provider search and Firecrawl. For Exa, pins a fixed per-result character cap (low=5,000, medium=15,000, high=30,000); when omitted, Exa picks an adaptive size per query and document (typically ~2,000–4,000 characters per result). For Parallel, controls the total characters across all results; when omitted, Parallel uses its own default size.
+         * @enum {string}
+         */
+        OpenRouterSearchQualityLevel: "low" | "medium" | "high";
+        /**
+         * WebSearchUserLocationServerToolType
+         * @enum {string}
+         */
+        OpenRouterWebSearchUserLocationServerToolType: "approximate";
+        /**
+         * WebSearchUserLocationServerTool
+         * @description Approximate user location for location-biased results.
+         */
+        OpenRouterWebSearchUserLocationServerTool: {
+            city?: string | null;
+            country?: string | null;
+            region?: string | null;
+            timezone?: string | null;
+            type?: components["schemas"]["OpenRouterWebSearchUserLocationServerToolType"];
+        };
+        /** WebSearchConfig */
+        OpenRouterWebSearchConfig: {
+            /** @description Limit search results to these domains. Supported by Exa, Firecrawl, Parallel, and most native providers (Anthropic, OpenAI, xAI). Not supported with Perplexity. Cannot be used with excluded_domains. */
+            allowed_domains?: string[];
+            engine?: components["schemas"]["OpenRouterWebSearchEngineEnum"];
+            /** @description Exclude search results from these domains. Supported by Exa, Firecrawl, Parallel, Anthropic, and xAI. Not supported with OpenAI (silently ignored) or Perplexity. Cannot be used with allowed_domains. */
+            excluded_domains?: string[];
+            /** @description Maximum number of search results to return per search call. Defaults to 5. Applies to Exa, Firecrawl, and Parallel engines; ignored with native provider search. */
+            max_results?: number;
+            /** @description Maximum total number of search results across all search calls in a single request. Once this limit is reached, the tool will stop returning new results. Useful for controlling cost and context size in agentic loops. Defaults to 50 when not specified. */
+            max_total_results?: number;
+            search_context_size?: components["schemas"]["OpenRouterSearchQualityLevel"];
+            user_location?: components["schemas"]["OpenRouterWebSearchUserLocationServerTool"];
+        };
+        /**
+         * OpenRouterWebSearchServerToolType
+         * @enum {string}
+         */
+        OpenRouterWebSearchServerToolType: "openrouter:web_search";
+        /**
+         * OpenRouterWebSearchServerTool
+         * @description OpenRouter built-in server tool: searches the web for current information
+         */
+        OpenRouterWebSearchServerTool: {
+            parameters?: components["schemas"]["OpenRouterWebSearchConfig"];
+            type: components["schemas"]["OpenRouterWebSearchServerToolType"];
+        };
+        /**
+         * ChatWebSearchShorthandType
+         * @enum {string}
+         */
+        OpenRouterChatWebSearchShorthandType: "web_search" | "web_search_preview" | "web_search_preview_2025_03_11" | "web_search_2025_08_26";
+        /**
+         * ChatWebSearchShorthand
+         * @description Web search tool using OpenAI Responses API syntax. Automatically converted to openrouter:web_search.
+         */
+        OpenRouterChatWebSearchShorthand: {
+            /** @description Limit search results to these domains. Supported by Exa, Firecrawl, Parallel, and most native providers (Anthropic, OpenAI, xAI). Not supported with Perplexity. Cannot be used with excluded_domains. */
+            allowed_domains?: string[];
+            engine?: components["schemas"]["OpenRouterWebSearchEngineEnum"];
+            /** @description Exclude search results from these domains. Supported by Exa, Firecrawl, Parallel, Anthropic, and xAI. Not supported with OpenAI (silently ignored) or Perplexity. Cannot be used with allowed_domains. */
+            excluded_domains?: string[];
+            /** @description Maximum number of search results to return per search call. Defaults to 5. Applies to Exa, Firecrawl, and Parallel engines; ignored with native provider search. */
+            max_results?: number;
+            /** @description Maximum total number of search results across all search calls in a single request. Once this limit is reached, the tool will stop returning new results. Useful for controlling cost and context size in agentic loops. Defaults to 50 when not specified. */
+            max_total_results?: number;
+            parameters?: components["schemas"]["OpenRouterWebSearchConfig"];
+            search_context_size?: components["schemas"]["OpenRouterSearchQualityLevel"];
+            type: components["schemas"]["OpenRouterChatWebSearchShorthandType"];
+            user_location?: components["schemas"]["OpenRouterWebSearchUserLocationServerTool"];
+        };
+        /**
+         * ChatFunctionTool
+         * @description Tool definition for function calling (regular function or OpenRouter built-in server tool)
+         */
+        OpenRouterChatFunctionTool: components["schemas"]["OpenRouterChatFunctionTool0"] | components["schemas"]["OpenRouterDatetimeServerTool"] | components["schemas"]["ImageGenerationServerTool_OpenRouter"] | components["schemas"]["OpenRouterChatSearchModelsServerTool"] | components["schemas"]["OpenRouterWebFetchServerTool"] | components["schemas"]["OpenRouterWebSearchServerTool"] | components["schemas"]["OpenRouterChatWebSearchShorthand"];
+        /**
+         * TraceConfig
+         * @description Metadata for observability and tracing. Known keys (trace_id, trace_name, span_name, generation_name, parent_span_id) have special handling. Additional keys are passed through as custom metadata to configured broadcast destinations.
+         */
+        OpenRouterTraceConfig: {
+            generation_name?: string;
+            parent_span_id?: string;
+            span_name?: string;
+            trace_id?: string;
+            trace_name?: string;
+        };
+        /**
+         * ChatRequest
+         * @description Chat completion request parameters
+         */
+        OpenRouterChatRequest: {
+            cache_control?: components["schemas"]["OpenRouterAnthropicCacheControlDirective"];
+            debug?: components["schemas"]["OpenRouterChatDebugOptions"];
+            /**
+             * Format: double
+             * @description Frequency penalty (-2.0 to 2.0)
+             */
+            frequency_penalty?: number | null;
+            image_config?: components["schemas"]["OpenRouterImageConfig"];
+            /** @description Token logit bias adjustments */
+            logit_bias?: {
+                [key: string]: number;
+            } | null;
+            /** @description Return log probabilities */
+            logprobs?: boolean | null;
+            /** @description Maximum tokens in completion */
+            max_completion_tokens?: number | null;
+            /** @description Maximum tokens (deprecated, use max_completion_tokens). Note: some providers enforce a minimum of 16. */
+            max_tokens?: number | null;
+            /** @description List of messages for the conversation */
+            messages: components["schemas"]["OpenRouterChatMessages"][];
+            /** @description Key-value pairs for additional object information (max 16 pairs, 64 char keys, 512 char values) */
+            metadata?: {
+                [key: string]: string;
+            };
+            /** @description Output modalities for the response. Supported values are "text", "image", and "audio". */
+            modalities?: components["schemas"]["OpenRouterChatRequestModalitiesItems"][];
+            model?: components["schemas"]["OpenRouterModelName"];
+            models?: components["schemas"]["OpenRouterChatModelNames"];
+            /** @description Whether to enable parallel function calling during tool use. When true, the model may generate multiple tool calls in a single response. */
+            parallel_tool_calls?: boolean | null;
+            /** @description Plugins you want to enable for this request, including their settings. */
+            plugins?: components["schemas"]["OpenRouterChatRequestPluginsItems"][];
+            /**
+             * Format: double
+             * @description Presence penalty (-2.0 to 2.0)
+             */
+            presence_penalty?: number | null;
+            provider?: components["schemas"]["OpenRouterProviderPreferences"];
+            /** @description Configuration options for reasoning models */
+            reasoning?: components["schemas"]["OpenRouterChatRequestReasoning"];
+            /** @description Response format configuration */
+            response_format?: components["schemas"]["OpenRouterChatRequestResponseFormat"];
+            /** @description Any type */
+            route?: unknown;
+            /** @description Random seed for deterministic outputs */
+            seed?: number | null;
+            /** @description The service tier to use for processing this request. */
+            service_tier?: components["schemas"]["OpenRouterChatRequestServiceTier"];
+            /** @description A unique identifier for grouping related requests (e.g., a conversation or agent workflow) for observability. If provided in both the request body and the x-session-id header, the body value takes precedence. Maximum of 256 characters. */
+            session_id?: string;
+            /** @description Stop sequences (up to 4) */
+            stop?: components["schemas"]["OpenRouterChatRequestStop"];
+            stop_server_tools_when?: components["schemas"]["OpenRouterStopServerToolsWhen"];
+            /**
+             * @description Enable streaming response
+             * @default false
+             */
+            stream: boolean;
+            stream_options?: components["schemas"]["OpenRouterChatStreamOptions"];
+            /**
+             * Format: double
+             * @description Sampling temperature (0-2)
+             */
+            temperature?: number | null;
+            tool_choice?: components["schemas"]["OpenRouterChatToolChoice"];
+            /** @description Available tools for function calling */
+            tools?: components["schemas"]["OpenRouterChatFunctionTool"][];
+            /** @description Number of top log probabilities to return (0-20) */
+            top_logprobs?: number | null;
+            /**
+             * Format: double
+             * @description Nucleus sampling parameter (0-1)
+             */
+            top_p?: number | null;
+            trace?: components["schemas"]["OpenRouterTraceConfig"];
+            /** @description Unique user identifier */
+            user?: string;
+        };
+        /**
+         * ChatFinishReasonEnum
+         * @enum {string}
+         */
+        OpenRouterChatFinishReasonEnum: "tool_calls" | "stop" | "length" | "content_filter" | "error";
+        /** ChatTokenLogprobTopLogprobsItems */
+        OpenRouterChatTokenLogprobTopLogprobsItems: {
+            bytes: number[] | null;
+            /** Format: double */
+            logprob: number;
+            token: string;
+        };
+        /**
+         * ChatTokenLogprob
+         * @description Token log probability information
+         */
+        OpenRouterChatTokenLogprob: {
+            /** @description UTF-8 bytes of the token */
+            bytes: number[] | null;
+            /**
+             * Format: double
+             * @description Log probability of the token
+             */
+            logprob: number;
+            /** @description The token */
+            token: string;
+            /** @description Top alternative tokens with probabilities */
+            top_logprobs: components["schemas"]["OpenRouterChatTokenLogprobTopLogprobsItems"][];
+        };
+        /**
+         * ChatTokenLogprobs
+         * @description Log probabilities for the completion
+         */
+        OpenRouterChatTokenLogprobs: {
+            /** @description Log probabilities for content tokens */
+            content: components["schemas"]["OpenRouterChatTokenLogprob"][] | null;
+            /** @description Log probabilities for refusal tokens */
+            refusal?: components["schemas"]["OpenRouterChatTokenLogprob"][] | null;
+        };
+        /**
+         * ChatAssistantMessage
+         * @description Assistant message for requests and responses
+         */
+        OpenRouterChatAssistantMessage: {
+            audio?: components["schemas"]["OpenRouterChatAudioOutput"];
+            /** @description Assistant message content */
+            content?: components["schemas"]["OpenRouterChatMessagesDiscriminatorMappingAssistantContent"];
+            images?: components["schemas"]["OpenRouterChatAssistantImages"];
+            /** @description Optional name for the assistant */
+            name?: string;
+            /** @description Reasoning output */
+            reasoning?: string | null;
+            reasoning_details?: components["schemas"]["OpenRouterChatReasoningDetails"];
+            /** @description Refusal message if content was refused */
+            refusal?: string | null;
+            /** @description Tool calls made by the assistant */
+            tool_calls?: components["schemas"]["OpenRouterChatToolCall"][];
+        };
+        /**
+         * ChatChoice
+         * @description Chat completion choice
+         */
+        OpenRouterChatChoice: {
+            finish_reason: components["schemas"]["OpenRouterChatFinishReasonEnum"];
+            /** @description Choice index */
+            index: number;
+            logprobs?: components["schemas"]["OpenRouterChatTokenLogprobs"];
+            message: components["schemas"]["OpenRouterChatAssistantMessage"];
+        };
+        /**
+         * ChatResultObject
+         * @enum {string}
+         */
+        OpenRouterChatResultObject: "chat.completion";
+        /** RouterAttempt */
+        OpenRouterRouterAttempt: {
+            model: string;
+            provider: string;
+            status: number;
+        };
+        /** EndpointInfo */
+        OpenRouterEndpointInfo: {
+            model: string;
+            provider: string;
+            selected: boolean;
+        };
+        /** EndpointsMetadata */
+        OpenRouterEndpointsMetadata: {
+            available: components["schemas"]["OpenRouterEndpointInfo"][];
+            total: number;
+        };
+        /** RouterParams */
+        OpenRouterRouterParams: {
+            /** Format: double */
+            quality_floor?: number;
+            /** Format: double */
+            throughput_floor?: number;
+            version_group?: string;
+        };
+        /**
+         * PipelineStageType
+         * @description Categorical kind of a pipeline stage. Multiple plugins can share a type (e.g. all guardrail-level plugins emit `guardrail`); the `name` field disambiguates which plugin emitted it.
+         * @enum {string}
+         */
+        OpenRouterPipelineStageType: "guardrail" | "plugin" | "server_tools" | "response_healing" | "context_compression";
+        /** PipelineStage */
+        OpenRouterPipelineStage: {
+            /** Format: double */
+            cost_usd?: number | null;
+            data?: {
+                [key: string]: unknown;
+            };
+            guardrail_id?: string;
+            guardrail_scope?: string;
+            name: string;
+            summary?: string;
+            type: components["schemas"]["OpenRouterPipelineStageType"];
+        };
+        /**
+         * RoutingStrategy
+         * @enum {string}
+         */
+        OpenRouterRoutingStrategy: "direct" | "auto" | "free" | "latest" | "alias" | "fallback" | "pareto" | "bodybuilder" | "fusion";
+        /** OpenRouterMetadata */
+        OpenRouterMetadata: {
+            attempt: number;
+            attempts?: components["schemas"]["OpenRouterRouterAttempt"][];
+            endpoints: components["schemas"]["OpenRouterEndpointsMetadata"];
+            is_byok: boolean;
+            params?: components["schemas"]["OpenRouterRouterParams"];
+            pipeline?: components["schemas"]["OpenRouterPipelineStage"][];
+            region: string | null;
+            requested: string;
+            strategy: components["schemas"]["OpenRouterRoutingStrategy"];
+            summary: string;
+        };
+        /**
+         * ChatUsageCompletionTokensDetails
+         * @description Detailed completion token usage
+         */
+        OpenRouterChatUsageCompletionTokensDetails: {
+            /** @description Accepted prediction tokens */
+            accepted_prediction_tokens?: number | null;
+            /** @description Tokens used for audio output */
+            audio_tokens?: number | null;
+            /** @description Tokens used for reasoning */
+            reasoning_tokens?: number | null;
+            /** @description Rejected prediction tokens */
+            rejected_prediction_tokens?: number | null;
+        };
+        /**
+         * CostDetails
+         * @description Breakdown of upstream inference costs
+         */
+        OpenRouterCostDetails: {
+            /** Format: double */
+            upstream_inference_completions_cost: number;
+            /** Format: double */
+            upstream_inference_cost?: number | null;
+            /** Format: double */
+            upstream_inference_prompt_cost: number;
+        };
+        /**
+         * ChatUsagePromptTokensDetails
+         * @description Detailed prompt token usage
+         */
+        OpenRouterChatUsagePromptTokensDetails: {
+            /** @description Audio input tokens */
+            audio_tokens?: number;
+            /** @description Tokens written to cache. Only returned for models with explicit caching and cache write pricing. */
+            cache_write_tokens?: number;
+            /** @description Cached prompt tokens */
+            cached_tokens?: number;
+            /** @description Video input tokens */
+            video_tokens?: number;
+        };
+        /**
+         * ChatUsage
+         * @description Token usage statistics
+         */
+        OpenRouterChatUsage: {
+            /** @description Number of tokens in the completion */
+            completion_tokens: number;
+            /** @description Detailed completion token usage */
+            completion_tokens_details?: components["schemas"]["OpenRouterChatUsageCompletionTokensDetails"];
+            /**
+             * Format: double
+             * @description Cost of the completion
+             */
+            cost?: number | null;
+            cost_details?: components["schemas"]["OpenRouterCostDetails"];
+            /** @description Whether a request was made using a Bring Your Own Key configuration */
+            is_byok?: boolean;
+            /** @description Number of tokens in the prompt */
+            prompt_tokens: number;
+            /** @description Detailed prompt token usage */
+            prompt_tokens_details?: components["schemas"]["OpenRouterChatUsagePromptTokensDetails"];
+            /** @description Total number of tokens */
+            total_tokens: number;
+        };
+        /**
+         * ChatResult
+         * @description Chat completion response
+         */
+        OpenRouterChatResult: {
+            /** @description List of completion choices */
+            choices: components["schemas"]["OpenRouterChatChoice"][];
+            /** @description Unix timestamp of creation */
+            created: number;
+            /** @description Unique completion identifier */
+            id: string;
+            /** @description Model used for completion */
+            model: string;
+            object: components["schemas"]["OpenRouterChatResultObject"];
+            openrouter_metadata?: components["schemas"]["OpenRouterMetadata"];
+            /** @description The service tier used by the upstream provider for this request */
+            service_tier?: string | null;
+            /** @description System fingerprint */
+            system_fingerprint: string | null;
+            usage?: components["schemas"]["OpenRouterChatUsage"];
+        };
+        /**
+         * BadRequestResponseErrorData
+         * @description Error data for BadRequestResponse
+         */
+        OpenRouterBadRequestResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * BadRequestResponse
+         * @description Bad Request - Invalid request parameters or malformed input
+         */
+        OpenRouterBadRequestResponse: {
+            error: components["schemas"]["OpenRouterBadRequestResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * UnauthorizedResponseErrorData
+         * @description Error data for UnauthorizedResponse
+         */
+        OpenRouterUnauthorizedResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * UnauthorizedResponse
+         * @description Unauthorized - Authentication required or invalid credentials
+         */
+        OpenRouterUnauthorizedResponse: {
+            error: components["schemas"]["OpenRouterUnauthorizedResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * PaymentRequiredResponseErrorData
+         * @description Error data for PaymentRequiredResponse
+         */
+        OpenRouterPaymentRequiredResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * PaymentRequiredResponse
+         * @description Payment Required - Insufficient credits or quota to complete request
+         */
+        OpenRouterPaymentRequiredResponse: {
+            error: components["schemas"]["OpenRouterPaymentRequiredResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * ForbiddenResponseErrorData
+         * @description Error data for ForbiddenResponse
+         */
+        OpenRouterForbiddenResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * ForbiddenResponse
+         * @description Forbidden - Authentication successful but insufficient permissions
+         */
+        OpenRouterForbiddenResponse: {
+            error: components["schemas"]["OpenRouterForbiddenResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * NotFoundResponseErrorData
+         * @description Error data for NotFoundResponse
+         */
+        OpenRouterNotFoundResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * NotFoundResponse
+         * @description Not Found - Resource does not exist
+         */
+        OpenRouterNotFoundResponse: {
+            error: components["schemas"]["OpenRouterNotFoundResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * RequestTimeoutResponseErrorData
+         * @description Error data for RequestTimeoutResponse
+         */
+        OpenRouterRequestTimeoutResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * RequestTimeoutResponse
+         * @description Request Timeout - Operation exceeded time limit
+         */
+        OpenRouterRequestTimeoutResponse: {
+            error: components["schemas"]["OpenRouterRequestTimeoutResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * PayloadTooLargeResponseErrorData
+         * @description Error data for PayloadTooLargeResponse
+         */
+        OpenRouterPayloadTooLargeResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * PayloadTooLargeResponse
+         * @description Payload Too Large - Request payload exceeds size limits
+         */
+        OpenRouterPayloadTooLargeResponse: {
+            error: components["schemas"]["OpenRouterPayloadTooLargeResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * UnprocessableEntityResponseErrorData
+         * @description Error data for UnprocessableEntityResponse
+         */
+        OpenRouterUnprocessableEntityResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * UnprocessableEntityResponse
+         * @description Unprocessable Entity - Semantic validation failure
+         */
+        OpenRouterUnprocessableEntityResponse: {
+            error: components["schemas"]["OpenRouterUnprocessableEntityResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * TooManyRequestsResponseErrorData
+         * @description Error data for TooManyRequestsResponse
+         */
+        OpenRouterTooManyRequestsResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * TooManyRequestsResponse
+         * @description Too Many Requests - Rate limit exceeded
+         */
+        OpenRouterTooManyRequestsResponse: {
+            error: components["schemas"]["OpenRouterTooManyRequestsResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * InternalServerResponseErrorData
+         * @description Error data for InternalServerResponse
+         */
+        OpenRouterInternalServerResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * InternalServerResponse
+         * @description Internal Server Error - Unexpected server error
+         */
+        OpenRouterInternalServerResponse: {
+            error: components["schemas"]["OpenRouterInternalServerResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * BadGatewayResponseErrorData
+         * @description Error data for BadGatewayResponse
+         */
+        OpenRouterBadGatewayResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * BadGatewayResponse
+         * @description Bad Gateway - Provider/upstream API failure
+         */
+        OpenRouterBadGatewayResponse: {
+            error: components["schemas"]["OpenRouterBadGatewayResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
+        /**
+         * ServiceUnavailableResponseErrorData
+         * @description Error data for ServiceUnavailableResponse
+         */
+        OpenRouterServiceUnavailableResponseErrorData: {
+            code: number;
+            message: string;
+            metadata?: {
+                [key: string]: unknown;
+            } | null;
+        };
+        /**
+         * ServiceUnavailableResponse
+         * @description Service Unavailable - Service temporarily unavailable
+         */
+        OpenRouterServiceUnavailableResponse: {
+            error: components["schemas"]["OpenRouterServiceUnavailableResponseErrorData"];
+            openrouter_metadata?: {
+                [key: string]: unknown;
+            } | null;
+            user_id?: string | null;
+        };
         /** @description A postprocessing operation to apply after image generation. */
         RevePostprocessingOperation: {
             /**
@@ -16813,6 +20200,187 @@ export interface components {
             /** @description Indicates whether the generated image violates the content policy. */
             content_violation?: boolean;
         };
+        KreaGenerateImageRequest: {
+            prompt: string;
+            /**
+             * @description Aspect ratio. One of: 1:1, 4:3, 3:2, 16:9, 2.35:1, 4:5, 2:3, 9:16.
+             * @enum {string}
+             */
+            aspect_ratio: "1:1" | "4:3" | "3:2" | "16:9" | "2.35:1" | "4:5" | "2:3" | "9:16";
+            /**
+             * @description Resolution scale. One of: 1K.
+             * @enum {string}
+             */
+            resolution: "1K";
+            seed?: number | null;
+            /** @description Styles (typically LoRAs) to use for the generation */
+            styles?: components["schemas"]["KreaStyle"][];
+            /**
+             * @description Prompt interpretation strength: raw=0, low=10, medium=50, high=100.
+             * @default medium
+             * @enum {string}
+             */
+            creativity: "raw" | "low" | "medium" | "high";
+            /** @description Moodboards to use for generation. Currently limited to one moodboard. */
+            moodboards?: components["schemas"]["KreaMoodboard"][];
+            /** @description Style references to use for the generation */
+            image_style_references?: components["schemas"]["KreaImageStyleReference"][];
+        };
+        KreaStyle: {
+            id: string;
+            /** Format: double */
+            strength: number;
+        };
+        KreaMoodboard: {
+            /** Format: uuid */
+            id: string;
+            /**
+             * Format: double
+             * @default 0.35
+             */
+            strength: number;
+        };
+        KreaImageStyleReference: {
+            /** Format: double */
+            strength: number;
+            /** Format: uri */
+            url?: string;
+        };
+        KreaJob: {
+            /** Format: uuid */
+            job_id: string;
+            /**
+             * @description Available options: backlogged, queued, scheduled, processing, sampling, intermediate-complete, completed, failed, cancelled
+             * @enum {string}
+             */
+            status: "backlogged" | "queued" | "scheduled" | "processing" | "sampling" | "intermediate-complete" | "completed" | "failed" | "cancelled";
+            /** Format: date-time */
+            created_at: string;
+            /** Format: date-time */
+            completed_at: string | null;
+            result: components["schemas"]["KreaJobResult"] | null;
+        };
+        KreaJobResult: {
+            urls?: string[];
+            style_id?: string;
+        };
+        KreaAssetUploadRequest: {
+            /**
+             * Format: binary
+             * @description The file to upload (JPEG, PNG, WebP, HEIC, MP4, MOV, WebM, GLB, WAV, MP3). Maximum size: 75MB.
+             */
+            file: string;
+            /** @description Optional description for the asset */
+            description?: string;
+        };
+        KreaAsset: {
+            /** Format: uuid */
+            id: string;
+            /** Format: uri */
+            image_url: string;
+            /** Format: date-time */
+            uploaded_at: string;
+            width?: number | null;
+            height?: number | null;
+            size_bytes?: number | null;
+            mime_type?: string | null;
+            description?: string;
+            metadata?: {
+                [key: string]: unknown;
+            };
+        };
+        /** @description Request to create and start a SwitchX generation job. */
+        BeebleCreateSwitchXRequest: {
+            generation_type: components["schemas"]["BeebleGenerationType"];
+            /** @description URI of the source image or video. Accepts beeble://uploads/{id}/{filename}, https URLs, or data:{mime};base64 URIs (max 50 MB). */
+            source_uri: string;
+            /** @description Text description of desired output (max 2,000 chars). At least one of prompt or reference_image_uri is required. */
+            prompt?: string | null;
+            /** @description URI of the reference image for style transfer. Accepts the same URI types as source_uri. */
+            reference_image_uri?: string | null;
+            alpha_mode: components["schemas"]["BeebleAlphaMode"];
+            /** @description URI of a custom alpha matte. Required when alpha_mode is custom or select. Ignored for auto or fill. */
+            alpha_uri?: string | null;
+            /**
+             * @description Maximum output resolution: 720 or 1080 (default: 1080).
+             * @default 1080
+             */
+            max_resolution: number | null;
+            /** @description HTTPS URL for webhook notification on completion or failure. */
+            callback_url?: string | null;
+            /** @description Idempotency key for safe retries. If a job with the same key already exists for your account, the API returns the existing job's status instead of creating a duplicate. */
+            idempotency_key?: string | null;
+        };
+        /**
+         * @description Output type: image or video
+         * @enum {string}
+         */
+        BeebleGenerationType: "image" | "video";
+        /**
+         * @description Alpha mode: auto, fill, custom, or select
+         * @enum {string}
+         */
+        BeebleAlphaMode: "auto" | "fill" | "custom" | "select";
+        /** @description Status response for a SwitchX job. */
+        BeebleSwitchXStatusResponse: {
+            /** @description Job identifier (swx_...) */
+            id: string;
+            /**
+             * @description Current job status.
+             * @enum {string}
+             */
+            status: "in_queue" | "processing" | "completed" | "failed";
+            /** @description Progress percentage (0-100). */
+            progress?: number | null;
+            /** @description image or video */
+            generation_type?: string | null;
+            /** @description auto, fill, custom, or select */
+            alpha_mode?: string | null;
+            /** @description Output URLs (present when status is completed). URLs are signed and expire after 72 hours; re-fetch this endpoint for fresh URLs. */
+            output?: components["schemas"]["BeebleSwitchXOutputUrls"] | null;
+            /** @description Error message (present when status is failed). */
+            error?: string | null;
+            /** @description ISO 8601 timestamp when the job was created. */
+            created_at?: string | null;
+            /** @description ISO 8601 timestamp of the last status change. */
+            modified_at?: string | null;
+            /** @description ISO 8601 timestamp when the job completed or failed. */
+            completed_at?: string | null;
+            /** @description Webhook delivery status (present only when callback_url was provided). */
+            webhook?: components["schemas"]["BeebleWebhookStatus"] | null;
+        };
+        /** @description Signed URLs for SwitchX job outputs. */
+        BeebleSwitchXOutputUrls: {
+            /** @description Composited output URL. */
+            render?: string | null;
+            /** @description Preprocessed source URL. */
+            source?: string | null;
+            /** @description Alpha matte URL. */
+            alpha?: string | null;
+        };
+        /** @description Webhook delivery status for a SwitchX job. */
+        BeebleWebhookStatus: {
+            /** @description pending, delivered, or failed */
+            status?: string | null;
+            /** @description Number of delivery attempts so far. */
+            attempts?: number | null;
+            /** @description Error message from the last failed delivery attempt. */
+            last_error?: string | null;
+        };
+        /** @description Request to create a presigned upload URL. */
+        BeebleUploadRequest: {
+            /** @description Filename with extension. Accepted: .mp4, .mov, .png, .jpg, .jpeg, .webp */
+            filename: string;
+        };
+        /** @description Response with presigned upload URL and beeble:// URI. */
+        BeebleUploadResponse: {
+            /** @description Upload ID (upload_...) */
+            id: string;
+            /** @description Presigned PUT URL for uploading your file. Expires after 1 hour. */
+            upload_url: string;
+            /** @description beeble:// URI to reference this file in SwitchX generation calls (source_uri, reference_image_uri, or alpha_uri). */
+            beeble_uri: string;
+        };
         /** @description Request body for Bria FIBO Edit API */
         BriaFiboEditRequest: {
             /** @description Text-based edit instruction (e.g., "make the sky blue", "add a cat"). Either instruction or structured_instruction must be provided. */
@@ -16964,6 +20532,37 @@ export interface components {
             /** @description Whether to preserve audio from the input video. */
             preserve_audio?: boolean;
         };
+        /** @description Request body for Bria Video Green Screen API */
+        BriaVideoGreenScreenRequest: {
+            /** @description Publicly accessible URL of the input video. Input resolution supported up to 16000x16000 (16K). Max duration 60 seconds. */
+            video: string;
+            /**
+             * @description The solid background shade applied behind the foreground for chroma keying. Defaults to broadcast_green.
+             * @enum {string}
+             */
+            green_shade?: "broadcast_green" | "chroma_green" | "blue_screen";
+            /**
+             * @description Output container and codec preset.
+             * @enum {string}
+             */
+            output_container_and_codec?: "mp4_h264" | "mp4_h265" | "webm_vp9" | "mov_h265" | "mov_proresks" | "mkv_h264" | "mkv_h265" | "mkv_vp9" | "gif";
+            /** @description Whether to preserve audio from the input video. */
+            preserve_audio?: boolean;
+        };
+        /** @description Request body for Bria Video Replace Background API */
+        BriaVideoReplaceBackgroundRequest: {
+            /** @description Publicly accessible URL of the input (foreground) video. Input resolution supported up to 16000x16000 (16K). Max duration 60 seconds. */
+            video: string;
+            /** @description Publicly accessible URL of the background asset (image or video) to composite behind the foreground. Must match the foreground aspect ratio. */
+            background_url: string;
+            /**
+             * @description Output container and codec preset.
+             * @enum {string}
+             */
+            output_container_and_codec?: "mp4_h264" | "mp4_h265" | "webm_vp9" | "mov_h265" | "mov_proresks" | "mkv_h264" | "mkv_h265" | "mkv_vp9" | "gif";
+            /** @description Whether to preserve audio from the input (foreground) video. */
+            preserve_audio?: boolean;
+        };
         /** @description Request body for Bria Image Remove Background API */
         BriaImageRemoveBackgroundRequest: {
             /** @description The image to remove background from. Supported input types are Base64-encoded string or URL pointing to a publicly accessible image file. Accepted formats JPEG, JPG, PNG, WEBP. */
@@ -17086,7 +20685,7 @@ export interface components {
         SoniloVideoToMusicRequest: {
             /**
              * Format: binary
-             * @description Multipart file part; e.g. video/mp4.
+             * @description Multipart file part; e.g. video/mp4. Max file size 300MB.
              */
             video: string;
             /** @description Optional text prompt to guide music generation. */
@@ -17094,19 +20693,19 @@ export interface components {
         } | {
             /**
              * Format: uri
-             * @description Public http(s) URL of the video.
+             * @description Public http:// or https:// URL of the video. Private/internal addresses are rejected.
              */
             video_url: string;
             /** @description Optional text prompt to guide music generation. */
             prompt?: string;
         };
         SoniloTextToMusicRequest: {
-            /** @description Text prompt describing the desired music. */
+            /** @description Text prompt describing the desired music. Max length 1000 characters. */
             prompt: string;
-            /** @description Target duration in seconds. Will be inferred if not provided. */
-            duration?: number;
+            /** @description Desired duration of the output track in seconds. */
+            duration: number;
         };
-        /** @description A single NDJSON event from the Sonilo streaming response. */
+        /** @description A single NDJSON event from the Sonilo streaming response. Additional event types beyond those listed may appear; unknown types should be ignored by clients. */
         SoniloStreamEvent: {
             /** @enum {string} */
             type: "title";
@@ -17114,6 +20713,8 @@ export interface components {
             prompt_index: number;
             copy_index: number;
             title: string;
+            /** @description Short natural-language description of the generated track. */
+            summary?: string;
             display_tags: string[];
         } | {
             /** @enum {string} */
@@ -17124,14 +20725,6 @@ export interface components {
             num_streams: number;
             /** @description Base64-encoded AAC in fMP4 fragments; concatenate per stream_index. */
             data: string;
-        } | {
-            /** @enum {string} */
-            type: "generated_audio";
-            sample_rate: number;
-            channels: number;
-            duration_sec_by_stream: number[];
-            billing_rate_per_sec: number;
-            billing: number;
         } | {
             /** @enum {string} */
             type: "complete";
@@ -17279,7 +20872,11 @@ export interface operations {
             path?: never;
             cookie?: never;
         };
-        requestBody?: never;
+        requestBody?: {
+            content: {
+                "application/json": components["schemas"]["CreateCustomerRequest"];
+            };
+        };
         responses: {
             /** @description Customer already exists */
             200: {
@@ -17720,6 +21317,8 @@ export interface operations {
                     utm_content?: string;
                     /** @description Impact.com click ID for affiliate conversion tracking */
                     im_ref?: string;
+                    /** @description Rewardful referral UUID (window.Rewardful.referral), passed to Stripe as client_reference_id for affiliate conversion tracking */
+                    rewardful_referral?: string;
                 };
             };
         };
@@ -17800,6 +21399,8 @@ export interface operations {
                     utm_content?: string;
                     /** @description Impact.com click ID for affiliate conversion tracking */
                     im_ref?: string;
+                    /** @description Rewardful referral UUID (window.Rewardful.referral), passed to Stripe as client_reference_id for affiliate conversion tracking */
+                    rewardful_referral?: string;
                 };
             };
         };
@@ -17877,6 +21478,7 @@ export interface operations {
                          * @description The date when the subscription is set to end (ISO 8601 format)
                          */
                         end_date?: string | null;
+                        free_tier_grant_state?: components["schemas"]["FreeTierGrantState"] | null;
                     };
                 };
             };
@@ -17913,6 +21515,14 @@ export interface operations {
                 "application/json": {
                     /** @description The ComfyUI API key to verify (e.g., comfy_xxx...) */
                     api_key: string;
+                    /**
+                     * @description When true, the response also includes customer_api_keys: the
+                     *     full set of the customer's API keys (hash + prefix + name +
+                     *     description) so cloud's migrate-on-miss can seed ALL of the
+                     *     customer's keys into workspace_api_keys, not just the one being
+                     *     verified. M2M/admin-only; carries hashes, never plaintext.
+                     */
+                    include_customer_keys?: boolean;
                 };
             };
         };
@@ -17934,6 +21544,26 @@ export interface operations {
                         name?: string;
                         /** @description Whether the customer is an admin */
                         is_admin?: boolean;
+                        /**
+                         * @description The api_keys row's own name (display label). Returned so that
+                         *     cloud's migrate-on-miss path can preserve it on the cached
+                         *     workspace_api_keys row instead of writing a placeholder.
+                         */
+                        key_name?: string;
+                        /**
+                         * @description The api_keys row's own description. Returned so that cloud's
+                         *     migrate-on-miss path can preserve it on the cached
+                         *     workspace_api_keys row instead of writing a placeholder.
+                         */
+                        key_description?: string;
+                        /**
+                         * @description All of the customer's API keys — returned ONLY when the
+                         *     request sets include_customer_keys=true. Lets cloud's
+                         *     migrate-on-miss seed every key into workspace_api_keys (by
+                         *     hash) so the cloud key list matches the customer's full set,
+                         *     not just the one verified. M2M/admin-only; hashes, no plaintext.
+                         */
+                        customer_api_keys?: components["schemas"]["MigrationAPIKey"][];
                     };
                 };
             };
@@ -17973,6 +21603,81 @@ export interface operations {
             };
         };
     };
+    SyncApiKeyDeletion: {
+        parameters: {
+            query?: never;
+            header: {
+                /** @description Admin API secret used to authorize this request */
+                "X-Comfy-Admin-Secret": string;
+            };
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": {
+                    /**
+                     * @description Sync event type; only "delete" is supported.
+                     * @example delete
+                     * @enum {string}
+                     */
+                    event: "delete";
+                    /** @description SHA-256 hex hash of the API key to revoke. */
+                    key_hash: string;
+                    /**
+                     * @description Firebase UID of the key's owner, for mismatch detection. The
+                     *     deletion proceeds by hash regardless (mirrors cloud's inbound
+                     *     RevokeByHash semantics).
+                     */
+                    customer_id: string;
+                };
+            };
+        };
+        responses: {
+            /** @description Delete-sync processed */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": {
+                        /**
+                         * @description revoked when a matching key was deleted; no_op when no key
+                         *     matched the hash (already deleted or never existed).
+                         */
+                        result: string;
+                    };
+                };
+            };
+            /** @description Invalid request (missing fields or unsupported event) */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized or missing admin API secret */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
     GenerateAdminToken: {
         parameters: {
             query?: never;
@@ -18339,6 +22044,60 @@ export interface operations {
             };
         };
     };
+    GetCustomerUsageTimeSeries: {
+        parameters: {
+            query?: {
+                /** @description Dimension to group spend by. Falls back to product name when the chosen key is absent on a line item. */
+                group_by?: "model" | "endpoint" | "product";
+                /** @description Bucket size for the time series. "month" uses monthly invoice line items; "day" and "hour" use invoice breakdowns (provide starting_on/ending_before). */
+                granularity?: "hour" | "day" | "month";
+                /** @description RFC 3339 start of the range (inclusive). Defaults to months before ending_before. */
+                starting_on?: string;
+                /** @description RFC 3339 end of the range (exclusive). Defaults to now. */
+                ending_before?: string;
+                /** @description Lookback window in months, used when starting_on is omitted. */
+                months?: number;
+            };
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody?: never;
+        responses: {
+            /** @description Customer usage time series retrieved successfully */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["CustomerUsageTimeSeries"];
+                };
+            };
+            /** @description Unauthorized or invalid token */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Customer not found */
+            404: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
     GetCustomerBalance: {
         parameters: {
             query?: never;
@@ -22759,6 +26518,90 @@ export interface operations {
             };
         };
     };
+    ideogramV4Generate: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /** @description Parameters for Ideogram 4.0 image generation */
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["IdeogramV4Request"];
+            };
+        };
+        responses: {
+            /** @description Successful response from Ideogram proxy */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["IdeogramGenerateResponse"];
+                };
+            };
+            /** @description Bad Request (invalid input to proxy) */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Rate limit exceeded (either from proxy or Ideogram) */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Internal Server Error (proxy or upstream issue) */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Bad Gateway (error communicating with Ideogram) */
+            502: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Gateway Timeout (Ideogram took too long to respond) */
+            504: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
     klingQueryResourcePackages: {
         parameters: {
             query: {
@@ -23239,6 +27082,216 @@ export interface operations {
             };
         };
     };
+    klingV2CreateVideoFromText: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /** @description Create a Kling 3.0 Turbo text-to-video task */
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["KlingV2Text2VideoRequest"];
+            };
+        };
+        responses: {
+            /** @description Successful response (Request successful) */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingV2CreateTaskResponse"];
+                };
+            };
+            /** @description Invalid request parameters */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Authentication failed */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Unauthorized access to requested resource */
+            403: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Account exception or Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+        };
+    };
+    klingV2CreateVideoFromImage: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        /** @description Create a Kling 3.0 Turbo image-to-video task */
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["KlingV2Image2VideoRequest"];
+            };
+        };
+        responses: {
+            /** @description Successful response (Request successful) */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingV2CreateTaskResponse"];
+                };
+            };
+            /** @description Invalid request parameters */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Authentication failed */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Unauthorized access to requested resource */
+            403: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Account exception or Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+        };
+    };
+    klingV2QueryTask: {
+        parameters: {
+            query?: {
+                /** @description System task IDs to query. Supports batch queries separated by ",". Mutually exclusive with external_task_ids. */
+                task_ids?: string;
+                /** @description Custom task IDs to query. Supports batch queries separated by ",". Mutually exclusive with task_ids. */
+                external_task_ids?: string;
+            };
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody?: never;
+        responses: {
+            /** @description Successful response (Request successful) */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingV2QueryTaskResponse"];
+                };
+            };
+            /** @description Invalid request parameters */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Authentication failed */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Unauthorized access to requested resource */
+            403: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Account exception or Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KlingErrorResponse"];
+                };
+            };
+        };
+    };
     klingVideoExtendQueryTaskList: {
         parameters: {
             query?: {
@@ -26079,6 +30132,172 @@ export interface operations {
             };
         };
     };
+    bflVtoV1Generate: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["BFLVtoV1Request"];
+            };
+        };
+        responses: {
+            /** @description Successful response from BFL Flux Tools VTO v1 proxy */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BFLFluxProGenerateResponse"];
+                };
+            };
+            /** @description Bad Request (invalid input to proxy) */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Rate limit exceeded (either from proxy or BFL) */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Internal Server Error (proxy or upstream issue) */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Bad Gateway (error communicating with BFL) */
+            502: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Gateway Timeout (BFL took too long to respond) */
+            504: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    bflEraseV1Generate: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["BFLEraseV1Request"];
+            };
+        };
+        responses: {
+            /** @description Successful response from BFL Flux Tools Erase v1 proxy */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BFLFluxProGenerateResponse"];
+                };
+            };
+            /** @description Bad Request (invalid input to proxy) */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Rate limit exceeded (either from proxy or BFL) */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Internal Server Error (proxy or upstream issue) */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Bad Gateway (error communicating with BFL) */
+            502: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Gateway Timeout (BFL took too long to respond) */
+            504: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
     BFLExpand_v1_flux_pro_1_0_expand_post: {
         parameters: {
             query?: never;
@@ -27356,6 +31575,64 @@ export interface operations {
             };
         };
     };
+    runwayVideoToVideo: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["RunwayVideoToVideoRequest"];
+            };
+        };
+        responses: {
+            /** @description Successful response */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["RunwayVideoToVideoResponse"];
+                };
+            };
+            /** @description Bad request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
     veoGenerate: {
         parameters: {
             query?: never;
@@ -29432,6 +33709,116 @@ export interface operations {
             };
         };
     };
+    tripoImportModel: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": {
+                    /** @description Download URL of the model file previously uploaded to ComfyUI API storage. */
+                    url: string;
+                    /** @description File format ("glb", "fbx", "obj", "stl"). Optional; derived from the URL path extension when omitted. */
+                    format?: string;
+                };
+            };
+        };
+        responses: {
+            /** @description Import task created */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoSuccessTask"];
+                };
+            };
+            /** @description Invalid request parameters */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoErrorResponse"];
+                };
+            };
+            /** @description Authentication failed */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoErrorResponse"];
+                };
+            };
+            /** @description Unauthorized access to requested resource */
+            403: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoErrorResponse"];
+                };
+            };
+            /** @description File exceeds the 150MB limit */
+            413: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoErrorResponse"];
+                };
+            };
+            /** @description Account exception or Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoErrorResponse"];
+                };
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoErrorResponse"];
+                };
+            };
+            /** @description Upstream upload or task creation failed */
+            502: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoErrorResponse"];
+                };
+            };
+            /** @description Service temporarily unavailable */
+            503: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoErrorResponse"];
+                };
+            };
+            /** @description Server timeout */
+            504: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["TripoErrorResponse"];
+                };
+            };
+        };
+    };
     tripoCreateTask: {
         parameters: {
             query?: never;
@@ -30523,6 +34910,104 @@ export interface operations {
             };
         };
     };
+    byteplusFileUpload: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "multipart/form-data": components["schemas"]["BytePlusFileUploadRequest"];
+            };
+        };
+        responses: {
+            /** @description File uploaded successfully */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BytePlusFile"];
+                };
+            };
+            /** @description Error 4xx/5xx */
+            default: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    byteplusFileGet: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path: {
+                /** @description The ID of the file to retrieve. */
+                id: string;
+            };
+            cookie?: never;
+        };
+        requestBody?: never;
+        responses: {
+            /** @description File information retrieved successfully */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BytePlusFile"];
+                };
+            };
+            /** @description Error 4xx/5xx */
+            default: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    byteplusResponseCreate: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["BytePlusResponseCreateRequest"];
+            };
+        };
+        responses: {
+            /** @description Model response body (BytePlusResponseObject). */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BytePlusResponseObject"];
+                };
+            };
+            /** @description Error 4xx/5xx */
+            default: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
     seedanceCreateVisualValidateSession: {
         parameters: {
             query?: never;
@@ -32122,6 +36607,575 @@ export interface operations {
             };
         };
     };
+    anthropicCreateMessage: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["AnthropicCreateMessageRequest"];
+            };
+        };
+        responses: {
+            /** @description Successful response from Anthropic Messages API. JSON shape when `stream` is omitted or false; otherwise a `text/event-stream` of message events. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["AnthropicCreateMessageResponse"];
+                    "text/event-stream": string;
+                };
+            };
+            /** @description Bad request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required - Insufficient credits */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Too Many Requests - Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    openrouterCreateChatCompletion: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["OpenRouterChatRequest"];
+            };
+        };
+        responses: {
+            /** @description Successful response from OpenRouter Chat Completions API. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["OpenRouterChatResult"];
+                };
+            };
+            /** @description Bad request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required - Insufficient credits */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Too Many Requests - Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    kreaGenerateImageMedium: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["KreaGenerateImageRequest"];
+            };
+        };
+        responses: {
+            /** @description The resulting job data. This will be returned in a pending state until the job is completed. See /jobs/{id} for retrieving the results. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KreaJob"];
+                };
+            };
+            /** @description Bad request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required - Insufficient credits */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Too Many Requests - Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    kreaGenerateImageMediumTurbo: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["KreaGenerateImageRequest"];
+            };
+        };
+        responses: {
+            /** @description The resulting job data. This will be returned in a pending state until the job is completed. See /jobs/{id} for retrieving the results. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KreaJob"];
+                };
+            };
+            /** @description Bad request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required - Insufficient credits */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Too Many Requests - Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    kreaGenerateImageLarge: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["KreaGenerateImageRequest"];
+            };
+        };
+        responses: {
+            /** @description The resulting job data. This will be returned in a pending state until the job is completed. See /jobs/{id} for retrieving the results. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KreaJob"];
+                };
+            };
+            /** @description Bad request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required - Insufficient credits */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Too Many Requests - Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    kreaUploadAsset: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "multipart/form-data": components["schemas"]["KreaAssetUploadRequest"];
+            };
+        };
+        responses: {
+            /** @description The uploaded asset. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KreaAsset"];
+                };
+            };
+            /** @description Invalid file type/size */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    kreaGetJob: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path: {
+                /** @description A unique identifier for a job */
+                job_id: string;
+            };
+            cookie?: never;
+        };
+        requestBody?: never;
+        responses: {
+            /** @description The most up-to-date state of the job. You can check when the job is completed by checking the status field. For completed loraTraining jobs, the result will include a style_id field. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["KreaJob"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Job not found */
+            404: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    beebleCreateSwitchXJob: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["BeebleCreateSwitchXRequest"];
+            };
+        };
+        responses: {
+            /** @description The resulting job data. This will be returned in a pending state until the job is completed. See /v1/switchx/generations/{job_id} for retrieving the results. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BeebleSwitchXStatusResponse"];
+                };
+            };
+            /** @description Bad request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required - Insufficient credits */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Too Many Requests - Rate limit exceeded */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    beebleCreateUpload: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["BeebleUploadRequest"];
+            };
+        };
+        responses: {
+            /** @description Presigned upload URL and beeble:// URI. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BeebleUploadResponse"];
+                };
+            };
+            /** @description Bad request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    beebleGetSwitchXStatus: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path: {
+                /** @description Job identifier (swx_...) */
+                job_id: string;
+            };
+            cookie?: never;
+        };
+        requestBody?: never;
+        responses: {
+            /** @description The most up-to-date state of the job. Check the status field to determine completion. Output URLs are signed and expire after 72 hours; each call returns freshly signed URLs. */
+            200: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BeebleSwitchXStatusResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Job not found */
+            404: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Internal server error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
     quiverTextToSVG: {
         parameters: {
             query?: never;
@@ -32701,6 +37755,140 @@ export interface operations {
             };
         };
     };
+    briaVideoGreenScreen: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["BriaVideoGreenScreenRequest"];
+            };
+        };
+        responses: {
+            /** @description Request accepted, processing asynchronously */
+            202: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BriaAsyncResponse"];
+                };
+            };
+            /** @description Bad Request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BriaErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unprocessable Entity */
+            422: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BriaErrorResponse"];
+                };
+            };
+            /** @description Internal Server Error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
+    briaVideoReplaceBackground: {
+        parameters: {
+            query?: never;
+            header?: never;
+            path?: never;
+            cookie?: never;
+        };
+        requestBody: {
+            content: {
+                "application/json": components["schemas"]["BriaVideoReplaceBackgroundRequest"];
+            };
+        };
+        responses: {
+            /** @description Request accepted, processing asynchronously */
+            202: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BriaAsyncResponse"];
+                };
+            };
+            /** @description Bad Request */
+            400: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BriaErrorResponse"];
+                };
+            };
+            /** @description Unauthorized */
+            401: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content?: never;
+            };
+            /** @description Payment Required */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+            /** @description Unprocessable Entity */
+            422: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["BriaErrorResponse"];
+                };
+            };
+            /** @description Internal Server Error */
+            500: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["ErrorResponse"];
+                };
+            };
+        };
+    };
     briaImageRemoveBackground: {
         parameters: {
             query?: never;
@@ -34774,8 +39962,8 @@ export interface operations {
                     "application/json": components["schemas"]["SoniloErrorResponse"];
                 };
             };
-            /** @description Payload Too Large - Video exceeds size limit */
-            413: {
+            /** @description Payment Required - Insufficient funds */
+            402: {
                 headers: {
                     [name: string]: unknown;
                 };
@@ -34783,8 +39971,26 @@ export interface operations {
                     "application/json": components["schemas"]["SoniloErrorResponse"];
                 };
             };
-            /** @description Internal Server Error */
-            500: {
+            /** @description Unprocessable Entity - Validation error */
+            422: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["SoniloErrorResponse"];
+                };
+            };
+            /** @description Too Many Requests - Rate limited */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["SoniloErrorResponse"];
+                };
+            };
+            /** @description Bad Gateway - Upstream generation error */
+            502: {
                 headers: {
                     [name: string]: unknown;
                 };
@@ -34834,8 +40040,35 @@ export interface operations {
                     "application/json": components["schemas"]["SoniloErrorResponse"];
                 };
             };
-            /** @description Internal Server Error */
-            500: {
+            /** @description Payment Required - Insufficient funds */
+            402: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["SoniloErrorResponse"];
+                };
+            };
+            /** @description Unprocessable Entity - Validation error */
+            422: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["SoniloErrorResponse"];
+                };
+            };
+            /** @description Too Many Requests - Rate limited */
+            429: {
+                headers: {
+                    [name: string]: unknown;
+                };
+                content: {
+                    "application/json": components["schemas"]["SoniloErrorResponse"];
+                };
+            };
+            /** @description Bad Gateway - Upstream generation error */
+            502: {
                 headers: {
                     [name: string]: unknown;
                 };
diff --git a/src/components/boundingBoxes/WidgetBoundingBoxes.test.ts b/src/components/boundingBoxes/WidgetBoundingBoxes.test.ts
new file mode 100644
index 0000000000..0bf402216b
--- /dev/null
+++ b/src/components/boundingBoxes/WidgetBoundingBoxes.test.ts
@@ -0,0 +1,224 @@
+/* eslint-disable testing-library/no-container, testing-library/no-node-access, testing-library/prefer-user-event */
+import { fireEvent, render, screen } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { createPinia, setActivePinia } from 'pinia'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { createI18n } from 'vue-i18n'
+
+import WidgetBoundingBoxes from './WidgetBoundingBoxes.vue'
+import boundingBoxes from '@/locales/en/main.json'
+import type { BoundingBox } from '@/types/boundingBoxes'
+
+const { appState } = vi.hoisted(() => ({ appState: { node: null as unknown } }))
+
+vi.mock('@/scripts/app', () => ({
+  app: { canvas: { graph: { getNodeById: () => appState.node } } }
+}))
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages: {
+    en: {
+      boundingBoxes: boundingBoxes.boundingBoxes,
+      palette: { swatchTitle: 'Edit', addColor: 'Add' }
+    }
+  }
+})
+
+const box = (over: Partial<BoundingBox> = {}): BoundingBox => ({
+  x: 51,
+  y: 51,
+  width: 256,
+  height: 256,
+  metadata: { type: 'obj', text: '', desc: '', palette: ['#ff0000'] },
+  ...over
+})
+
+const fakeCtx = {
+  measureText: (s: string) => ({ width: s.length * 7 }),
+  setTransform: () => {},
+  clearRect: () => {},
+  fillRect: () => {},
+  strokeRect: () => {},
+  fillText: () => {},
+  drawImage: () => {},
+  save: () => {},
+  restore: () => {},
+  beginPath: () => {},
+  rect: () => {},
+  clip: () => {},
+  font: '',
+  fillStyle: '',
+  strokeStyle: '',
+  lineWidth: 0
+} as unknown as CanvasRenderingContext2D
+
+function prepCanvas(canvas: HTMLCanvasElement) {
+  Object.defineProperty(canvas, 'clientWidth', {
+    value: 100,
+    configurable: true
+  })
+  Object.defineProperty(canvas, 'clientHeight', {
+    value: 100,
+    configurable: true
+  })
+  canvas.getContext = (() =>
+    fakeCtx) as unknown as HTMLCanvasElement['getContext']
+  canvas.getBoundingClientRect = () =>
+    ({
+      left: 0,
+      top: 0,
+      right: 100,
+      bottom: 100,
+      width: 100,
+      height: 100,
+      x: 0,
+      y: 0,
+      toJSON: () => ({})
+    }) as DOMRect
+  canvas.setPointerCapture = () => {}
+  canvas.releasePointerCapture = () => {}
+}
+
+function renderWidget(modelValue: BoundingBox[]) {
+  const result = render(WidgetBoundingBoxes, {
+    props: { nodeId: '1', modelValue },
+    global: { plugins: [i18n] }
+  })
+  const canvas = screen.getByTestId('bounding-boxes').querySelector('canvas')!
+  prepCanvas(canvas)
+  return { ...result, canvas }
+}
+
+const lastBoxes = (emitted: () => Record<string, unknown[][]>) => {
+  const calls = emitted()['update:modelValue']
+  return calls[calls.length - 1][0] as BoundingBox[]
+}
+
+beforeEach(() => {
+  setActivePinia(createPinia())
+  appState.node = {
+    widgets: [
+      { name: 'width', value: 512 },
+      { name: 'height', value: 512 }
+    ],
+    findInputSlot: () => -1,
+    getInputNode: () => null
+  }
+  vi.stubGlobal('requestAnimationFrame', () => 1)
+  vi.stubGlobal('cancelAnimationFrame', () => {})
+})
+
+afterEach(() => {
+  vi.unstubAllGlobals()
+})
+
+describe('WidgetBoundingBoxes', () => {
+  it('renders the canvas and editor shell', () => {
+    renderWidget([])
+    expect(
+      screen.getByTestId('bounding-boxes').querySelector('canvas')
+    ).not.toBeNull()
+  })
+
+  it('shows the region editor panel when a region is active', () => {
+    renderWidget([box()])
+    expect(screen.getByText('obj')).toBeTruthy()
+    expect(screen.getByText('text')).toBeTruthy()
+  })
+
+  it('reveals the text field after switching the region to text', async () => {
+    renderWidget([box()])
+    expect(
+      screen.queryByPlaceholderText('text to render (verbatim)')
+    ).toBeNull()
+    await userEvent.click(screen.getByText('text'))
+    expect(
+      screen.getByPlaceholderText('text to render (verbatim)')
+    ).toBeTruthy()
+  })
+
+  it('clears all regions via the clear button', async () => {
+    const { emitted } = renderWidget([box()])
+    await userEvent.click(screen.getByText('Clear all'))
+    expect(lastBoxes(emitted)).toEqual([])
+  })
+
+  it('draws a region through canvas pointer events', async () => {
+    const { canvas, emitted } = renderWidget([])
+    await fireEvent.pointerDown(canvas, {
+      button: 0,
+      clientX: 10,
+      clientY: 10,
+      pointerId: 1
+    })
+    await fireEvent.pointerMove(canvas, {
+      clientX: 60,
+      clientY: 60,
+      pointerId: 1
+    })
+    await fireEvent.pointerUp(canvas, {
+      clientX: 60,
+      clientY: 60,
+      pointerId: 1
+    })
+    expect(lastBoxes(emitted)).toHaveLength(1)
+  })
+
+  it('tracks focus and blur on the canvas', async () => {
+    const { canvas } = renderWidget([box()])
+    await fireEvent.focus(canvas)
+    await fireEvent.blur(canvas)
+    expect(canvas).toBeTruthy()
+  })
+
+  it('opens an inline editor on double click', async () => {
+    const { canvas, container } = renderWidget([box()])
+    await fireEvent.dblClick(canvas, { clientX: 30, clientY: 30 })
+    expect(container.querySelector('textarea')).not.toBeNull()
+  })
+
+  it('syncs description edits back to the model', async () => {
+    const { emitted } = renderWidget([box()])
+    await fireEvent.update(
+      screen.getByPlaceholderText('description of this region'),
+      'a caption'
+    )
+    expect(lastBoxes(emitted)[0].metadata.desc).toBe('a caption')
+  })
+
+  it('edits the text field once the region is a text region', async () => {
+    const { emitted } = renderWidget([box()])
+    await userEvent.click(screen.getByText('text'))
+    await fireEvent.update(
+      screen.getByPlaceholderText('text to render (verbatim)'),
+      'hello'
+    )
+    expect(lastBoxes(emitted)[0].metadata.text).toBe('hello')
+  })
+
+  it('deletes the active region with the Delete key', async () => {
+    const { canvas, emitted } = renderWidget([box()])
+    await fireEvent.keyDown(canvas, { key: 'Delete' })
+    expect(lastBoxes(emitted)).toEqual([])
+  })
+
+  it('clears hover state on pointer leave', async () => {
+    const { canvas } = renderWidget([
+      box({ x: 10, y: 10, width: 256, height: 256 })
+    ])
+    await fireEvent.pointerMove(canvas, { clientX: 15, clientY: 15 })
+    await fireEvent.pointerLeave(canvas)
+    expect(canvas).toBeTruthy()
+  })
+
+  it('commits the inline editor on blur', async () => {
+    const { canvas, container, emitted } = renderWidget([box()])
+    await fireEvent.dblClick(canvas, { clientX: 30, clientY: 30 })
+    const editor = container.querySelector('textarea')!
+    await fireEvent.update(editor, 'committed')
+    await fireEvent.blur(editor)
+    expect(lastBoxes(emitted)[0].metadata.desc).toBe('committed')
+  })
+})
diff --git a/src/components/boundingBoxes/WidgetBoundingBoxes.vue b/src/components/boundingBoxes/WidgetBoundingBoxes.vue
new file mode 100644
index 0000000000..d80c247ce7
--- /dev/null
+++ b/src/components/boundingBoxes/WidgetBoundingBoxes.vue
@@ -0,0 +1,181 @@
+<template>
+  <div
+    class="widget-expands flex size-full flex-col gap-1 select-none"
+    data-testid="bounding-boxes"
+    @pointerdown.stop
+  >
+    <div
+      ref="canvasContainer"
+      class="relative w-full shrink-0 overflow-hidden rounded-sm border border-component-node-border bg-node-component-surface"
+      :style="canvasStyle"
+    >
+      <canvas
+        ref="canvasEl"
+        tabindex="0"
+        class="absolute inset-0 size-full rounded-sm outline-none"
+        :style="{ cursor: canvasCursor }"
+        @pointerdown="onPointerDown"
+        @pointermove="onCanvasPointerMove"
+        @pointerup="onDocPointerUp"
+        @pointercancel="onDocPointerUp"
+        @pointerleave="onPointerLeave"
+        @lostpointercapture="onDocPointerUp"
+        @dblclick="onDoubleClick"
+        @keydown="onCanvasKeyDown"
+        @focus="focused = true"
+        @blur="focused = false"
+      />
+      <textarea
+        v-if="inlineEditor"
+        ref="inlineEditorEl"
+        v-model="inlineEditor.value"
+        class="absolute box-border resize-none rounded-sm border-2 bg-black/90 p-1 font-mono text-xs text-white outline-none"
+        :style="inlineEditor.style"
+        data-capture-wheel="true"
+        @keydown.stop="onInlineKeyDown"
+        @blur="commitInlineEditor"
+      />
+    </div>
+
+    <div
+      v-if="activeRegion"
+      class="flex flex-col gap-2 rounded-sm bg-node-component-surface p-2 text-xs"
+    >
+      <div
+        class="flex h-8 items-center gap-1 rounded-sm bg-component-node-widget-background p-1"
+      >
+        <Button
+          variant="textonly"
+          size="unset"
+          :class="
+            cn(
+              'flex-1 self-stretch px-2 text-xs transition-colors',
+              activeRegion.type === 'obj'
+                ? 'rounded-sm bg-component-node-widget-background-selected text-base-foreground'
+                : 'text-node-text-muted hover:text-node-text'
+            )
+          "
+          @click="setActiveType('obj')"
+        >
+          {{ $t('boundingBoxes.typeObj') }}
+        </Button>
+        <Button
+          variant="textonly"
+          size="unset"
+          :class="
+            cn(
+              'flex-1 self-stretch px-2 text-xs transition-colors',
+              activeRegion.type === 'text'
+                ? 'rounded-sm bg-component-node-widget-background-selected text-base-foreground'
+                : 'text-node-text-muted hover:text-node-text'
+            )
+          "
+          @click="setActiveType('text')"
+        >
+          {{ $t('boundingBoxes.typeText') }}
+        </Button>
+      </div>
+      <div
+        v-if="activeRegion.type === 'text'"
+        class="group relative rounded-lg transition-all focus-within:ring focus-within:ring-component-node-widget-background-highlighted hover:bg-component-node-widget-background-hovered"
+      >
+        <span
+          class="pointer-events-none absolute top-1.5 left-3 z-10 text-2xs text-muted-foreground"
+        >
+          {{ $t('boundingBoxes.textLabel') }}
+        </span>
+        <Textarea
+          v-model="activeRegion.text"
+          :placeholder="$t('boundingBoxes.textPlaceholder')"
+          class="min-h-14 resize-none overflow-hidden pt-5 text-(length:--comfy-textarea-font-size) leading-normal not-disabled:bg-component-node-widget-background not-disabled:text-component-node-foreground hover:overflow-auto focus:overflow-auto"
+          data-capture-wheel="true"
+          @update:model-value="syncState"
+        />
+      </div>
+      <div
+        class="group relative rounded-lg transition-all focus-within:ring focus-within:ring-component-node-widget-background-highlighted hover:bg-component-node-widget-background-hovered"
+      >
+        <span
+          class="pointer-events-none absolute top-1.5 left-3 z-10 text-2xs text-muted-foreground"
+        >
+          {{ $t('boundingBoxes.descLabel') }}
+        </span>
+        <Textarea
+          v-model="activeRegion.desc"
+          :placeholder="$t('boundingBoxes.descPlaceholder')"
+          class="min-h-20 resize-none overflow-hidden pt-5 text-(length:--comfy-textarea-font-size) leading-normal not-disabled:bg-component-node-widget-background not-disabled:text-component-node-foreground hover:overflow-auto focus:overflow-auto"
+          data-capture-wheel="true"
+          @update:model-value="syncState"
+        />
+      </div>
+      <div class="flex items-center gap-2">
+        <span class="shrink-0 truncate text-sm text-muted-foreground">
+          {{ $t('boundingBoxes.colors') }}
+        </span>
+        <PaletteSwatchRow
+          v-model="activeRegion.palette"
+          :max="maxColors"
+          @update:model-value="syncState"
+        />
+      </div>
+    </div>
+    <div v-else-if="hasRegions" class="text-node-text-muted px-1 text-xs">
+      {{ $t('boundingBoxes.clickRegionToEdit') }}
+    </div>
+
+    <Button
+      variant="secondary"
+      size="md"
+      class="gap-2 rounded-lg border border-component-node-border bg-component-node-background text-xs text-muted-foreground hover:text-base-foreground"
+      @click="clearAll"
+    >
+      <i class="icon-[lucide--undo-2]" />
+      {{ $t('boundingBoxes.clearAll') }}
+    </Button>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useTemplateRef } from 'vue'
+
+import { cn } from '@comfyorg/tailwind-utils'
+
+import PaletteSwatchRow from '@/components/palette/PaletteSwatchRow.vue'
+import Button from '@/components/ui/button/Button.vue'
+import Textarea from '@/components/ui/textarea/Textarea.vue'
+import { useBoundingBoxes } from '@/composables/boundingBoxes/useBoundingBoxes'
+import type { BoundingBox } from '@/types/boundingBoxes'
+
+const { nodeId } = defineProps<{ nodeId: string }>()
+const modelValue = defineModel<BoundingBox[]>({ default: () => [] })
+
+const canvasEl = useTemplateRef<HTMLCanvasElement>('canvasEl')
+const canvasContainer = useTemplateRef<HTMLDivElement>('canvasContainer')
+const inlineEditorEl = useTemplateRef<HTMLTextAreaElement>('inlineEditorEl')
+
+const {
+  canvasStyle,
+  canvasCursor,
+  focused,
+  activeRegion,
+  hasRegions,
+  inlineEditor,
+  maxColors,
+  onPointerDown,
+  onCanvasPointerMove,
+  onDocPointerUp,
+  onPointerLeave,
+  onDoubleClick,
+  onCanvasKeyDown,
+  onInlineKeyDown,
+  commitInlineEditor,
+  setActiveType,
+  clearAll,
+  syncState
+} = useBoundingBoxes(nodeId, {
+  canvasEl,
+  canvasContainer,
+  inlineEditorEl,
+  modelValue
+})
+</script>
diff --git a/src/components/common/TreeExplorerV2Node.test.ts b/src/components/common/TreeExplorerV2Node.test.ts
index 1156156383..0b6859bb0e 100644
--- a/src/components/common/TreeExplorerV2Node.test.ts
+++ b/src/components/common/TreeExplorerV2Node.test.ts
@@ -355,7 +355,7 @@ describe('TreeExplorerV2Node', () => {
       const nodeDiv = getTreeNode(container)
       await fireEvent.dragStart(nodeDiv)
 
-      expect(mockStartDrag).toHaveBeenCalledWith(mockData, 'native')
+      expect(mockStartDrag).toHaveBeenCalledWith(mockData, { mode: 'native' })
     })
 
     it('does not call startDrag for folder items on dragstart', async () => {
diff --git a/src/components/custom/widget/WorkflowTemplateSelectorDialog.vue b/src/components/custom/widget/WorkflowTemplateSelectorDialog.vue
index 037d7e3848..09b6eeb9e0 100644
--- a/src/components/custom/widget/WorkflowTemplateSelectorDialog.vue
+++ b/src/components/custom/widget/WorkflowTemplateSelectorDialog.vue
@@ -427,7 +427,6 @@ import { useIntersectionObserver } from '@/composables/useIntersectionObserver'
 import { useLazyPagination } from '@/composables/useLazyPagination'
 import { usePrimeVueOverlayChildStyle } from '@/composables/usePopoverSizing'
 import { useTemplateFiltering } from '@/composables/useTemplateFiltering'
-import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import { useTemplateWorkflows } from '@/platform/workflow/templates/composables/useTemplateWorkflows'
 import type { TemplateInfo } from '@/platform/workflow/templates/types/template'
@@ -453,16 +452,14 @@ onMounted(() => {
 
 // Wrap onClose to track session end
 const onClose = () => {
-  if (isCloud) {
-    const timeSpentSeconds = Math.floor(
-      (Date.now() - sessionStartTime.value) / 1000
-    )
+  const timeSpentSeconds = Math.floor(
+    (Date.now() - sessionStartTime.value) / 1000
+  )
 
-    useTelemetry()?.trackTemplateLibraryClosed({
-      template_selected: templateWasSelected.value,
-      time_spent_seconds: timeSpentSeconds
-    })
-  }
+  useTelemetry()?.trackTemplateLibraryClosed({
+    template_selected: templateWasSelected.value,
+    time_spent_seconds: timeSpentSeconds
+  })
 
   originalOnClose()
 }
diff --git a/src/components/dialog/content/setting/KeybindingPanel.vue b/src/components/dialog/content/setting/KeybindingPanel.vue
index 9e6bb31691..65fe6a0dee 100644
--- a/src/components/dialog/content/setting/KeybindingPanel.vue
+++ b/src/components/dialog/content/setting/KeybindingPanel.vue
@@ -8,6 +8,7 @@
         v-model="filters['global'].value"
         class="max-w-96"
         size="lg"
+        autofocus
         :placeholder="
           $t('g.searchPlaceholder', { subject: $t('g.keybindings') })
         "
diff --git a/src/components/dialog/content/setting/UsageLogsTable.test.ts b/src/components/dialog/content/setting/UsageLogsTable.test.ts
index 954c4be9ff..cddcaa5c9c 100644
--- a/src/components/dialog/content/setting/UsageLogsTable.test.ts
+++ b/src/components/dialog/content/setting/UsageLogsTable.test.ts
@@ -7,6 +7,7 @@ import { createI18n } from 'vue-i18n'
 
 import { render, screen, waitFor } from '@testing-library/vue'
 
+import type * as DistributionTypes from '@/platform/distribution/types'
 import type { AuditLog } from '@/services/customerEventsService'
 import { EventType } from '@/services/customerEventsService'
 
@@ -38,6 +39,23 @@ vi.mock('@/platform/telemetry', () => ({
   useTelemetry: () => null
 }))
 
+const mockFlags = vi.hoisted(() => ({ teamWorkspacesEnabled: false }))
+vi.mock('@/composables/useFeatureFlags', () => ({
+  useFeatureFlags: () => ({ flags: mockFlags })
+}))
+
+vi.mock('@/platform/distribution/types', async (importOriginal) => ({
+  ...(await importOriginal<typeof DistributionTypes>()),
+  isCloud: true
+}))
+
+const mockWorkspaceApi = vi.hoisted(() => ({
+  getBillingEvents: vi.fn()
+}))
+vi.mock('@/platform/workspace/api/workspaceApi', () => ({
+  workspaceApi: mockWorkspaceApi
+}))
+
 const i18n = createI18n({
   legacy: false,
   locale: 'en',
@@ -118,6 +136,8 @@ describe('UsageLogsTable', () => {
     vi.clearAllMocks()
 
     mockCustomerEventsService.getMyEvents.mockResolvedValue(mockEventsResponse)
+    mockWorkspaceApi.getBillingEvents.mockResolvedValue(mockEventsResponse)
+    mockFlags.teamWorkspacesEnabled = false
     mockCustomerEventsService.formatEventType.mockImplementation(
       (type: string) => {
         switch (type) {
@@ -320,6 +340,20 @@ describe('UsageLogsTable', () => {
     })
   })
 
+  describe('billing events source', () => {
+    it('uses workspaceApi.getBillingEvents when teamWorkspacesEnabled is on', async () => {
+      mockFlags.teamWorkspacesEnabled = true
+
+      await renderLoaded()
+
+      expect(mockWorkspaceApi.getBillingEvents).toHaveBeenCalledWith({
+        page: 1,
+        limit: 7
+      })
+      expect(mockCustomerEventsService.getMyEvents).not.toHaveBeenCalled()
+    })
+  })
+
   describe('EventType integration', () => {
     it('renders credit_added event with correct detail template', async () => {
       mockCustomerEventsService.getMyEvents.mockResolvedValue(
diff --git a/src/components/dialog/content/setting/UsageLogsTable.vue b/src/components/dialog/content/setting/UsageLogsTable.vue
index d0c1ae53b9..896397fcaf 100644
--- a/src/components/dialog/content/setting/UsageLogsTable.vue
+++ b/src/components/dialog/content/setting/UsageLogsTable.vue
@@ -99,7 +99,10 @@ import ProgressSpinner from 'primevue/progressspinner'
 import { computed, ref } from 'vue'
 
 import Button from '@/components/ui/button/Button.vue'
+import { useFeatureFlags } from '@/composables/useFeatureFlags'
+import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
+import { workspaceApi } from '@/platform/workspace/api/workspaceApi'
 import type { AuditLog } from '@/services/customerEventsService'
 import {
   EventType,
@@ -112,6 +115,9 @@ const error = ref<string | null>(null)
 
 const customerEventService = useCustomerEventsService()
 
+const { flags } = useFeatureFlags()
+const useBillingApi = computed(() => isCloud && flags.teamWorkspacesEnabled)
+
 const pagination = ref({
   page: 1,
   limit: 7,
@@ -138,10 +144,13 @@ const loadEvents = async () => {
   error.value = null
 
   try {
-    const response = await customerEventService.getMyEvents({
+    const params = {
       page: pagination.value.page,
       limit: pagination.value.limit
-    })
+    }
+    const response = useBillingApi.value
+      ? await workspaceApi.getBillingEvents(params)
+      : await customerEventService.getMyEvents(params)
 
     if (response) {
       if (response.events) {
diff --git a/src/components/graph/GraphCanvas.vue b/src/components/graph/GraphCanvas.vue
index ef90a492cc..ed6f5cbec2 100644
--- a/src/components/graph/GraphCanvas.vue
+++ b/src/components/graph/GraphCanvas.vue
@@ -93,6 +93,7 @@
 
   <NodeTooltip v-if="tooltipEnabled" />
   <NodeSearchboxPopover ref="nodeSearchboxPopoverRef" />
+  <NodeDragPreview />
   <VueNodeSwitchPopup />
 
   <!-- Initialize components after comfyApp is ready. useAbsolutePosition requires
@@ -136,6 +137,7 @@ import GraphCanvasMenu from '@/components/graph/GraphCanvasMenu.vue'
 import LinkOverlayCanvas from '@/components/graph/LinkOverlayCanvas.vue'
 import NodeTooltip from '@/components/graph/NodeTooltip.vue'
 import NodeContextMenu from '@/components/graph/NodeContextMenu.vue'
+import NodeDragPreview from '@/components/graph/NodeDragPreview.vue'
 import SelectionToolbox from '@/components/graph/SelectionToolbox.vue'
 import TitleEditor from '@/components/graph/TitleEditor.vue'
 import NodePropertiesPanel from '@/components/rightSidePanel/RightSidePanel.vue'
@@ -145,6 +147,7 @@ import TopbarBadges from '@/components/topbar/TopbarBadges.vue'
 import TopbarSubscribeButton from '@/components/topbar/TopbarSubscribeButton.vue'
 import WorkflowTabs from '@/components/topbar/WorkflowTabs.vue'
 import { useChainCallback } from '@/composables/functional/useChainCallback'
+import { useGroupContextMenu } from '@/composables/graph/useGroupContextMenu'
 import { installErrorClearingHooks } from '@/composables/graph/useErrorClearingHooks'
 import type { VueNodeData } from '@/composables/graph/useGraphNodeManager'
 import { useVueNodeLifecycle } from '@/composables/graph/useVueNodeLifecycle'
@@ -464,6 +467,7 @@ useNodeBadge()
 
 useGlobalLitegraph()
 useContextMenuTranslation()
+useGroupContextMenu()
 useCopy()
 usePaste()
 useWorkflowAutoSave()
diff --git a/src/components/graph/NodeDragPreview.test.ts b/src/components/graph/NodeDragPreview.test.ts
new file mode 100644
index 0000000000..6d665f3979
--- /dev/null
+++ b/src/components/graph/NodeDragPreview.test.ts
@@ -0,0 +1,97 @@
+import { render } from '@testing-library/vue'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { nextTick } from 'vue'
+
+import NodeDragPreview from '@/components/graph/NodeDragPreview.vue'
+import { useNodeDragToCanvas } from '@/composables/node/useNodeDragToCanvas'
+import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
+import { fromPartial } from '@total-typescript/shoehorn'
+
+vi.mock(
+  '@/renderer/extensions/vueNodes/components/LGraphNodePreview.vue',
+  () => ({
+    default: { template: '<div data-testid="node-preview" />' }
+  })
+)
+
+const nodeDef = fromPartial<ComfyNodeDefImpl>({ name: 'TestNode' })
+
+function moveMouse(clientX: number, clientY: number) {
+  window.dispatchEvent(new MouseEvent('mousemove', { clientX, clientY }))
+}
+
+function ghostElement() {
+  return document.querySelector('[data-testid="node-preview"]')?.parentElement
+    ?.parentElement
+}
+
+describe('NodeDragPreview', () => {
+  beforeEach(() => {
+    vi.useFakeTimers()
+  })
+
+  afterEach(() => {
+    useNodeDragToCanvas().cancelDrag()
+    vi.useRealTimers()
+  })
+
+  it('shows no ghost when nothing is being dragged', async () => {
+    render(NodeDragPreview)
+
+    moveMouse(100, 200)
+    vi.advanceTimersByTime(16)
+    await nextTick()
+
+    expect(ghostElement()).toBeFalsy()
+  })
+
+  it('keeps the ghost hidden until the mouse position is known', async () => {
+    render(NodeDragPreview)
+
+    useNodeDragToCanvas().startDrag(nodeDef)
+    await nextTick()
+    vi.advanceTimersByTime(16)
+    await nextTick()
+
+    expect(ghostElement()).toBeFalsy()
+  })
+
+  it('follows the mouse with an offset while dragging', async () => {
+    render(NodeDragPreview)
+
+    useNodeDragToCanvas().startDrag(nodeDef)
+    await nextTick()
+    moveMouse(100, 200)
+    vi.advanceTimersByTime(16)
+    await nextTick()
+
+    expect(ghostElement()?.style.transform).toBe('translate(112px, 212px)')
+
+    vi.advanceTimersByTime(16)
+    await nextTick()
+
+    expect(ghostElement()?.style.transform).toBe('translate(112px, 212px)')
+
+    moveMouse(300, 400)
+    vi.advanceTimersByTime(16)
+    await nextTick()
+
+    expect(ghostElement()?.style.transform).toBe('translate(312px, 412px)')
+  })
+
+  it('removes the ghost when the drag is cancelled', async () => {
+    render(NodeDragPreview)
+
+    useNodeDragToCanvas().startDrag(nodeDef)
+    await nextTick()
+    moveMouse(100, 200)
+    vi.advanceTimersByTime(16)
+    await nextTick()
+    expect(ghostElement()).toBeTruthy()
+
+    useNodeDragToCanvas().cancelDrag()
+    await nextTick()
+
+    expect(ghostElement()).toBeFalsy()
+  })
+})
diff --git a/src/components/graph/NodeDragPreview.vue b/src/components/graph/NodeDragPreview.vue
new file mode 100644
index 0000000000..ca4da5c9be
--- /dev/null
+++ b/src/components/graph/NodeDragPreview.vue
@@ -0,0 +1,57 @@
+<template>
+  <Teleport to="body">
+    <div
+      v-if="showGhost && rafPosition"
+      class="pointer-events-none fixed top-0 left-0 z-10000 will-change-transform"
+      :style="{
+        transform: `translate(${rafPosition.x + 12}px, ${rafPosition.y + 12}px)`
+      }"
+    >
+      <div class="origin-top-left scale-50 opacity-80">
+        <LGraphNodePreview
+          :node-def="draggedNode!"
+          :widget-values="pendingWidgetValues"
+          position="relative"
+        />
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<script setup lang="ts">
+import { useMouse, useRafFn } from '@vueuse/core'
+import { computed, shallowRef, watch } from 'vue'
+
+import { useNodeDragToCanvas } from '@/composables/node/useNodeDragToCanvas'
+import LGraphNodePreview from '@/renderer/extensions/vueNodes/components/LGraphNodePreview.vue'
+
+const { isDragging, draggedNode, pendingWidgetValues } = useNodeDragToCanvas()
+
+const { x, y, sourceType } = useMouse({ type: 'client' })
+
+const showGhost = computed(() => Boolean(isDragging.value && draggedNode.value))
+const rafPosition = shallowRef<{ x: number; y: number }>()
+
+const { pause, resume } = useRafFn(
+  () => {
+    if (sourceType.value === null) return
+    const pos = rafPosition.value
+    if (pos && pos.x === x.value && pos.y === y.value) return
+    rafPosition.value = { x: x.value, y: y.value }
+  },
+  { immediate: false }
+)
+
+watch(
+  showGhost,
+  (show) => {
+    if (show) {
+      resume()
+    } else {
+      pause()
+      rafPosition.value = undefined
+    }
+  },
+  { immediate: true }
+)
+</script>
diff --git a/src/components/hdr/HdrViewerContent.test.ts b/src/components/hdr/HdrViewerContent.test.ts
new file mode 100644
index 0000000000..7d7166900c
--- /dev/null
+++ b/src/components/hdr/HdrViewerContent.test.ts
@@ -0,0 +1,126 @@
+/* eslint-disable testing-library/no-container, testing-library/no-node-access */
+import { render, screen } from '@testing-library/vue'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { ref } from 'vue'
+import { createI18n } from 'vue-i18n'
+
+import HdrViewerContent from './HdrViewerContent.vue'
+
+vi.mock('@/base/common/downloadUtil', () => ({ downloadFile: vi.fn() }))
+
+const holder = vi.hoisted(() => ({ viewer: undefined as unknown }))
+vi.mock('@/composables/useHdrViewer', () => ({
+  useHdrViewer: () => holder.viewer,
+  CHANNEL_MODES: ['rgb', 'r', 'g', 'b', 'a', 'luminance']
+}))
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages: {
+    en: {
+      g: { loading: 'Loading', downloadImage: 'Download' },
+      hdrViewer: {
+        failedToLoad: 'Failed',
+        exposure: 'Exposure',
+        normalizeExposure: 'Auto exposure',
+        channel: 'Channel',
+        channels: {
+          rgb: 'RGB',
+          r: 'R',
+          g: 'G',
+          b: 'B',
+          a: 'Alpha',
+          luminance: 'Luminance'
+        },
+        sourceGamut: 'Source gamut',
+        dither: 'Dither',
+        clipWarnings: 'Clip warnings',
+        fitView: 'Fit',
+        histogram: 'Histogram',
+        resolution: 'Resolution',
+        min: 'Min',
+        max: 'Max',
+        mean: 'Mean',
+        stdDev: 'Std dev',
+        nan: 'NaN',
+        inf: 'Inf'
+      }
+    }
+  }
+})
+
+function makeViewer(overrides: Record<string, unknown> = {}) {
+  return {
+    exposureStops: ref(0),
+    dither: ref(true),
+    clipWarnings: ref(false),
+    gamut: ref('sRGB'),
+    channel: ref('r'),
+    loading: ref(false),
+    error: ref(null),
+    dimensions: ref('512 x 512'),
+    stats: ref({
+      min: 0,
+      max: 4,
+      mean: 0.5,
+      stdDev: 0.2,
+      nanCount: 2,
+      infCount: 1
+    }),
+    histogram: ref(new Uint32Array([1, 2, 3, 4])),
+    pixel: ref({ x: 1, y: 2, r: 0.1, g: 0.2, b: 0.3, a: 1 }),
+    mount: vi.fn(),
+    dispose: vi.fn(),
+    fitView: vi.fn(),
+    normalizeExposure: vi.fn(),
+    ...overrides
+  }
+}
+
+function renderViewer() {
+  return render(HdrViewerContent, {
+    props: { imageUrl: '/api/view?filename=out.exr' },
+    global: { plugins: [i18n], stubs: { Button: true } }
+  })
+}
+
+describe('HdrViewerContent', () => {
+  beforeEach(() => {
+    holder.viewer = makeViewer()
+  })
+
+  it('renders the full statistics set including NaN/Inf', () => {
+    renderViewer()
+    for (const label of [
+      'Resolution',
+      'Min',
+      'Max',
+      'Mean',
+      'Std dev',
+      'NaN',
+      'Inf'
+    ]) {
+      screen.getByText(label)
+    }
+  })
+
+  it('shows the pixel readout when a pixel is hovered', () => {
+    renderViewer()
+    expect(screen.getByTestId('hdr-pixel-readout')).toBeInTheDocument()
+  })
+
+  it('colors the histogram according to the selected channel', () => {
+    holder.viewer = makeViewer({ channel: ref('g') })
+    const { container } = renderViewer()
+    const path = container.querySelector('svg path')
+    expect(path?.getAttribute('class')).toContain('text-green-500')
+  })
+
+  it('renders an option for each channel mode', () => {
+    renderViewer()
+    expect(
+      screen.getByRole('option', { name: 'Luminance' })
+    ).toBeInTheDocument()
+  })
+})
diff --git a/src/components/hdr/HdrViewerContent.vue b/src/components/hdr/HdrViewerContent.vue
new file mode 100644
index 0000000000..444e3b4b10
--- /dev/null
+++ b/src/components/hdr/HdrViewerContent.vue
@@ -0,0 +1,258 @@
+<template>
+  <div class="flex size-full bg-base-background">
+    <div class="relative flex-1">
+      <div
+        ref="containerRef"
+        class="absolute size-full"
+        data-testid="hdr-viewer-canvas"
+      />
+
+      <div
+        v-if="viewer.loading.value"
+        class="absolute inset-0 flex items-center justify-center text-base-foreground"
+      >
+        {{ $t('g.loading') }}...
+      </div>
+      <div
+        v-else-if="viewer.error.value"
+        role="alert"
+        class="absolute inset-0 flex flex-col items-center justify-center gap-2 text-base-foreground"
+      >
+        <i class="icon-[lucide--image-off] size-12" />
+        <p class="text-sm">{{ $t('hdrViewer.failedToLoad') }}</p>
+      </div>
+
+      <div
+        v-if="viewer.pixel.value"
+        class="absolute top-2 left-2 rounded-sm bg-base-background/80 px-2 py-1 font-mono text-xs text-base-foreground"
+        data-testid="hdr-pixel-readout"
+      >
+        <div>{{ viewer.pixel.value.x }}, {{ viewer.pixel.value.y }}</div>
+        <div>
+          {{ formatNum(viewer.pixel.value.r) }}
+          {{ formatNum(viewer.pixel.value.g) }}
+          {{ formatNum(viewer.pixel.value.b) }}
+          <template v-if="viewer.pixel.value.a !== null">
+            {{ formatNum(viewer.pixel.value.a) }}
+          </template>
+        </div>
+      </div>
+    </div>
+
+    <div class="flex w-72 flex-col" data-testid="hdr-viewer-sidebar">
+      <div class="flex-1 overflow-y-auto p-4">
+        <div class="space-y-2">
+          <div class="space-y-4 p-2">
+            <div class="flex flex-col gap-2">
+              <label>{{ $t('hdrViewer.exposure') }}: {{ exposureLabel }}</label>
+              <input
+                v-model.number="viewer.exposureStops.value"
+                type="range"
+                min="-10"
+                max="10"
+                step="0.1"
+                class="w-full"
+                :aria-label="$t('hdrViewer.exposure')"
+              />
+            </div>
+            <Button
+              variant="secondary"
+              class="w-full"
+              @click="viewer.normalizeExposure"
+            >
+              {{ $t('hdrViewer.normalizeExposure') }}
+            </Button>
+          </div>
+
+          <div class="space-y-4 p-2">
+            <div class="flex flex-col gap-2">
+              <label>{{ $t('hdrViewer.channel') }}</label>
+              <select
+                v-model="viewer.channel.value"
+                class="bg-base-component-surface w-full rounded-sm px-2 py-1"
+                :aria-label="$t('hdrViewer.channel')"
+              >
+                <option v-for="mode in channelModes" :key="mode" :value="mode">
+                  {{ channelLabels[mode] }}
+                </option>
+              </select>
+            </div>
+
+            <div class="flex flex-col gap-2">
+              <label>{{ $t('hdrViewer.sourceGamut') }}</label>
+              <select
+                v-model="viewer.gamut.value"
+                class="bg-base-component-surface w-full rounded-sm px-2 py-1"
+                :aria-label="$t('hdrViewer.sourceGamut')"
+              >
+                <option v-for="name in gamutNames" :key="name" :value="name">
+                  {{ name }}
+                </option>
+              </select>
+            </div>
+          </div>
+
+          <div class="space-y-4 p-2">
+            <div class="flex items-center gap-2">
+              <input
+                id="hdr-dither"
+                v-model="viewer.dither.value"
+                type="checkbox"
+                class="size-4 cursor-pointer accent-node-component-surface-highlight"
+              />
+              <label for="hdr-dither" class="cursor-pointer">
+                {{ $t('hdrViewer.dither') }}
+              </label>
+            </div>
+            <div class="flex items-center gap-2">
+              <input
+                id="hdr-clip"
+                v-model="viewer.clipWarnings.value"
+                type="checkbox"
+                class="size-4 cursor-pointer accent-node-component-surface-highlight"
+              />
+              <label for="hdr-clip" class="cursor-pointer">
+                {{ $t('hdrViewer.clipWarnings') }}
+              </label>
+            </div>
+          </div>
+
+          <div v-if="histogramPath" class="space-y-2 p-2">
+            <label>{{ $t('hdrViewer.histogram') }}</label>
+            <svg
+              viewBox="0 0 1 1"
+              preserveAspectRatio="none"
+              class="bg-base-component-surface aspect-3/2 w-full rounded-sm"
+            >
+              <path
+                :d="histogramPath"
+                :class="histogramColorClass"
+                fill="currentColor"
+                fill-opacity="0.5"
+                stroke="none"
+              />
+            </svg>
+          </div>
+
+          <div
+            v-if="viewer.stats.value"
+            class="space-y-1 p-2 text-xs tabular-nums"
+          >
+            <div v-if="viewer.dimensions.value" class="flex justify-between">
+              <span>{{ $t('hdrViewer.resolution') }}</span>
+              <span>{{ viewer.dimensions.value }}</span>
+            </div>
+            <div class="flex justify-between">
+              <span>{{ $t('hdrViewer.min') }}</span>
+              <span>{{ formatNum(viewer.stats.value.min) }}</span>
+            </div>
+            <div class="flex justify-between">
+              <span>{{ $t('hdrViewer.max') }}</span>
+              <span>{{ formatNum(viewer.stats.value.max) }}</span>
+            </div>
+            <div class="flex justify-between">
+              <span>{{ $t('hdrViewer.mean') }}</span>
+              <span>{{ formatNum(viewer.stats.value.mean) }}</span>
+            </div>
+            <div class="flex justify-between">
+              <span>{{ $t('hdrViewer.stdDev') }}</span>
+              <span>{{ formatNum(viewer.stats.value.stdDev) }}</span>
+            </div>
+            <div
+              v-if="viewer.stats.value.nanCount"
+              class="flex justify-between text-error"
+            >
+              <span>{{ $t('hdrViewer.nan') }}</span>
+              <span>{{ viewer.stats.value.nanCount }}</span>
+            </div>
+            <div
+              v-if="viewer.stats.value.infCount"
+              class="flex justify-between text-error"
+            >
+              <span>{{ $t('hdrViewer.inf') }}</span>
+              <span>{{ viewer.stats.value.infCount }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div class="p-4">
+        <div class="flex gap-2">
+          <Button variant="secondary" class="flex-1" @click="viewer.fitView">
+            {{ $t('hdrViewer.fitView') }}
+          </Button>
+          <Button variant="secondary" class="flex-1" @click="handleDownload">
+            {{ $t('g.downloadImage') }}
+          </Button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted, useTemplateRef } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import { downloadFile } from '@/base/common/downloadUtil'
+import Button from '@/components/ui/button/Button.vue'
+import type { ChannelMode } from '@/composables/useHdrViewer'
+import { CHANNEL_MODES, useHdrViewer } from '@/composables/useHdrViewer'
+import { GAMUT_NAMES } from '@/renderer/hdr/colorGamut'
+import { toFullResolutionUrl } from '@/utils/hdrFormatUtil'
+import { histogramToPath } from '@/utils/histogramUtil'
+
+const { imageUrl } = defineProps<{ imageUrl: string }>()
+
+const { t } = useI18n()
+const viewer = useHdrViewer()
+const gamutNames = GAMUT_NAMES
+const channelModes = CHANNEL_MODES
+const containerRef = useTemplateRef<HTMLDivElement>('containerRef')
+
+const exposureLabel = computed(() => {
+  const value = viewer.exposureStops.value
+  return `${value > 0 ? '+' : ''}${value.toFixed(1)}`
+})
+
+const histogramPath = computed(() =>
+  viewer.histogram.value ? histogramToPath(viewer.histogram.value) : ''
+)
+
+const histogramColorClass = computed(() => {
+  switch (viewer.channel.value) {
+    case 'r':
+      return 'text-red-500'
+    case 'g':
+      return 'text-green-500'
+    case 'b':
+      return 'text-blue-500'
+    default:
+      return 'text-base-foreground'
+  }
+})
+
+const channelLabels = computed<Record<ChannelMode, string>>(() => ({
+  rgb: t('hdrViewer.channels.rgb'),
+  r: t('hdrViewer.channels.r'),
+  g: t('hdrViewer.channels.g'),
+  b: t('hdrViewer.channels.b'),
+  a: t('hdrViewer.channels.a'),
+  luminance: t('hdrViewer.channels.luminance')
+}))
+
+function formatNum(value: number): string {
+  if (!Number.isFinite(value)) return String(value)
+  return Math.abs(value) >= 1000 || (value !== 0 && Math.abs(value) < 0.001)
+    ? value.toExponential(3)
+    : value.toFixed(4)
+}
+
+function handleDownload() {
+  downloadFile(toFullResolutionUrl(imageUrl))
+}
+
+onMounted(() => {
+  if (containerRef.value) void viewer.mount(containerRef.value, imageUrl)
+})
+</script>
diff --git a/src/components/palette/PaletteSwatchRow.test.ts b/src/components/palette/PaletteSwatchRow.test.ts
new file mode 100644
index 0000000000..45fdcb171d
--- /dev/null
+++ b/src/components/palette/PaletteSwatchRow.test.ts
@@ -0,0 +1,70 @@
+/* eslint-disable testing-library/no-container, testing-library/no-node-access, testing-library/prefer-user-event */
+import { fireEvent, render, screen } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { describe, expect, it } from 'vitest'
+import { createI18n } from 'vue-i18n'
+
+import PaletteSwatchRow from './PaletteSwatchRow.vue'
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages: { en: { palette: { swatchTitle: 'Edit', addColor: 'Add' } } }
+})
+
+function renderRow(modelValue: string[], max = 5) {
+  return render(PaletteSwatchRow, {
+    props: { modelValue, max },
+    global: { plugins: [i18n] }
+  })
+}
+
+const lastEmit = (emitted: () => Record<string, unknown[][]>) => {
+  const calls = emitted()['update:modelValue']
+  return calls[calls.length - 1][0]
+}
+
+describe('PaletteSwatchRow', () => {
+  it('renders one swatch per color', () => {
+    const { container } = renderRow(['#ff0000', '#00ff00'])
+    expect(container.querySelectorAll('[data-index]')).toHaveLength(2)
+  })
+
+  it('appends a color when the add button is clicked', async () => {
+    const { emitted } = renderRow(['#ff0000'])
+    await userEvent.click(screen.getByRole('button'))
+    expect(lastEmit(emitted)).toEqual(['#ff0000', '#ffffff'])
+  })
+
+  it('removes a color on right click', async () => {
+    const { container, emitted } = renderRow(['#ff0000', '#00ff00'])
+    await fireEvent.contextMenu(container.querySelector('[data-index="0"]')!)
+    expect(lastEmit(emitted)).toEqual(['#00ff00'])
+  })
+
+  it('hides the add button once the max is reached', () => {
+    renderRow(['#a', '#b'], 2)
+    expect(screen.queryByRole('button')).toBeNull()
+  })
+
+  it('writes a picked color back through the hidden color input', async () => {
+    const { container, emitted } = renderRow(['#ff0000', '#00ff00'])
+    await fireEvent.click(container.querySelector('[data-index="1"]')!)
+    const input = container.querySelector(
+      'input[type="color"]'
+    ) as HTMLInputElement
+    input.value = '#0000ff'
+    await fireEvent.input(input)
+    expect(lastEmit(emitted)).toEqual(['#ff0000', '#0000ff'])
+  })
+
+  it('starts a drag on pointer down without emitting', async () => {
+    const { container, emitted } = renderRow(['#ff0000', '#00ff00'])
+    await fireEvent.pointerDown(container.querySelector('[data-index="0"]')!, {
+      button: 0,
+      clientX: 5,
+      clientY: 5
+    })
+    expect(emitted()['update:modelValue']).toBeUndefined()
+  })
+})
diff --git a/src/components/palette/PaletteSwatchRow.vue b/src/components/palette/PaletteSwatchRow.vue
new file mode 100644
index 0000000000..f662ea00c3
--- /dev/null
+++ b/src/components/palette/PaletteSwatchRow.vue
@@ -0,0 +1,48 @@
+<template>
+  <div ref="container" class="flex flex-wrap items-center gap-1">
+    <div
+      v-for="(hex, i) in modelValue"
+      :key="`${i}-${hex}`"
+      :data-index="i"
+      :data-hex="hex"
+      class="relative size-5 cursor-pointer rounded-sm border border-component-node-border"
+      :style="{ background: hex }"
+      :title="t('palette.swatchTitle')"
+      @click="openPicker(i, $event)"
+      @contextmenu.prevent.stop="remove(i)"
+      @pointerdown="onPointerDown(i, $event)"
+    />
+    <button
+      v-if="modelValue.length < max"
+      type="button"
+      class="h-5 rounded-sm border border-component-node-border bg-component-node-widget-background px-2 text-xs leading-none"
+      :title="t('palette.addColor')"
+      @click="addColor"
+    >
+      +
+    </button>
+    <input
+      ref="picker"
+      type="color"
+      class="pointer-events-none absolute size-0 opacity-0"
+      @input="onPickerInput"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useTemplateRef } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import { usePaletteSwatchRow } from '@/composables/palette/usePaletteSwatchRow'
+
+const { max = 5 } = defineProps<{ max?: number }>()
+const modelValue = defineModel<string[]>({ required: true })
+const { t } = useI18n()
+
+const container = useTemplateRef<HTMLDivElement>('container')
+const picker = useTemplateRef<HTMLInputElement>('picker')
+
+const { openPicker, onPickerInput, remove, addColor, onPointerDown } =
+  usePaletteSwatchRow({ modelValue, container, picker })
+</script>
diff --git a/src/components/palette/WidgetColors.test.ts b/src/components/palette/WidgetColors.test.ts
new file mode 100644
index 0000000000..a9dff28a4c
--- /dev/null
+++ b/src/components/palette/WidgetColors.test.ts
@@ -0,0 +1,54 @@
+/* eslint-disable testing-library/no-node-access, testing-library/no-container, testing-library/prefer-user-event */
+import { fireEvent, render, screen } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { createI18n } from 'vue-i18n'
+
+import WidgetColors from './WidgetColors.vue'
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages: { en: { palette: { swatchTitle: 'Edit', addColor: 'Add' } } }
+})
+
+function renderWidget(modelValue: string[], widget?: { name: string }) {
+  return render(WidgetColors, {
+    props: { modelValue, widget },
+    global: { plugins: [i18n] }
+  })
+}
+
+const cleanups: Array<() => void> = []
+afterEach(() => {
+  while (cleanups.length) cleanups.pop()?.()
+})
+
+describe('WidgetColors', () => {
+  it('renders the palette swatch row for each color', () => {
+    renderWidget(['#ff0000', '#00ff00'])
+    const root = screen.getByTestId('colors')
+    expect(root.querySelectorAll('[data-index]')).toHaveLength(2)
+  })
+
+  it('shows the widget name as an inline label', () => {
+    renderWidget(['#ff0000'], { name: 'color_palette' })
+    expect(screen.getByText('color_palette')).toBeInTheDocument()
+  })
+
+  it('emits an updated palette when a color is added', async () => {
+    const { emitted } = renderWidget([])
+    await userEvent.click(screen.getByRole('button'))
+    const calls = emitted()['update:modelValue'] as unknown[][]
+    expect(calls[calls.length - 1][0]).toEqual(['#ffffff'])
+  })
+
+  it('does not stop swatch pointer moves from reaching document drag handlers', async () => {
+    const { container } = renderWidget(['#ff0000'])
+    const onDocMove = vi.fn()
+    document.addEventListener('pointermove', onDocMove)
+    cleanups.push(() => document.removeEventListener('pointermove', onDocMove))
+    await fireEvent.pointerMove(container.querySelector('[data-index="0"]')!)
+    expect(onDocMove).toHaveBeenCalled()
+  })
+})
diff --git a/src/components/palette/WidgetColors.vue b/src/components/palette/WidgetColors.vue
new file mode 100644
index 0000000000..9829000792
--- /dev/null
+++ b/src/components/palette/WidgetColors.vue
@@ -0,0 +1,29 @@
+<template>
+  <div
+    class="flex size-full items-center gap-2"
+    data-testid="colors"
+    @pointerdown.stop
+  >
+    <span
+      v-if="widget?.name"
+      class="shrink-0 truncate text-node-component-slot-text"
+    >
+      {{ widget.label || widget.name }}
+    </span>
+    <PaletteSwatchRow v-model="modelValue" :max="MAX_COLORS" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { SimplifiedWidget } from '@/types/simplifiedWidget'
+
+import PaletteSwatchRow from './PaletteSwatchRow.vue'
+
+const MAX_COLORS = 16
+
+const { widget } = defineProps<{
+  widget?: Pick<SimplifiedWidget<string[]>, 'name' | 'label'>
+}>()
+
+const modelValue = defineModel<string[]>({ default: () => [] })
+</script>
diff --git a/src/components/range/WidgetRange.test.ts b/src/components/range/WidgetRange.test.ts
index 770cb17483..f125525a56 100644
--- a/src/components/range/WidgetRange.test.ts
+++ b/src/components/range/WidgetRange.test.ts
@@ -1,4 +1,5 @@
 import { render, screen } from '@testing-library/vue'
+import { createNodeLocatorId } from '@/types/nodeIdentification'
 import userEvent from '@testing-library/user-event'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { defineComponent, ref } from 'vue'
@@ -165,7 +166,9 @@ describe('WidgetRange', () => {
       outputsHolder.nodeOutputs = {
         loc1: { histogram_range_w: [1, 2, 3, 4] }
       }
-      renderWidget(makeWidget({}, { nodeLocatorId: 'loc1' }))
+      renderWidget(
+        makeWidget({}, { nodeLocatorId: createNodeLocatorId(null, 'loc1') })
+      )
       expect(screen.getByTestId('range-editor').dataset.hasHistogram).toBe(
         'true'
       )
@@ -175,7 +178,9 @@ describe('WidgetRange', () => {
       outputsHolder.nodeOutputs = {
         loc1: { histogram_range_w: [] }
       }
-      renderWidget(makeWidget({}, { nodeLocatorId: 'loc1' }))
+      renderWidget(
+        makeWidget({}, { nodeLocatorId: createNodeLocatorId(null, 'loc1') })
+      )
       expect(screen.getByTestId('range-editor').dataset.hasHistogram).toBe(
         'false'
       )
diff --git a/src/components/rightSidePanel/errors/ErrorNodeCard.stories.ts b/src/components/rightSidePanel/errors/ErrorNodeCard.stories.ts
index 2490b087d8..814db6c9a9 100644
--- a/src/components/rightSidePanel/errors/ErrorNodeCard.stories.ts
+++ b/src/components/rightSidePanel/errors/ErrorNodeCard.stories.ts
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/vue3-vite'
 import ErrorNodeCard from './ErrorNodeCard.vue'
 import type { ErrorCardData } from './types'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
 
 const meta: Meta<typeof ErrorNodeCard> = {
   title: 'RightSidePanel/Errors/ErrorNodeCard',
@@ -23,7 +24,7 @@ type Story = StoryObj<typeof meta>
 const singleErrorCard: ErrorCardData = {
   id: 'node-10',
   title: 'CLIPTextEncode',
-  nodeId: '10',
+  nodeId: createNodeExecutionId([10]),
   nodeTitle: 'CLIP Text Encode (Prompt)',
   isSubgraphNode: false,
   errors: [
@@ -37,7 +38,7 @@ const singleErrorCard: ErrorCardData = {
 const multipleErrorsCard: ErrorCardData = {
   id: 'node-24',
   title: 'VAEDecode',
-  nodeId: '24',
+  nodeId: createNodeExecutionId([24]),
   nodeTitle: 'VAE Decode',
   isSubgraphNode: false,
   errors: [
@@ -55,7 +56,7 @@ const multipleErrorsCard: ErrorCardData = {
 const runtimeErrorCard: ErrorCardData = {
   id: 'exec-45',
   title: 'KSampler',
-  nodeId: '45',
+  nodeId: createNodeExecutionId([45]),
   nodeTitle: 'KSampler',
   isSubgraphNode: false,
   errors: [
@@ -75,7 +76,7 @@ const runtimeErrorCard: ErrorCardData = {
 const subgraphErrorCard: ErrorCardData = {
   id: 'node-3:15',
   title: 'KSampler',
-  nodeId: '3:15',
+  nodeId: createNodeExecutionId([3, 15]),
   nodeTitle: 'Nested KSampler',
   isSubgraphNode: true,
   errors: [
diff --git a/src/components/rightSidePanel/errors/ErrorNodeCard.test.ts b/src/components/rightSidePanel/errors/ErrorNodeCard.test.ts
index 88b0c9f610..db5d633529 100644
--- a/src/components/rightSidePanel/errors/ErrorNodeCard.test.ts
+++ b/src/components/rightSidePanel/errors/ErrorNodeCard.test.ts
@@ -6,6 +6,7 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
 import { createI18n } from 'vue-i18n'
 import ErrorNodeCard from './ErrorNodeCard.vue'
 import type { ErrorCardData } from './types'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
 
 const mockGetLogs = vi.fn(() => Promise.resolve('mock server logs'))
 const mockSerialize = vi.fn(() => ({ nodes: [] }))
@@ -156,7 +157,7 @@ describe('ErrorNodeCard.vue', () => {
     return {
       id: `exec-${++cardIdCounter}`,
       title: 'KSampler',
-      nodeId: '10',
+      nodeId: createNodeExecutionId([10]),
       nodeTitle: 'KSampler',
       errors: [
         {
@@ -249,7 +250,7 @@ describe('ErrorNodeCard.vue', () => {
     renderCard({
       id: `node-${++cardIdCounter}`,
       title: 'KSampler',
-      nodeId: '10',
+      nodeId: createNodeExecutionId([10]),
       nodeTitle: 'KSampler',
       errors: [
         {
@@ -387,7 +388,7 @@ describe('ErrorNodeCard.vue', () => {
     const card: ErrorCardData = {
       id: `exec-${++cardIdCounter}`,
       title: 'KSampler',
-      nodeId: '10',
+      nodeId: createNodeExecutionId([10]),
       nodeTitle: 'KSampler',
       errors: [
         {
diff --git a/src/components/rightSidePanel/errors/types.ts b/src/components/rightSidePanel/errors/types.ts
index 2fb9c04671..c9be86feed 100644
--- a/src/components/rightSidePanel/errors/types.ts
+++ b/src/components/rightSidePanel/errors/types.ts
@@ -1,4 +1,5 @@
 import type { ResolvedErrorMessage } from '@/platform/errorCatalog/types'
+import type { NodeExecutionId } from '@/types/nodeIdentification'
 
 export interface ErrorItem extends ResolvedErrorMessage {
   /** Raw source/API-compatible message. */
@@ -12,7 +13,7 @@ export interface ErrorItem extends ResolvedErrorMessage {
 export interface ErrorCardData {
   id: string
   title: string
-  nodeId?: string
+  nodeId?: NodeExecutionId
   nodeTitle?: string
   graphNodeId?: string
   isSubgraphNode?: boolean
diff --git a/src/components/rightSidePanel/errors/useErrorGroups.test.ts b/src/components/rightSidePanel/errors/useErrorGroups.test.ts
index 5fe0af1a8f..444e04a1df 100644
--- a/src/components/rightSidePanel/errors/useErrorGroups.test.ts
+++ b/src/components/rightSidePanel/errors/useErrorGroups.test.ts
@@ -671,6 +671,30 @@ describe('useErrorGroups', () => {
       expect(nodeIds).toEqual(['1', '2', '10'])
     })
 
+    it('marks only nested execution paths as subgraph node cards', async () => {
+      const { store, groups } = createErrorGroups()
+      store.lastNodeErrors = {
+        '1': {
+          class_type: 'KSampler',
+          dependent_outputs: [],
+          errors: [{ type: 'err', message: 'Error', details: '' }]
+        },
+        '1:20': {
+          class_type: 'KSampler',
+          dependent_outputs: [],
+          errors: [{ type: 'err', message: 'Error', details: '' }]
+        }
+      }
+      await nextTick()
+
+      const execGroup = groups.allErrorGroups.value.find(
+        (g) => g.type === 'execution'
+      )
+      expect(execGroup?.cards).toMatchObject([
+        { nodeId: '1', isSubgraphNode: false },
+        { nodeId: '1:20', isSubgraphNode: true }
+      ])
+    })
     it('sorts cards with subpath nodeIds before higher root IDs', async () => {
       const { store, groups } = createErrorGroups()
       store.lastNodeErrors = {
diff --git a/src/components/rightSidePanel/errors/useErrorGroups.ts b/src/components/rightSidePanel/errors/useErrorGroups.ts
index 54dacfe237..38950835c4 100644
--- a/src/components/rightSidePanel/errors/useErrorGroups.ts
+++ b/src/components/rightSidePanel/errors/useErrorGroups.ts
@@ -39,8 +39,8 @@ import {
   resolveRunErrorMessage
 } from '@/platform/errorCatalog/errorMessageResolver'
 import {
-  isNodeExecutionId,
-  compareExecutionId
+  compareExecutionId,
+  tryNormalizeNodeExecutionId
 } from '@/types/nodeIdentification'
 
 const PROMPT_CARD_ID = '__prompt__'
@@ -82,7 +82,7 @@ interface ErrorSearchItem {
 type CataloguedErrorItem = ErrorItem & ResolvedCatalogErrorMessage
 
 /** Resolve display info for a node by its execution ID. */
-function resolveNodeInfo(nodeId: string) {
+function resolveNodeInfo(nodeId: NodeExecutionId) {
   const graphNode = getNodeByExecutionId(app.rootGraph, nodeId)
 
   return {
@@ -119,7 +119,7 @@ function getOrCreateGroup(
 }
 
 function createErrorCard(
-  nodeId: string,
+  nodeId: NodeExecutionId,
   classType: string,
   idPrefix: string
 ): ErrorCardData {
@@ -130,7 +130,7 @@ function createErrorCard(
     nodeId,
     nodeTitle: nodeInfo.title,
     graphNodeId: nodeInfo.graphNodeId,
-    isSubgraphNode: isNodeExecutionId(nodeId),
+    isSubgraphNode: nodeId.includes(':'),
     errors: []
   }
 }
@@ -288,7 +288,7 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
     return map
   })
 
-  function isErrorInSelection(executionNodeId: string): boolean {
+  function isErrorInSelection(executionNodeId: NodeExecutionId): boolean {
     const nodeIds = selectedNodeInfo.value.nodeIds
     if (!nodeIds) return true
 
@@ -305,7 +305,7 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
 
   function addNodeErrorToGroup(
     groupsMap: Map<string, GroupEntry>,
-    nodeId: string,
+    nodeId: NodeExecutionId,
     classType: string,
     idPrefix: string,
     error: CataloguedErrorItem,
@@ -371,9 +371,11 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
   ) {
     if (!executionErrorStore.lastNodeErrors) return
 
-    for (const [nodeId, nodeError] of Object.entries(
+    for (const [rawNodeId, nodeError] of Object.entries(
       executionErrorStore.lastNodeErrors
     )) {
+      const nodeId = tryNormalizeNodeExecutionId(rawNodeId)
+      if (!nodeId) continue
       const nodeDisplayName =
         resolveNodeInfo(nodeId).title || nodeError.class_type
       for (const e of nodeError.errors) {
@@ -404,9 +406,12 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
     if (!executionErrorStore.lastExecutionError) return
 
     const e = executionErrorStore.lastExecutionError
+    const nodeId = tryNormalizeNodeExecutionId(e.node_id)
+    if (!nodeId) return
+
     addNodeErrorToGroup(
       groupsMap,
-      String(e.node_id),
+      nodeId,
       e.node_type,
       'exec',
       {
@@ -417,8 +422,7 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
         ...resolveRunErrorMessage({
           kind: 'execution',
           error: e,
-          nodeDisplayName:
-            resolveNodeInfo(String(e.node_id)).title || e.node_type
+          nodeDisplayName: resolveNodeInfo(nodeId).title || e.node_type
         })
       },
       filterBySelection
@@ -669,7 +673,7 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
     ]
   }
 
-  function isAssetErrorInSelection(executionNodeId: string): boolean {
+  function isAssetErrorInSelection(executionNodeId: NodeExecutionId): boolean {
     const nodeIds = selectedNodeInfo.value.nodeIds
     if (!nodeIds) return true
 
@@ -691,12 +695,17 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
     return false
   }
 
+  function isAssetCandidateInSelection(nodeId: string | number): boolean {
+    const executionNodeId = tryNormalizeNodeExecutionId(nodeId)
+    return executionNodeId ? isAssetErrorInSelection(executionNodeId) : false
+  }
+
   const filteredMissingModelGroups = computed(() => {
     if (!selectedNodeInfo.value.nodeIds) return missingModelGroups.value
     const candidates = missingModelStore.missingModelCandidates
     if (!candidates?.length) return []
     const filtered = candidates.filter(
-      (c) => c.nodeId != null && isAssetErrorInSelection(String(c.nodeId))
+      (c) => c.nodeId != null && isAssetCandidateInSelection(c.nodeId)
     )
     if (!filtered.length) return []
     return groupMissingModelCandidates(filtered, isCloud)
@@ -707,7 +716,7 @@ export function useErrorGroups(searchQuery: MaybeRefOrGetter<string>) {
     const candidates = missingMediaStore.missingMediaCandidates
     if (!candidates?.length) return []
     const filtered = candidates.filter(
-      (c) => c.nodeId != null && isAssetErrorInSelection(String(c.nodeId))
+      (c) => c.nodeId != null && isAssetCandidateInSelection(c.nodeId)
     )
     if (!filtered.length) return []
     return groupCandidatesByMediaType(filtered)
diff --git a/src/components/rightSidePanel/errors/useErrorReport.test.ts b/src/components/rightSidePanel/errors/useErrorReport.test.ts
index 1eac1febd9..8554bfa9c4 100644
--- a/src/components/rightSidePanel/errors/useErrorReport.test.ts
+++ b/src/components/rightSidePanel/errors/useErrorReport.test.ts
@@ -4,6 +4,7 @@ import { nextTick, ref } from 'vue'
 import type { useSystemStatsStore } from '@/stores/systemStatsStore'
 
 import type { ErrorCardData } from './types'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
 import { useErrorReport } from './useErrorReport'
 
 async function flushPromises() {
@@ -103,7 +104,7 @@ function makeCard(overrides: Partial<ErrorCardData> = {}): ErrorCardData {
   return {
     id: 'card-1',
     title: 'KSampler',
-    nodeId: '42',
+    nodeId: createNodeExecutionId([42]),
     errors: [],
     ...overrides
   }
@@ -181,7 +182,7 @@ describe('useErrorReport', () => {
       exceptionType: 'RuntimeError',
       exceptionMessage: 'CUDA oom',
       traceback: 'trace-0',
-      nodeId: '42',
+      nodeId: createNodeExecutionId([42]),
       nodeType: 'KSampler',
       systemStats: sampleSystemStats,
       serverLogs: 'server logs',
diff --git a/src/components/sidebar/SidebarIcon.test.ts b/src/components/sidebar/SidebarIcon.test.ts
index dcc025d5a3..ad96e0816f 100644
--- a/src/components/sidebar/SidebarIcon.test.ts
+++ b/src/components/sidebar/SidebarIcon.test.ts
@@ -3,17 +3,12 @@ import userEvent from '@testing-library/user-event'
 import PrimeVue from 'primevue/config'
 import Tooltip from 'primevue/tooltip'
 import { describe, expect, it } from 'vitest'
+import type { ComponentProps } from 'vue-component-type-helpers'
 import { createI18n } from 'vue-i18n'
 
 import SidebarIcon from './SidebarIcon.vue'
 
-type SidebarIconProps = {
-  icon: string
-  selected: boolean
-  tooltip?: string
-  class?: string
-  iconBadge?: string | (() => string | null)
-}
+type SidebarIconProps = ComponentProps<typeof SidebarIcon>
 
 const i18n = createI18n({
   legacy: false,
@@ -84,4 +79,20 @@ describe('SidebarIcon', () => {
       tooltipText
     )
   })
+
+  it('falls back to label for tooltip when no tooltip is provided', async () => {
+    const labelText = 'WASNodeSuitePreprocessors'
+    const { user } = renderSidebarIcon({ label: labelText })
+
+    expect(screen.getByRole('button')).toHaveAttribute('aria-label', labelText)
+
+    await user.hover(screen.getByRole('button'))
+
+    await waitFor(
+      () => {
+        expect(screen.getByRole('tooltip')).toHaveTextContent(labelText)
+      },
+      { timeout: 1000 }
+    )
+  })
 })
diff --git a/src/components/sidebar/SidebarIcon.vue b/src/components/sidebar/SidebarIcon.vue
index beabc9fab7..2897642dc4 100644
--- a/src/components/sidebar/SidebarIcon.vue
+++ b/src/components/sidebar/SidebarIcon.vue
@@ -40,9 +40,11 @@
           </span>
         </div>
       </slot>
+      <!-- w-max sizes the label to the rail instead of the padding-inset
+           button content box, which is too narrow for one-line labels -->
       <span
         v-if="label && !isSmall"
-        class="side-bar-button-label text-center text-2xs"
+        class="side-bar-button-label line-clamp-2 w-max max-w-[calc(var(--sidebar-width)-var(--sidebar-padding))] text-center text-2xs wrap-break-word whitespace-normal"
         >{{ st(label, label) }}</span
       >
     </div>
@@ -83,7 +85,14 @@ const overlayValue = computed(() =>
   typeof iconBadge === 'function' ? (iconBadge() ?? '') : iconBadge
 )
 const shouldShowBadge = computed(() => !!overlayValue.value)
-const computedTooltip = computed(() => st(tooltip, tooltip) + tooltipSuffix)
+/**
+ * Falls back to the label when no tooltip is provided, so labels clamped
+ * to two lines can always be recovered in full on hover.
+ */
+const computedTooltip = computed(() => {
+  const text = tooltip || label
+  return st(text, text) + tooltipSuffix
+})
 </script>
 
 <style>
diff --git a/src/components/sidebar/tabs/AssetsSidebarTab.vue b/src/components/sidebar/tabs/AssetsSidebarTab.vue
index b5176d1033..e30e8b7725 100644
--- a/src/components/sidebar/tabs/AssetsSidebarTab.vue
+++ b/src/components/sidebar/tabs/AssetsSidebarTab.vue
@@ -115,69 +115,14 @@
       </div>
     </template>
     <template #footer>
-      <div
+      <MediaAssetSelectionBar
         v-if="hasSelection"
-        ref="footerRef"
-        class="flex h-18 w-full items-center justify-between gap-1"
-      >
-        <div class="flex-1 pl-4">
-          <div ref="selectionCountButtonRef" class="inline-flex w-48">
-            <Button
-              variant="secondary"
-              :class="cn(isCompact && 'text-left')"
-              @click="handleDeselectAll"
-            >
-              {{
-                isHoveringSelectionCount
-                  ? $t('mediaAsset.selection.deselectAll')
-                  : $t('mediaAsset.selection.selectedCount', {
-                      count: totalOutputCount
-                    })
-              }}
-            </Button>
-          </div>
-        </div>
-        <div class="flex shrink items-center-safe justify-end-safe gap-2 pr-4">
-          <template v-if="isCompact">
-            <!-- Compact mode: Icon only -->
-            <Button
-              v-if="shouldShowDeleteButton"
-              size="icon"
-              data-testid="assets-delete-selected"
-              @click="handleDeleteSelected"
-            >
-              <i class="icon-[lucide--trash-2] size-4" />
-            </Button>
-            <Button
-              size="icon"
-              data-testid="assets-download-selected"
-              @click="handleDownloadSelected"
-            >
-              <i class="icon-[lucide--download] size-4" />
-            </Button>
-          </template>
-          <template v-else>
-            <!-- Normal mode: Icon + Text -->
-            <Button
-              v-if="shouldShowDeleteButton"
-              variant="secondary"
-              data-testid="assets-delete-selected"
-              @click="handleDeleteSelected"
-            >
-              <span>{{ $t('mediaAsset.selection.deleteSelected') }}</span>
-              <i class="icon-[lucide--trash-2] size-4" />
-            </Button>
-            <Button
-              variant="secondary"
-              data-testid="assets-download-selected"
-              @click="handleDownloadSelected"
-            >
-              <span>{{ $t('mediaAsset.selection.downloadSelected') }}</span>
-              <i class="icon-[lucide--download] size-4" />
-            </Button>
-          </template>
-        </div>
-      </div>
+        :count="totalOutputCount"
+        :show-delete="shouldShowDeleteButton"
+        @deselect="handleDeselectAll"
+        @download="handleDownloadSelected"
+        @delete="handleDeleteSelected"
+      />
     </template>
   </SidebarTabTemplate>
   <MediaLightbox
@@ -208,8 +153,6 @@
 import {
   useAsyncState,
   useDebounceFn,
-  useElementHover,
-  useResizeObserver,
   useStorage,
   useTimeoutFn
 } from '@vueuse/core'
@@ -236,6 +179,7 @@ import TabList from '@/components/tab/TabList.vue'
 import Button from '@/components/ui/button/Button.vue'
 import MediaAssetContextMenu from '@/platform/assets/components/MediaAssetContextMenu.vue'
 import MediaAssetFilterBar from '@/platform/assets/components/MediaAssetFilterBar.vue'
+import MediaAssetSelectionBar from '@/platform/assets/components/MediaAssetSelectionBar.vue'
 import { getAssetType } from '@/platform/assets/composables/media/assetMappers'
 import { useAssetsApi } from '@/platform/assets/composables/media/useAssetsApi'
 import { useAssetSelection } from '@/platform/assets/composables/useAssetSelection'
@@ -257,7 +201,6 @@ import {
   getMediaTypeFromFilename,
   isPreviewableMediaType
 } from '@/utils/formatUtil'
-import { cn } from '@comfyorg/tailwind-utils'
 
 const Load3dViewerContent = defineAsyncComponent(
   () => import('@/components/load3d/Load3dViewerContent.vue')
@@ -335,33 +278,6 @@ const {
   exportMultipleWorkflows
 } = useMediaAssetActions()
 
-// Footer responsive behavior
-const footerRef = ref<HTMLElement | null>(null)
-const footerWidth = ref(0)
-
-// Track footer width changes
-useResizeObserver(footerRef, (entries) => {
-  const entry = entries[0]
-  footerWidth.value = entry.contentRect.width
-})
-
-// Determine if we should show compact mode (icon only)
-// Threshold matches when grid switches from 2 columns to 1 column
-// 2 columns need about ~430px
-const COMPACT_MODE_THRESHOLD_PX = 430
-const isCompact = computed(
-  () => footerWidth.value > 0 && footerWidth.value <= COMPACT_MODE_THRESHOLD_PX
-)
-
-// Hover state for selection count button
-const selectionCountButtonRef = ref<HTMLElement | null>(null)
-const isHoveringSelectionCount = useElementHover(selectionCountButtonRef)
-
-// Total output count for all selected assets
-const totalOutputCount = computed(() => {
-  return getTotalOutputCount(selectedAssets.value)
-})
-
 const currentAssets = computed(() =>
   activeTab.value === 'input' ? inputAssets : outputAssets
 )
@@ -429,6 +345,10 @@ const previewableVisibleAssets = computed(() =>
 
 const selectedAssets = computed(() => getSelectedAssets(visibleAssets.value))
 
+const totalOutputCount = computed(() =>
+  getTotalOutputCount(selectedAssets.value)
+)
+
 const isBulkMode = computed(
   () => hasSelection.value && selectedAssets.value.length > 1
 )
diff --git a/src/components/sidebar/tabs/ModelLibrarySidebarTab.test.ts b/src/components/sidebar/tabs/ModelLibrarySidebarTab.test.ts
index f92aa0caa1..f23283138d 100644
--- a/src/components/sidebar/tabs/ModelLibrarySidebarTab.test.ts
+++ b/src/components/sidebar/tabs/ModelLibrarySidebarTab.test.ts
@@ -14,7 +14,7 @@ const {
   captureRoot,
   getRoot,
   resetRoot,
-  mockAddNodeOnGraph,
+  mockStartDrag,
   mockGetNodeProvider,
   mockToggleNodeOnEvent,
   mockRefreshModelFolder,
@@ -29,7 +29,7 @@ const {
     resetRoot: () => {
       capturedRoot = null
     },
-    mockAddNodeOnGraph: vi.fn(),
+    mockStartDrag: vi.fn(),
     mockGetNodeProvider: vi.fn(),
     mockToggleNodeOnEvent: vi.fn(),
     mockRefreshModelFolder: vi.fn().mockResolvedValue(undefined),
@@ -37,8 +37,8 @@ const {
   }
 })
 
-vi.mock('@/services/litegraphService', () => ({
-  useLitegraphService: () => ({ addNodeOnGraph: mockAddNodeOnGraph })
+vi.mock('@/composables/node/useNodeDragToCanvas', () => ({
+  useNodeDragToCanvas: () => ({ startDrag: mockStartDrag })
 }))
 
 vi.mock('@/stores/modelToNodeStore', () => ({
@@ -173,16 +173,13 @@ describe('ModelLibrarySidebarTab', () => {
     expect(screen.getByTestId('search-input')).toBeInTheDocument()
   })
 
-  it('handles model click and adds node to graph', async () => {
+  it('starts a ghost drag carrying the widget value to fill on placement', async () => {
     const mockNodeDef = { name: 'CheckpointLoaderSimple' }
-    const mockWidget = { name: 'ckpt_name', value: '' }
-    const mockGraphNode = { widgets: [mockWidget] }
 
     mockGetNodeProvider.mockReturnValue({
       nodeDef: mockNodeDef,
       key: 'ckpt_name'
     })
-    mockAddNodeOnGraph.mockReturnValue(mockGraphNode)
 
     renderComponent()
     await nextTick()
@@ -198,8 +195,10 @@ describe('ModelLibrarySidebarTab', () => {
     await modelLeaf?.handleClick?.(mockEvent)
 
     expect(mockGetNodeProvider).toHaveBeenCalledWith('checkpoints')
-    expect(mockAddNodeOnGraph).toHaveBeenCalledWith(mockNodeDef)
-    expect(mockWidget.value).toBe('model.safetensors')
+    expect(mockStartDrag).toHaveBeenCalledWith(mockNodeDef, {
+      widgetValues: { ckpt_name: 'model.safetensors' },
+      source: 'sidebar_drag'
+    })
   })
 
   it('toggles folder expansion on click', async () => {
diff --git a/src/components/sidebar/tabs/ModelLibrarySidebarTab.vue b/src/components/sidebar/tabs/ModelLibrarySidebarTab.vue
index aa880987b9..7487e85456 100644
--- a/src/components/sidebar/tabs/ModelLibrarySidebarTab.vue
+++ b/src/components/sidebar/tabs/ModelLibrarySidebarTab.vue
@@ -63,10 +63,9 @@ import SidebarTabTemplate from '@/components/sidebar/tabs/SidebarTabTemplate.vue
 import ElectronDownloadItems from '@/components/sidebar/tabs/modelLibrary/ElectronDownloadItems.vue'
 import ModelTreeLeaf from '@/components/sidebar/tabs/modelLibrary/ModelTreeLeaf.vue'
 import Button from '@/components/ui/button/Button.vue'
+import { startModelLoaderDrag } from '@/composables/node/startModelNodeDragFromAsset'
 import { useTreeExpansion } from '@/composables/useTreeExpansion'
 import { useSettingStore } from '@/platform/settings/settingStore'
-import { withNodeAddSource } from '@/platform/telemetry/nodeAdded/nodeAddSource'
-import { useLitegraphService } from '@/services/litegraphService'
 import { useAssetDownloadStore } from '@/stores/assetDownloadStore'
 import type { ComfyModelDef, ModelFolder } from '@/stores/modelStore'
 import { ResourceState, useModelStore } from '@/stores/modelStore'
@@ -156,15 +155,7 @@ const renderedRoot = computed<TreeExplorerNode<ModelOrFolder>>(() => {
         if (this.leaf && model) {
           const provider = modelToNodeStore.getNodeProvider(model.directory)
           if (provider) {
-            const graphNode = withNodeAddSource('sidebar_drag', () =>
-              useLitegraphService().addNodeOnGraph(provider.nodeDef)
-            )
-            const widget = graphNode?.widgets?.find(
-              (widget) => widget.name === provider.key
-            )
-            if (widget) {
-              widget.value = model.file_name
-            }
+            startModelLoaderDrag(provider, model.file_name)
           }
         } else {
           toggleNodeOnEvent(e, node)
diff --git a/src/components/sidebar/tabs/NodeLibrarySidebarTabV2.test.ts b/src/components/sidebar/tabs/NodeLibrarySidebarTabV2.test.ts
index 77360d4454..73218e47f0 100644
--- a/src/components/sidebar/tabs/NodeLibrarySidebarTabV2.test.ts
+++ b/src/components/sidebar/tabs/NodeLibrarySidebarTabV2.test.ts
@@ -31,11 +31,8 @@ vi.mock('@/composables/node/useNodeDragToCanvas', () => ({
   useNodeDragToCanvas: () => ({
     isDragging: { value: false },
     draggedNode: { value: null },
-    cursorPosition: { value: { x: 0, y: 0 } },
     startDrag: vi.fn(),
-    cancelDrag: vi.fn(),
-    setupGlobalListeners: vi.fn(),
-    cleanupGlobalListeners: vi.fn()
+    cancelDrag: vi.fn()
   })
 }))
 
diff --git a/src/components/sidebar/tabs/NodeLibrarySidebarTabV2.vue b/src/components/sidebar/tabs/NodeLibrarySidebarTabV2.vue
index d0749128a6..c1bc59546c 100644
--- a/src/components/sidebar/tabs/NodeLibrarySidebarTabV2.vue
+++ b/src/components/sidebar/tabs/NodeLibrarySidebarTabV2.vue
@@ -115,7 +115,6 @@
       </div>
     </template>
     <template #body>
-      <NodeDragPreview />
       <div class="flex h-full flex-col">
         <div
           v-if="hasNoMatches"
@@ -215,7 +214,6 @@ import type {
 import AllNodesPanel from './nodeLibrary/AllNodesPanel.vue'
 import BlueprintsPanel from './nodeLibrary/BlueprintsPanel.vue'
 import EssentialNodesPanel from './nodeLibrary/EssentialNodesPanel.vue'
-import NodeDragPreview from './nodeLibrary/NodeDragPreview.vue'
 import SidebarTabTemplate from './SidebarTabTemplate.vue'
 
 const { flags } = useFeatureFlags()
diff --git a/src/components/sidebar/tabs/nodeLibrary/NodeDragPreview.vue b/src/components/sidebar/tabs/nodeLibrary/NodeDragPreview.vue
deleted file mode 100644
index f4a22b1726..0000000000
--- a/src/components/sidebar/tabs/nodeLibrary/NodeDragPreview.vue
+++ /dev/null
@@ -1,69 +0,0 @@
-<template>
-  <Teleport to="body">
-    <div
-      v-if="isDragging && draggedNode && showPreview"
-      class="pointer-events-none fixed z-10000"
-      :style="{
-        left: `${previewPosition.x + 12}px`,
-        top: `${previewPosition.y + 12}px`
-      }"
-    >
-      <div class="origin-top-left scale-50 opacity-80">
-        <LGraphNodePreview :node-def="draggedNode" position="relative" />
-      </div>
-    </div>
-  </Teleport>
-</template>
-
-<script setup lang="ts">
-import { computed, onMounted, onUnmounted, ref } from 'vue'
-
-import { useNodeDragToCanvas } from '@/composables/node/useNodeDragToCanvas'
-import LGraphNodePreview from '@/renderer/extensions/vueNodes/components/LGraphNodePreview.vue'
-
-const {
-  isDragging,
-  draggedNode,
-  cursorPosition,
-  dragMode,
-  setupGlobalListeners,
-  cleanupGlobalListeners
-} = useNodeDragToCanvas()
-
-const nativeDragPosition = ref({ x: 0, y: 0 })
-
-const previewPosition = computed(() => {
-  if (dragMode.value === 'native') {
-    return nativeDragPosition.value
-  }
-  return cursorPosition.value
-})
-
-const showPreview = computed(() => {
-  if (dragMode.value === 'native') {
-    return nativeDragPosition.value.x > 0 || nativeDragPosition.value.y > 0
-  }
-  return true
-})
-
-function handleDrag(e: DragEvent) {
-  if (e.clientX === 0 && e.clientY === 0) return
-  nativeDragPosition.value = { x: e.clientX, y: e.clientY }
-}
-
-function handleDragEnd() {
-  nativeDragPosition.value = { x: 0, y: 0 }
-}
-
-onMounted(() => {
-  setupGlobalListeners()
-  document.addEventListener('drag', handleDrag)
-  document.addEventListener('dragend', handleDragEnd)
-})
-
-onUnmounted(() => {
-  cleanupGlobalListeners()
-  document.removeEventListener('drag', handleDrag)
-  document.removeEventListener('dragend', handleDragEnd)
-})
-</script>
diff --git a/src/components/ui/credit-slider/CreditSlider.stories.ts b/src/components/ui/credit-slider/CreditSlider.stories.ts
new file mode 100644
index 0000000000..dc7b9d1071
--- /dev/null
+++ b/src/components/ui/credit-slider/CreditSlider.stories.ts
@@ -0,0 +1,110 @@
+import type { Meta, StoryObj } from '@storybook/vue3-vite'
+import { ref } from 'vue'
+
+import CreditSlider from './CreditSlider.vue'
+
+const meta: Meta<typeof CreditSlider> = {
+  title: 'Components/CreditSlider',
+  component: CreditSlider,
+  tags: ['autodocs'],
+  parameters: { layout: 'centered' },
+  argTypes: {
+    disabled: { control: 'boolean' }
+  },
+  args: {
+    disabled: false
+  },
+  decorators: [
+    (story) => ({
+      components: { story },
+      // Previews at the real layout width: the Figma "Team Plan" card column is
+      // 512px wide with 32px padding (DES-197), i.e. a 448px content area — the
+      // width the slider actually renders into inside PricingTableWorkspace.
+      template: '<div class="w-[512px] px-8"><story /></div>'
+    })
+  ]
+}
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+export const Default: Story = {
+  render: (args) => ({
+    components: { CreditSlider },
+    setup() {
+      const value = ref(700)
+      return { args, value }
+    },
+    template: '<CreditSlider v-model="value" :disabled="args.disabled" />'
+  })
+}
+
+export const Disabled: Story = {
+  args: { disabled: true },
+  render: (args) => ({
+    components: { CreditSlider },
+    setup() {
+      const value = ref(700)
+      return { args, value }
+    },
+    template: '<CreditSlider v-model="value" :disabled="args.disabled" />'
+  })
+}
+
+// Sample `GET /api/billing/plans → team_credit_stops` payload (DES-197 yearly).
+// In production this comes from the API; here it shows the stops being driven
+// entirely through props rather than the hardcoded default constant.
+const apiTeamCreditStops = {
+  default_stop_index: 2,
+  stops: [
+    {
+      id: 'team_200',
+      credits: 42_200,
+      yearly: { price_cents: 20_000, discount_percent: 0 }
+    },
+    {
+      id: 'team_400',
+      credits: 84_400,
+      yearly: { price_cents: 38_000, discount_percent: 5 }
+    },
+    {
+      id: 'team_700',
+      credits: 147_700,
+      yearly: { price_cents: 63_000, discount_percent: 10 }
+    },
+    {
+      id: 'team_1400',
+      credits: 295_400,
+      yearly: { price_cents: 119_000, discount_percent: 15 }
+    },
+    {
+      id: 'team_2500',
+      credits: 527_500,
+      yearly: { price_cents: 200_000, discount_percent: 20 }
+    }
+  ]
+}
+
+// Reference adapter (FE-934 will own this in the data layer): API → CreditStop[].
+// The pre-discount list price is recovered as discounted / (1 - discount).
+const mappedStops = apiTeamCreditStops.stops.map((s) => ({
+  credits: s.credits,
+  discountPercentYearly: s.yearly.discount_percent,
+  usd: Math.round(
+    s.yearly.price_cents / 100 / (1 - s.yearly.discount_percent / 100)
+  )
+}))
+
+export const BackendDrivenStops: Story = {
+  name: 'Backend-driven stops (props)',
+  render: (args) => ({
+    components: { CreditSlider },
+    setup() {
+      const defaultStopIndex = apiTeamCreditStops.default_stop_index
+      const value = ref(mappedStops[defaultStopIndex].usd)
+      return { args, value, mappedStops, defaultStopIndex }
+    },
+    template:
+      '<CreditSlider v-model="value" :stops="mappedStops" :default-stop-index="defaultStopIndex" :disabled="args.disabled" />'
+  })
+}
diff --git a/src/components/ui/credit-slider/CreditSlider.test.ts b/src/components/ui/credit-slider/CreditSlider.test.ts
new file mode 100644
index 0000000000..f32564e53e
--- /dev/null
+++ b/src/components/ui/credit-slider/CreditSlider.test.ts
@@ -0,0 +1,208 @@
+import { render, screen, within } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { describe, expect, it, vi } from 'vitest'
+import { nextTick } from 'vue'
+import { createI18n } from 'vue-i18n'
+
+import { usdToCredits } from '@/base/credits/comfyCredits'
+import { TEAM_PLAN_CREDIT_STOPS } from '@/platform/cloud/subscription/constants/teamPlanCreditStops'
+
+import CreditSlider from './CreditSlider.vue'
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages: {
+    en: {
+      subscription: {
+        usdPerMonth: 'USD / mo',
+        billedYearly: '{total} Billed yearly',
+        billedMonthly: 'Billed monthly',
+        creditSliderSave: 'Save {percent}% ({amount})'
+      }
+    }
+  }
+})
+
+function renderSlider(props: Record<string, unknown> = {}) {
+  return render(CreditSlider, { props, global: { plugins: [i18n] } })
+}
+
+async function flush() {
+  await nextTick()
+  await nextTick()
+}
+
+describe('CreditSlider', () => {
+  it('defaults to the $700 stop (index 2) when no value is bound', async () => {
+    renderSlider()
+    await flush()
+
+    const thumb = screen.getByRole('slider')
+    expect(thumb).toHaveAttribute('aria-valuemin', '0')
+    expect(thumb).toHaveAttribute('aria-valuemax', '4')
+    expect(thumb).toHaveAttribute('aria-valuenow', '2')
+  })
+
+  it('snaps to the next fixed stop on ArrowRight (never a value in between)', async () => {
+    const user = userEvent.setup()
+    const onUpdate = vi.fn<(usd: number) => void>()
+
+    renderSlider({ modelValue: 700, 'onUpdate:modelValue': onUpdate })
+    await flush()
+
+    screen.getByRole('slider').focus()
+    await user.keyboard('{ArrowRight}')
+
+    expect(onUpdate).toHaveBeenCalledWith(1400)
+  })
+
+  it('snaps to the previous fixed stop on ArrowLeft', async () => {
+    const user = userEvent.setup()
+    const onUpdate = vi.fn<(usd: number) => void>()
+
+    renderSlider({ modelValue: 700, 'onUpdate:modelValue': onUpdate })
+    await flush()
+
+    screen.getByRole('slider').focus()
+    await user.keyboard('{ArrowLeft}')
+
+    expect(onUpdate).toHaveBeenCalledWith(400)
+  })
+
+  it('emits change with the full {index, usd, credits} payload', async () => {
+    const user = userEvent.setup()
+    const onChange = vi.fn()
+
+    renderSlider({ modelValue: 700, onChange })
+    await flush()
+
+    screen.getByRole('slider').focus()
+    await user.keyboard('{ArrowRight}')
+
+    expect(onChange).toHaveBeenCalledWith({
+      index: 3,
+      usd: 1400,
+      credits: 295_400
+    })
+  })
+
+  it('emits nothing when disabled (keyboard interaction suppressed)', async () => {
+    const user = userEvent.setup()
+    const onUpdate = vi.fn<(usd: number) => void>()
+    const onChange = vi.fn()
+
+    renderSlider({
+      modelValue: 700,
+      disabled: true,
+      'onUpdate:modelValue': onUpdate,
+      onChange
+    })
+    await flush()
+
+    screen.getByRole('slider').focus()
+    await user.keyboard('{ArrowRight}')
+
+    expect(onUpdate).not.toHaveBeenCalled()
+    expect(onChange).not.toHaveBeenCalled()
+  })
+
+  it('shows the discounted price, struck original, save badge and yearly total (DES-197)', async () => {
+    renderSlider() // default $700 stop → 10% yearly discount
+    await flush()
+
+    expect(screen.getByTestId('credit-slider-price')).toHaveTextContent('$630')
+    expect(
+      screen.getByTestId('credit-slider-original-price')
+    ).toHaveTextContent('$700')
+    expect(screen.getByTestId('credit-slider-save')).toHaveTextContent(
+      'Save 10% ($70)'
+    )
+    expect(screen.getByTestId('credit-slider-billed-yearly')).toHaveTextContent(
+      '$7,560'
+    )
+  })
+
+  it('halves the discount and reads "billed monthly" when cycle=monthly (PRD)', async () => {
+    renderSlider({ cycle: 'monthly' }) // default $700 stop → 10% yearly → 5% monthly
+    await flush()
+
+    expect(screen.getByTestId('credit-slider-price')).toHaveTextContent('$665')
+    expect(
+      screen.getByTestId('credit-slider-original-price')
+    ).toHaveTextContent('$700')
+    expect(screen.getByTestId('credit-slider-save')).toHaveTextContent(
+      'Save 5% ($35)'
+    )
+    expect(screen.getByTestId('credit-slider-billed-yearly')).toHaveTextContent(
+      'Billed monthly'
+    )
+  })
+
+  it('applies the fractional monthly discount at $400 (2.5%)', async () => {
+    renderSlider({ modelValue: 400, cycle: 'monthly' })
+    await flush()
+
+    expect(screen.getByTestId('credit-slider-price')).toHaveTextContent('$390')
+    expect(screen.getByTestId('credit-slider-save')).toHaveTextContent(
+      'Save 2.5% ($10)'
+    )
+  })
+
+  it('hides the discount UI at the 0% stop ($200)', async () => {
+    renderSlider({ modelValue: 200 })
+    await flush()
+
+    expect(screen.getByTestId('credit-slider-price')).toHaveTextContent('$200')
+    expect(
+      screen.queryByTestId('credit-slider-original-price')
+    ).not.toBeInTheDocument()
+    expect(screen.queryByTestId('credit-slider-save')).not.toBeInTheDocument()
+  })
+
+  it('renders all five fixed credit stop labels', async () => {
+    renderSlider({ modelValue: 700 })
+    await flush()
+
+    const stops = within(screen.getByTestId('credit-slider-stops'))
+    for (const label of ['42.2K', '84.4K', '147.7K', '295.4K', '527.5K']) {
+      expect(stops.getByText(label)).toBeInTheDocument()
+    }
+  })
+
+  it('renders stops + default index supplied via props (BE-sourced override)', async () => {
+    const stops = [
+      { usd: 50, credits: 10_550, discountPercentYearly: 0 },
+      { usd: 100, credits: 21_100, discountPercentYearly: 25 }
+    ]
+    // No modelValue → the model default ($700) matches no stop, so selectedIndex
+    // falls back to defaultStopIndex (here index 1 → $100).
+    renderSlider({ stops, defaultStopIndex: 1 })
+    await flush()
+
+    const thumb = screen.getByRole('slider')
+    expect(thumb).toHaveAttribute('aria-valuemax', '1') // 2 stops → max index 1
+    expect(thumb).toHaveAttribute('aria-valuenow', '1') // default index honored
+
+    // index 1 → $100 at 25% yearly → $75 discounted, struck $100, save $25
+    expect(screen.getByTestId('credit-slider-price')).toHaveTextContent('$75')
+    expect(
+      screen.getByTestId('credit-slider-original-price')
+    ).toHaveTextContent('$100')
+    expect(screen.getByTestId('credit-slider-save')).toHaveTextContent(
+      'Save 25% ($25)'
+    )
+
+    // Only the prop's labels render — none of the DES-197 defaults.
+    const labels = within(screen.getByTestId('credit-slider-stops'))
+    expect(labels.getByText('10.6K')).toBeInTheDocument()
+    expect(labels.getByText('21.1K')).toBeInTheDocument()
+    expect(labels.queryByText('147.7K')).not.toBeInTheDocument()
+  })
+
+  it('keeps every credit amount equal to usdToCredits(usd) (guards rate drift)', () => {
+    for (const stop of TEAM_PLAN_CREDIT_STOPS) {
+      expect(stop.credits).toBe(usdToCredits(stop.usd))
+    }
+  })
+})
diff --git a/src/components/ui/credit-slider/CreditSlider.vue b/src/components/ui/credit-slider/CreditSlider.vue
new file mode 100644
index 0000000000..3fe418dcc8
--- /dev/null
+++ b/src/components/ui/credit-slider/CreditSlider.vue
@@ -0,0 +1,235 @@
+<script setup lang="ts">
+import {
+  TransitionPresets,
+  usePreferredReducedMotion,
+  useTransition
+} from '@vueuse/core'
+import { computed } from 'vue'
+import type { HTMLAttributes } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import { cn } from '@comfyorg/tailwind-utils'
+
+import Slider from '@/components/ui/slider/Slider.vue'
+import {
+  DEFAULT_TEAM_PLAN_STOP_INDEX,
+  TEAM_PLAN_CREDIT_STOPS
+} from '@/platform/cloud/subscription/constants/teamPlanCreditStops'
+import type { CreditStop } from '@/platform/cloud/subscription/constants/teamPlanCreditStops'
+
+const {
+  disabled = false,
+  class: rootClass,
+  stops = TEAM_PLAN_CREDIT_STOPS,
+  defaultStopIndex = DEFAULT_TEAM_PLAN_STOP_INDEX,
+  cycle = 'yearly'
+} = defineProps<{
+  disabled?: boolean
+  class?: HTMLAttributes['class']
+  /**
+   * The fixed credit stops the slider snaps to. Must be non-empty. Defaults to
+   * the hardcoded DES-197 set; pass the backend-sourced stops once the contract
+   * lands — map `GET /api/billing/plans → team_credit_stops.stops` to
+   * `CreditStop[]` (credits, the pre-discount `usd`, and `discountPercentYearly`).
+   */
+  stops?: readonly CreditStop[]
+  /**
+   * Stop selected when the bound value matches none (e.g. first render).
+   * Maps to `team_credit_stops.default_stop_index`. Defaults to DES-197 ($700).
+   */
+  defaultStopIndex?: number
+  /**
+   * Billing cycle. Yearly applies the full `discountPercentYearly`; monthly
+   * applies half of it (PRD: GA Team Billing — "for monthly the discount is
+   * halved": yearly 0/5/10/15/20% → monthly 0/2.5/5/7.5/10%).
+   */
+  cycle?: 'monthly' | 'yearly'
+}>()
+
+const emit = defineEmits<{
+  /** Fired when the selected stop changes, with the full derived payload. */
+  change: [stop: { index: number; usd: number; credits: number }]
+}>()
+
+/**
+ * v-model carries the selected USD value (one of the `stops`). The literal
+ * default keeps `defineModel` statically analyzable; when custom `stops` are
+ * passed without a matching v-model, `selectedIndex` falls back to
+ * `defaultStopIndex`, so the displayed stop is still correct.
+ */
+const usd = defineModel<number>({
+  default: TEAM_PLAN_CREDIT_STOPS[DEFAULT_TEAM_PLAN_STOP_INDEX].usd
+})
+
+const selectedIndex = computed(() => {
+  const i = stops.findIndex((stop) => stop.usd === usd.value)
+  if (i !== -1) return i
+  // Fall back to the default stop, clamped into range: a backend-driven `stops`
+  // array can be shorter than expected (or `defaultStopIndex` out of bounds), so
+  // clamping keeps `current` defined and the price computeds below from reading
+  // `undefined.usd` at runtime. (`stops` is required to be non-empty.)
+  return Math.min(Math.max(defaultStopIndex, 0), Math.max(stops.length - 1, 0))
+})
+
+const current = computed<CreditStop>(() => stops[selectedIndex.value])
+
+// The discount applies to the monthly figure. Yearly uses the full
+// `discountPercentYearly`; monthly halves it (PRD: GA Team Billing). The card
+// shows the discounted monthly price, the struck pre-discount price, the
+// saving, and — for yearly — the annual total.
+const effectiveDiscountPercent = computed(() =>
+  cycle === 'monthly'
+    ? current.value.discountPercentYearly / 2
+    : current.value.discountPercentYearly
+)
+const discountedMonthly = computed(() =>
+  Math.round(current.value.usd * (1 - effectiveDiscountPercent.value / 100))
+)
+const saveAmount = computed(() => current.value.usd - discountedMonthly.value)
+const hasDiscount = computed(() => effectiveDiscountPercent.value > 0)
+
+/**
+ * Smoothly count the price figures up/down as the slider moves between stops
+ * instead of snapping. Honors the user's reduced-motion preference. The save
+ * badge ("X% ($Y)") is intentionally left snapping — its percent is a discrete
+ * tier, so animating the bracketed amount alone would read inconsistently.
+ */
+const prefersReducedMotion = usePreferredReducedMotion()
+const priceTween = {
+  duration: 350,
+  easing: TransitionPresets.easeOutCubic,
+  disabled: computed(() => prefersReducedMotion.value === 'reduce')
+}
+const animatedMonthly = useTransition(discountedMonthly, priceTween)
+const animatedOriginal = useTransition(() => current.value.usd, priceTween)
+
+const displayMonthly = computed(() => Math.round(animatedMonthly.value))
+const displayOriginal = computed(() => Math.round(animatedOriginal.value))
+// Derive the yearly total from the displayed monthly so it always reads as
+// exactly 12× the price shown — even mid-count — rather than drifting as a
+// second, independently-phased tween would.
+const displayBilledYearly = computed(() => displayMonthly.value * 12)
+
+/**
+ * Bridge the discrete stop index (0..n-1) to the reka-ui slider's `number[]`
+ * model. Driving the slider in index space with `step = 1` guarantees the
+ * thumb can only land on the fixed stops — never a value in between.
+ */
+const sliderModel = computed<number[]>({
+  get: () => [selectedIndex.value],
+  set: ([index]) => {
+    const stop = stops[index]
+    if (!stop) return
+    usd.value = stop.usd
+    emit('change', { index, usd: stop.usd, credits: stop.credits })
+  }
+})
+
+const lastIndex = computed(() => Math.max(stops.length - 1, 0))
+
+const formatUsd = (value: number) => `$${value.toLocaleString('en-US')}`
+const formatCreditsCompact = (value: number) =>
+  new Intl.NumberFormat('en-US', {
+    notation: 'compact',
+    maximumFractionDigits: 1
+  }).format(value)
+
+const { t } = useI18n()
+</script>
+
+<template>
+  <div :class="cn('flex w-full flex-col gap-3', rootClass)">
+    <!-- Price: discounted monthly + struck pre-discount + save badge -->
+    <div class="flex flex-col gap-2">
+      <div class="flex flex-wrap items-center gap-x-2 gap-y-1">
+        <span class="flex shrink-0 items-baseline gap-1.5 whitespace-nowrap">
+          <span
+            class="text-[2rem]/none font-semibold text-base-foreground tabular-nums"
+            data-testid="credit-slider-price"
+          >
+            {{ formatUsd(displayMonthly) }}
+          </span>
+          <span
+            v-if="hasDiscount"
+            class="text-base text-muted-foreground tabular-nums line-through"
+            data-testid="credit-slider-original-price"
+          >
+            {{ formatUsd(displayOriginal) }}
+          </span>
+          <span class="text-base text-muted-foreground">
+            {{ t('subscription.usdPerMonth') }}
+          </span>
+        </span>
+        <!-- Save badge: outlined primary pill. On wide layouts it's pushed to
+             the right of the price; when the column narrows (mobile) it wraps
+             and aligns left under the price instead (DES QA). -->
+        <span
+          v-if="hasDiscount"
+          data-testid="credit-slider-save"
+          class="shrink-0 rounded-full border-2 border-primary-background px-2 py-1 text-sm font-bold whitespace-nowrap text-primary-background xl:ms-auto"
+        >
+          {{
+            t('subscription.creditSliderSave', {
+              percent: effectiveDiscountPercent,
+              amount: formatUsd(saveAmount)
+            })
+          }}
+        </span>
+      </div>
+      <p
+        class="m-0 text-sm text-muted-foreground tabular-nums"
+        data-testid="credit-slider-billed-yearly"
+      >
+        {{
+          cycle === 'monthly'
+            ? t('subscription.billedMonthly')
+            : t('subscription.billedYearly', {
+                total: formatUsd(displayBilledYearly)
+              })
+        }}
+      </p>
+    </div>
+
+    <!-- Discrete slider: snaps to the 5 fixed DES-197 stops -->
+    <Slider
+      v-model="sliderModel"
+      :min="0"
+      :max="lastIndex"
+      :step="1"
+      :disabled="disabled"
+      range-class="bg-base-foreground"
+      thumb-class="bg-base-foreground"
+    />
+
+    <!-- Credit stop labels; the selected stop is emphasized -->
+    <ol
+      data-testid="credit-slider-stops"
+      class="m-0 flex list-none justify-between p-0"
+    >
+      <li
+        v-for="(stop, i) in stops"
+        :key="stop.usd"
+        :data-selected="i === selectedIndex ? '' : undefined"
+        :class="
+          cn(
+            'flex items-center gap-1 text-xs tabular-nums',
+            i === selectedIndex
+              ? 'font-semibold text-base-foreground'
+              : 'text-muted-foreground'
+          )
+        "
+      >
+        <i
+          :class="
+            cn(
+              'icon-[comfy--credits] size-3 shrink-0',
+              i === selectedIndex ? 'bg-amber-400' : 'bg-muted-foreground'
+            )
+          "
+          aria-hidden="true"
+        />
+        {{ formatCreditsCompact(stop.credits) }}
+      </li>
+    </ol>
+  </div>
+</template>
diff --git a/src/components/ui/slider/Slider.vue b/src/components/ui/slider/Slider.vue
index 8d7457149f..037ea58b6f 100644
--- a/src/components/ui/slider/Slider.vue
+++ b/src/components/ui/slider/Slider.vue
@@ -15,7 +15,11 @@ import { cn } from '@comfyorg/tailwind-utils'
 
 const props = defineProps<
   // eslint-disable-next-line vue/no-unused-properties
-  SliderRootProps & { class?: HTMLAttributes['class'] }
+  SliderRootProps & {
+    class?: HTMLAttributes['class']
+    rangeClass?: HTMLAttributes['class']
+    thumbClass?: HTMLAttributes['class']
+  }
 >()
 
 const pressed = ref(false)
@@ -25,7 +29,7 @@ const setPressed = (val: boolean) => {
 
 const emits = defineEmits<SliderRootEmits>()
 
-const delegatedProps = reactiveOmit(props, 'class')
+const delegatedProps = reactiveOmit(props, 'class', 'rangeClass', 'thumbClass')
 
 const forwarded = useForwardPropsEmits(delegatedProps, emits)
 </script>
@@ -60,7 +64,12 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
     >
       <SliderRange
         data-slot="slider-range"
-        class="absolute bg-node-component-surface-highlight data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full"
+        :class="
+          cn(
+            'absolute bg-node-component-surface-highlight data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full',
+            props.rangeClass
+          )
+        "
       />
     </SliderTrack>
 
@@ -74,7 +83,8 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
           'cursor-grab',
           'before:absolute before:-inset-1 before:block before:rounded-full before:bg-transparent',
           'hover:ring-2 focus-visible:ring-2 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50',
-          { 'cursor-grabbing': pressed }
+          { 'cursor-grabbing': pressed },
+          props.thumbClass
         )
       "
     />
diff --git a/src/composables/auth/useAuthActions.test.ts b/src/composables/auth/useAuthActions.test.ts
index 6ad7aeee80..c41bdec9fd 100644
--- a/src/composables/auth/useAuthActions.test.ts
+++ b/src/composables/auth/useAuthActions.test.ts
@@ -225,6 +225,40 @@ describe('useAuthActions.reportError', () => {
     expect(mockToastErrorHandler).not.toHaveBeenCalled()
   })
 
+  it('shows the signupBlocked message when the error carries the signup_blocked token', () => {
+    const { reportError } = useAuthActions()
+
+    // The backend wraps the rejection in a generic code; we match the token in
+    // the message, so it must win over the auth.errors.${code} fallback.
+    reportError(
+      new FirebaseError(
+        'auth/internal-error',
+        'Account creation is temporarily unavailable. (ref: signup_blocked)'
+      )
+    )
+
+    expect(mockToastStore.add).toHaveBeenCalledWith({
+      severity: 'error',
+      summary: 'g.error',
+      detail: 'auth.errors.signupBlocked'
+    })
+    expect(mockToastErrorHandler).not.toHaveBeenCalled()
+  })
+
+  it('matches the signup_blocked token case-insensitively', () => {
+    const { reportError } = useAuthActions()
+
+    reportError(
+      new FirebaseError('auth/internal-error', 'rejected: SIGNUP_BLOCKED')
+    )
+
+    expect(mockToastStore.add).toHaveBeenCalledWith({
+      severity: 'error',
+      summary: 'g.error',
+      detail: 'auth.errors.signupBlocked'
+    })
+  })
+
   it('shows the generic fallback for an unknown Firebase auth code', () => {
     const { reportError } = useAuthActions()
 
diff --git a/src/composables/auth/useAuthActions.ts b/src/composables/auth/useAuthActions.ts
index 10fec12a6b..70776d82e2 100644
--- a/src/composables/auth/useAuthActions.ts
+++ b/src/composables/auth/useAuthActions.ts
@@ -47,6 +47,19 @@ export const useAuthActions = () => {
           email: 'support@comfy.org'
         })
       })
+    } else if (
+      error instanceof FirebaseError &&
+      error.message.toLowerCase().includes('signup_blocked')
+    ) {
+      // Match on `error.message`, not `error.code`: Firebase `beforeUserCreated`
+      // rejections collapse the thrown code into a generic `auth/internal-error`,
+      // so the message is the only reliable channel. `signup_blocked` is a
+      // cross-repo contract token; matched case-insensitively.
+      toastStore.add({
+        severity: 'error',
+        summary: t('g.error'),
+        detail: t('auth.errors.signupBlocked')
+      })
     } else if (error instanceof FirebaseError) {
       toastStore.add({
         severity: 'error',
diff --git a/src/composables/billing/types.ts b/src/composables/billing/types.ts
index 6bc9f180e3..5a528b1805 100644
--- a/src/composables/billing/types.ts
+++ b/src/composables/billing/types.ts
@@ -5,11 +5,13 @@ import type {
   BillingStatus,
   BillingSubscriptionStatus,
   CreateTopupResponse,
+  CurrentTeamCreditStop,
   Plan,
   PreviewSubscribeResponse,
   SubscribeResponse,
   SubscriptionDuration,
-  SubscriptionTier
+  SubscriptionTier,
+  TeamCreditStops
 } from '@/platform/workspace/api/workspaceApi'
 
 export type BillingType = 'legacy' | 'workspace'
@@ -71,6 +73,10 @@ export interface BillingState {
   balance: ComputedRef<BalanceInfo | null>
   plans: ComputedRef<Plan[]>
   currentPlanSlug: ComputedRef<string | null>
+  /** Team per-credit pricing ladder; null for personal/legacy. */
+  teamCreditStops: ComputedRef<TeamCreditStops | null>
+  /** The team's currently-subscribed credit stop; null for personal/legacy. */
+  currentTeamCreditStop: ComputedRef<CurrentTeamCreditStop | null>
   isLoading: Ref<boolean>
   error: Ref<string | null>
   isActiveSubscription: ComputedRef<boolean>
@@ -83,5 +89,10 @@ export interface BillingState {
 
 export interface BillingContext extends BillingState, BillingActions {
   type: ComputedRef<BillingType>
+  /**
+   * True when the active team workspace is still on a pre-credit-slider
+   * (legacy) per-member tier plan, which keeps the old team pricing table.
+   */
+  isLegacyTeamPlan: ComputedRef<boolean>
   getMaxSeats: (tierKey: TierKey) => number
 }
diff --git a/src/composables/billing/useBillingContext.test.ts b/src/composables/billing/useBillingContext.test.ts
index 7a63702ee3..64202c76b8 100644
--- a/src/composables/billing/useBillingContext.test.ts
+++ b/src/composables/billing/useBillingContext.test.ts
@@ -1,20 +1,39 @@
 import { createPinia, setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
-import type { Plan } from '@/platform/workspace/api/workspaceApi'
+import type {
+  BillingStatusResponse,
+  Plan
+} from '@/platform/workspace/api/workspaceApi'
 
 import { useBillingContext } from './useBillingContext'
 
+const DEFAULT_BILLING_STATUS: BillingStatusResponse = {
+  is_active: true,
+  has_funds: true,
+  subscription_tier: 'PRO',
+  subscription_duration: 'MONTHLY'
+}
+
 const {
   mockTeamWorkspacesEnabled,
   mockIsPersonal,
   mockPlans,
-  mockPurchaseCredits
+  mockPurchaseCredits,
+  mockBillingStatus
 } = vi.hoisted(() => ({
   mockTeamWorkspacesEnabled: { value: false },
   mockIsPersonal: { value: true },
   mockPlans: { value: [] as Plan[] },
-  mockPurchaseCredits: vi.fn()
+  mockPurchaseCredits: vi.fn(),
+  mockBillingStatus: {
+    value: {
+      is_active: true,
+      has_funds: true,
+      subscription_tier: 'PRO',
+      subscription_duration: 'MONTHLY'
+    } as BillingStatusResponse
+  }
 }))
 
 vi.mock('@vueuse/core', async (importOriginal) => {
@@ -103,12 +122,7 @@ vi.mock('@/platform/cloud/subscription/composables/useBillingPlans', () => ({
 
 vi.mock('@/platform/workspace/api/workspaceApi', () => ({
   workspaceApi: {
-    getBillingStatus: vi.fn().mockResolvedValue({
-      is_active: true,
-      has_funds: true,
-      subscription_tier: 'PRO',
-      subscription_duration: 'MONTHLY'
-    }),
+    getBillingStatus: vi.fn(() => Promise.resolve(mockBillingStatus.value)),
     getBillingBalance: vi.fn().mockResolvedValue({
       amount_micros: 10000000,
       currency: 'usd'
@@ -125,6 +139,7 @@ describe('useBillingContext', () => {
     mockTeamWorkspacesEnabled.value = false
     mockIsPersonal.value = true
     mockPlans.value = []
+    mockBillingStatus.value = { ...DEFAULT_BILLING_STATUS }
   })
 
   it('returns legacy type for personal workspace', () => {
@@ -252,4 +267,158 @@ describe('useBillingContext', () => {
       expect(getMaxSeats('creator')).toBe(5)
     })
   })
+
+  describe('isLegacyTeamPlan', () => {
+    it('is false for a personal workspace', () => {
+      const { isLegacyTeamPlan } = useBillingContext()
+      expect(isLegacyTeamPlan.value).toBe(false)
+    })
+
+    it('is true for an active team plan: team- slug and no credit stop', async () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsPersonal.value = false
+      mockBillingStatus.value = {
+        is_active: true,
+        has_funds: true,
+        subscription_tier: 'STANDARD',
+        subscription_duration: 'ANNUAL',
+        plan_slug: 'team-standard-annual'
+      }
+
+      const { initialize, isLegacyTeamPlan } = useBillingContext()
+      await initialize()
+
+      expect(isLegacyTeamPlan.value).toBe(true)
+    })
+
+    it('is true for any legacy team tier, not just standard', async () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsPersonal.value = false
+      mockBillingStatus.value = {
+        is_active: true,
+        has_funds: true,
+        subscription_tier: 'PRO',
+        subscription_duration: 'ANNUAL',
+        plan_slug: 'team-pro-annual'
+      }
+
+      const { initialize, isLegacyTeamPlan } = useBillingContext()
+      await initialize()
+
+      expect(isLegacyTeamPlan.value).toBe(true)
+    })
+
+    it('is false for a new credit-slider team subscriber', async () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsPersonal.value = false
+      // Real BE shape: underscore slug + populated credit stop. (subscription_tier
+      // is 'TEAM' on the wire, not yet in the FE SubscriptionTier union, so it is
+      // omitted here — the predicate does not depend on it.)
+      mockBillingStatus.value = {
+        is_active: true,
+        has_funds: true,
+        subscription_status: 'active',
+        subscription_duration: 'ANNUAL',
+        plan_slug: 'team_per_credit_annual',
+        team_credit_stop: {
+          id: 'team_700',
+          credits_monthly: 147700,
+          stop_usd: 700
+        }
+      }
+
+      const { initialize, isLegacyTeamPlan } = useBillingContext()
+      await initialize()
+
+      expect(isLegacyTeamPlan.value).toBe(false)
+    })
+
+    it('is false for a new team sub even before its credit stop is populated', async () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsPersonal.value = false
+      // Provisioning lag: credit stop not yet attached. The underscore slug
+      // (team_per_credit, not team-) must still exclude it from the legacy table.
+      mockBillingStatus.value = {
+        is_active: true,
+        has_funds: true,
+        subscription_status: 'active',
+        subscription_duration: 'ANNUAL',
+        plan_slug: 'team_per_credit_annual'
+      }
+
+      const { initialize, isLegacyTeamPlan } = useBillingContext()
+      await initialize()
+
+      expect(isLegacyTeamPlan.value).toBe(false)
+    })
+
+    it('is false for a team workspace on a personal-tier plan', async () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsPersonal.value = false
+      mockBillingStatus.value = {
+        is_active: true,
+        has_funds: true,
+        subscription_tier: 'STANDARD',
+        subscription_duration: 'ANNUAL',
+        plan_slug: 'standard-annual'
+      }
+
+      const { initialize, isLegacyTeamPlan } = useBillingContext()
+      await initialize()
+
+      expect(isLegacyTeamPlan.value).toBe(false)
+    })
+
+    it('stays true for a cancelled-but-still-active legacy team sub', async () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsPersonal.value = false
+      mockBillingStatus.value = {
+        is_active: true,
+        has_funds: true,
+        subscription_status: 'canceled',
+        subscription_tier: 'STANDARD',
+        subscription_duration: 'ANNUAL',
+        plan_slug: 'team-standard-annual',
+        cancel_at: '2099-01-01T00:00:00Z'
+      }
+
+      const { initialize, isLegacyTeamPlan } = useBillingContext()
+      await initialize()
+
+      expect(isLegacyTeamPlan.value).toBe(true)
+    })
+
+    it('is false for a FREE-tier team even on a team- prefixed slug', async () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsPersonal.value = false
+      mockBillingStatus.value = {
+        is_active: true,
+        has_funds: true,
+        subscription_tier: 'FREE',
+        plan_slug: 'team-free'
+      }
+
+      const { initialize, isLegacyTeamPlan } = useBillingContext()
+      await initialize()
+
+      expect(isLegacyTeamPlan.value).toBe(false)
+    })
+
+    it('matches the legacy slug case-insensitively', async () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsPersonal.value = false
+      mockBillingStatus.value = {
+        is_active: true,
+        has_funds: true,
+        subscription_tier: 'STANDARD',
+        subscription_duration: 'ANNUAL',
+        plan_slug: 'Team-Standard-Annual'
+      }
+
+      const { initialize, isLegacyTeamPlan } = useBillingContext()
+      await initialize()
+
+      expect(isLegacyTeamPlan.value).toBe(true)
+    })
+  })
 })
diff --git a/src/composables/billing/useBillingContext.ts b/src/composables/billing/useBillingContext.ts
index 639e45130a..3c6c7c818c 100644
--- a/src/composables/billing/useBillingContext.ts
+++ b/src/composables/billing/useBillingContext.ts
@@ -20,6 +20,12 @@ import type {
 import { useLegacyBilling } from './useLegacyBilling'
 import { useWorkspaceBilling } from '@/platform/workspace/composables/useWorkspaceBilling'
 
+// Legacy per-member team plans use a hyphenated `team-{tier}-{cycle}` slug; the
+// new credit-slider plan uses an underscore `team_per_credit_{cycle}` slug and
+// carries a team_credit_stop. The hyphen prefix alone separates the two, so a
+// new sub is never misrouted even before its credit stop is populated.
+const LEGACY_TEAM_PLAN_SLUG_PREFIX = 'team-'
+
 /**
  * Unified billing context that automatically switches between legacy (user-scoped)
  * and workspace billing based on the active workspace type.
@@ -116,12 +122,32 @@ function useBillingContextInternal(): BillingContext {
     toValue(activeContext.value.currentPlanSlug)
   )
 
+  const teamCreditStops = computed(() =>
+    toValue(activeContext.value.teamCreditStops)
+  )
+
+  const currentTeamCreditStop = computed(() =>
+    toValue(activeContext.value.currentTeamCreditStop)
+  )
+
   const isActiveSubscription = computed(() =>
     toValue(activeContext.value.isActiveSubscription)
   )
 
   const isFreeTier = computed(() => subscription.value?.tier === 'FREE')
 
+  const isLegacyTeamPlan = computed(
+    () =>
+      type.value === 'workspace' &&
+      isActiveSubscription.value &&
+      !isFreeTier.value &&
+      currentTeamCreditStop.value === null &&
+      (currentPlanSlug.value
+        ?.toLowerCase()
+        .startsWith(LEGACY_TEAM_PLAN_SLUG_PREFIX) ??
+        false)
+  )
+
   const billingStatus = computed(() =>
     toValue(activeContext.value.billingStatus)
   )
@@ -254,10 +280,13 @@ function useBillingContextInternal(): BillingContext {
     balance,
     plans,
     currentPlanSlug,
+    teamCreditStops,
+    currentTeamCreditStop,
     isLoading,
     error,
     isActiveSubscription,
     isFreeTier,
+    isLegacyTeamPlan,
     billingStatus,
     subscriptionStatus,
     tier,
diff --git a/src/composables/billing/useLegacyBilling.ts b/src/composables/billing/useLegacyBilling.ts
index 1e52599605..5dcd5857e2 100644
--- a/src/composables/billing/useLegacyBilling.ts
+++ b/src/composables/billing/useLegacyBilling.ts
@@ -93,6 +93,8 @@ export function useLegacyBilling(): BillingState & BillingActions {
   // Legacy billing doesn't have workspace-style plans
   const plans = computed(() => [])
   const currentPlanSlug = computed(() => null)
+  const teamCreditStops = computed(() => null)
+  const currentTeamCreditStop = computed(() => null)
 
   async function initialize(): Promise<void> {
     if (isInitialized.value) return
@@ -200,6 +202,8 @@ export function useLegacyBilling(): BillingState & BillingActions {
     balance,
     plans,
     currentPlanSlug,
+    teamCreditStops,
+    currentTeamCreditStop,
     isLoading,
     error,
     isActiveSubscription,
diff --git a/src/composables/boundingBoxes/boundingBoxesUtil.test.ts b/src/composables/boundingBoxes/boundingBoxesUtil.test.ts
new file mode 100644
index 0000000000..e9d154cb44
--- /dev/null
+++ b/src/composables/boundingBoxes/boundingBoxesUtil.test.ts
@@ -0,0 +1,237 @@
+import { describe, expect, it } from 'vitest'
+
+import type { BoundingBox } from '@/types/boundingBoxes'
+
+import type { HitMode, Region } from './boundingBoxesUtil'
+import {
+  applyDrag,
+  boxesAt,
+  fromBoundingBoxes,
+  tagRects,
+  toBoundingBoxes
+} from './boundingBoxesUtil'
+
+const region = (over: Partial<Region> = {}): Region => ({
+  x: 0.2,
+  y: 0.2,
+  w: 0.2,
+  h: 0.2,
+  type: 'obj',
+  text: '',
+  desc: '',
+  palette: [],
+  ...over
+})
+
+describe('applyDrag', () => {
+  it('moves without resizing and keeps width/height', () => {
+    const out = applyDrag('move', region({ x: 0.2, y: 0.2 }), 0.1, 0.1)
+    expect(out.x).toBeCloseTo(0.3)
+    expect(out.y).toBeCloseTo(0.3)
+    expect(out.w).toBeCloseTo(0.2)
+    expect(out.h).toBeCloseTo(0.2)
+  })
+
+  it('clamps a move so the box stays inside the unit square', () => {
+    const out = applyDrag(
+      'move',
+      region({ x: 0.9, y: 0.9, w: 0.2, h: 0.2 }),
+      0.5,
+      0.5
+    )
+    expect(out.x).toBeCloseTo(0.8)
+    expect(out.y).toBeCloseTo(0.8)
+  })
+
+  it('grows from the bottom-right for draw and resize-br', () => {
+    for (const mode of ['draw', 'resize-br'] as HitMode[]) {
+      const out = applyDrag(
+        mode,
+        region({ x: 0.2, y: 0.2, w: 0.1, h: 0.1 }),
+        0.1,
+        0.2
+      )
+      expect(out).toMatchObject({ x: 0.2, y: 0.2 })
+      expect(out.w).toBeCloseTo(0.2)
+      expect(out.h).toBeCloseTo(0.3)
+    }
+  })
+
+  it('moves the top-left corner on resize-tl', () => {
+    const out = applyDrag(
+      'resize-tl',
+      region({ x: 0.5, y: 0.5, w: 0.2, h: 0.2 }),
+      0.1,
+      0.1
+    )
+    expect(out.x).toBeCloseTo(0.6)
+    expect(out.y).toBeCloseTo(0.6)
+    expect(out.w).toBeCloseTo(0.1)
+    expect(out.h).toBeCloseTo(0.1)
+  })
+
+  it('normalizes a corner drag that inverts the box', () => {
+    const out = applyDrag(
+      'resize-tl',
+      region({ x: 0.5, y: 0.5, w: 0.2, h: 0.2 }),
+      0.3,
+      0
+    )
+    expect(out.x).toBeCloseTo(0.7)
+    expect(out.w).toBeCloseTo(0.1)
+    expect(out.y).toBeCloseTo(0.5)
+    expect(out.h).toBeCloseTo(0.2)
+  })
+
+  it('resizes single edges', () => {
+    expect(applyDrag('resize-r', region({ w: 0.2 }), 0.1, 0).w).toBeCloseTo(0.3)
+    expect(applyDrag('resize-b', region({ h: 0.2 }), 0, 0.1).h).toBeCloseTo(0.3)
+    const top = applyDrag('resize-t', region({ y: 0.4, h: 0.2 }), 0, 0.1)
+    expect(top.y).toBeCloseTo(0.5)
+    expect(top.h).toBeCloseTo(0.1)
+    const left = applyDrag('resize-l', region({ x: 0.4, w: 0.2 }), 0.1, 0)
+    expect(left.x).toBeCloseTo(0.5)
+    expect(left.w).toBeCloseTo(0.1)
+  })
+})
+
+describe('boxesAt', () => {
+  const regions: Region[] = [region({ x: 0.2, y: 0.2, w: 0.2, h: 0.2 })]
+
+  it('detects a corner handle', () => {
+    const hits = boxesAt(regions, 0.2, 0.2, 6, 100, 100, -1)
+    expect(hits[0]).toEqual({ index: 0, mode: 'resize-tl' })
+  })
+
+  it('detects an interior move', () => {
+    const hits = boxesAt(regions, 0.3, 0.3, 6, 100, 100, -1)
+    expect(hits[0]).toEqual({ index: 0, mode: 'move' })
+  })
+
+  it('returns nothing when the pointer misses every box', () => {
+    expect(boxesAt(regions, 0.9, 0.9, 6, 100, 100, -1)).toEqual([])
+  })
+
+  it('brings the active box to the front of overlapping candidates', () => {
+    const overlapping: Region[] = [
+      region({ x: 0.2, y: 0.2, w: 0.2, h: 0.2 }),
+      region({ x: 0.25, y: 0.25, w: 0.2, h: 0.2 })
+    ]
+    const hits = boxesAt(overlapping, 0.3, 0.3, 6, 100, 100, 1)
+    expect(hits).toHaveLength(2)
+    expect(hits[0].index).toBe(1)
+  })
+})
+
+describe('tagRects', () => {
+  const measure = (s: string) => s.length * 7
+
+  it('places the first tag at the top-left corner', () => {
+    const rects = tagRects(
+      [region({ x: 0.1, y: 0.1, w: 0.3, h: 0.3 })],
+      100,
+      100,
+      measure
+    )
+    expect(rects[0]).toMatchObject({ x: 10, y: 10, tag: '01' })
+    expect(rects[0].w).toBe(measure('01') + 8)
+  })
+
+  it('moves a colliding tag to a different corner', () => {
+    const boxes = [
+      region({ x: 0.1, y: 0.1, w: 0.3, h: 0.3 }),
+      region({ x: 0.1, y: 0.1, w: 0.3, h: 0.3 })
+    ]
+    const rects = tagRects(boxes, 100, 100, measure)
+    const sameSpot = rects[1].x === rects[0].x && rects[1].y === rects[0].y
+    expect(sameSpot).toBe(false)
+  })
+})
+
+describe('fromBoundingBoxes', () => {
+  it('converts pixel boxes to normalized regions with metadata', () => {
+    const boxes: BoundingBox[] = [
+      {
+        x: 100,
+        y: 200,
+        width: 300,
+        height: 400,
+        metadata: { type: 'text', text: 'hi', desc: 'd', palette: ['#fff'] }
+      }
+    ]
+    expect(fromBoundingBoxes(boxes, 1000, 1000)[0]).toEqual({
+      x: 0.1,
+      y: 0.2,
+      w: 0.3,
+      h: 0.4,
+      type: 'text',
+      text: 'hi',
+      desc: 'd',
+      palette: ['#fff']
+    })
+  })
+
+  it('fills defaults when metadata is missing or partial', () => {
+    const boxes = [{ x: 0, y: 0, width: 10, height: 10 }] as BoundingBox[]
+    expect(fromBoundingBoxes(boxes, 100, 100)[0]).toMatchObject({
+      type: 'obj',
+      text: '',
+      desc: '',
+      palette: []
+    })
+  })
+
+  it('drops entries that are not bounding boxes', () => {
+    const boxes = [null, { x: 1 }, undefined] as unknown as BoundingBox[]
+    expect(fromBoundingBoxes(boxes, 100, 100)).toEqual([])
+  })
+
+  it('guards against zero dimensions', () => {
+    const boxes: BoundingBox[] = [
+      {
+        x: 5,
+        y: 5,
+        width: 5,
+        height: 5,
+        metadata: { type: 'obj', text: '', desc: '', palette: [] }
+      }
+    ]
+    expect(fromBoundingBoxes(boxes, 0, 0)[0]).toMatchObject({
+      x: 5,
+      y: 5,
+      w: 5,
+      h: 5
+    })
+  })
+})
+
+describe('toBoundingBoxes', () => {
+  it('rounds normalized regions back to pixels and copies the palette', () => {
+    const palette = ['#abc']
+    const regions: Region[] = [
+      region({ x: 0.1, y: 0.2, w: 0.3, h: 0.4, palette })
+    ]
+    const [box] = toBoundingBoxes(regions, 1000, 1000)
+    expect(box).toMatchObject({ x: 100, y: 200, width: 300, height: 400 })
+    expect(box.metadata.palette).toEqual(['#abc'])
+    expect(box.metadata.palette).not.toBe(palette)
+  })
+
+  it('round-trips from pixels to regions and back', () => {
+    const boxes: BoundingBox[] = [
+      {
+        x: 100,
+        y: 200,
+        width: 300,
+        height: 400,
+        metadata: { type: 'obj', text: '', desc: '', palette: [] }
+      }
+    ]
+    const restored = toBoundingBoxes(
+      fromBoundingBoxes(boxes, 1000, 1000),
+      1000,
+      1000
+    )
+    expect(restored).toEqual(boxes)
+  })
+})
diff --git a/src/composables/boundingBoxes/boundingBoxesUtil.ts b/src/composables/boundingBoxes/boundingBoxesUtil.ts
new file mode 100644
index 0000000000..4588b53a8d
--- /dev/null
+++ b/src/composables/boundingBoxes/boundingBoxesUtil.ts
@@ -0,0 +1,246 @@
+import type { BoundingBox, BoundingBoxMetadata } from '@/types/boundingBoxes'
+
+export type HitMode =
+  | 'move'
+  | 'draw'
+  | 'resize-tl'
+  | 'resize-tr'
+  | 'resize-bl'
+  | 'resize-br'
+  | 'resize-t'
+  | 'resize-b'
+  | 'resize-l'
+  | 'resize-r'
+
+export interface Region extends BoundingBoxMetadata {
+  x: number
+  y: number
+  w: number
+  h: number
+}
+
+interface BoxCandidate {
+  index: number
+  mode: HitMode
+}
+
+interface TagRect {
+  x: number
+  y: number
+  w: number
+  h: number
+  tag: string
+}
+
+const clamp01 = (v: number) => Math.max(0, Math.min(1, v))
+
+function normalizeBox(b: Region): Region {
+  let { x, y, w, h } = b
+  if (w < 0) {
+    x += w
+    w = -w
+  }
+  if (h < 0) {
+    y += h
+    h = -h
+  }
+  x = clamp01(x)
+  y = clamp01(y)
+  w = Math.min(w, 1 - x)
+  h = Math.min(h, 1 - y)
+  return { ...b, x, y, w: Math.max(0, w), h: Math.max(0, h) }
+}
+
+function rectHitTest(
+  mx: number,
+  my: number,
+  x1: number,
+  y1: number,
+  x2: number,
+  y2: number,
+  rx: number,
+  ry: number
+): HitMode | null {
+  const h = (cx: number, cy: number) =>
+    Math.abs(mx - cx) < rx && Math.abs(my - cy) < ry
+  if (h(x1, y1)) return 'resize-tl'
+  if (h(x2, y1)) return 'resize-tr'
+  if (h(x1, y2)) return 'resize-bl'
+  if (h(x2, y2)) return 'resize-br'
+  if (mx >= x1 && mx <= x2 && Math.abs(my - y1) < ry) return 'resize-t'
+  if (mx >= x1 && mx <= x2 && Math.abs(my - y2) < ry) return 'resize-b'
+  if (my >= y1 && my <= y2 && Math.abs(mx - x1) < rx) return 'resize-l'
+  if (my >= y1 && my <= y2 && Math.abs(mx - x2) < rx) return 'resize-r'
+  if (mx >= x1 && mx <= x2 && my >= y1 && my <= y2) return 'move'
+  return null
+}
+
+export function applyDrag(
+  mode: HitMode,
+  start: Region,
+  dx: number,
+  dy: number
+): Region {
+  let { x, y, w, h } = start
+  switch (mode) {
+    case 'move':
+      x += dx
+      y += dy
+      x = clamp01(Math.min(x, 1 - w))
+      y = clamp01(Math.min(y, 1 - h))
+      break
+    case 'draw':
+    case 'resize-br':
+      w += dx
+      h += dy
+      break
+    case 'resize-tl':
+      x += dx
+      y += dy
+      w -= dx
+      h -= dy
+      break
+    case 'resize-tr':
+      y += dy
+      w += dx
+      h -= dy
+      break
+    case 'resize-bl':
+      x += dx
+      w -= dx
+      h += dy
+      break
+    case 'resize-t':
+      y += dy
+      h -= dy
+      break
+    case 'resize-b':
+      h += dy
+      break
+    case 'resize-l':
+      x += dx
+      w -= dx
+      break
+    case 'resize-r':
+      w += dx
+      break
+  }
+  return mode === 'move'
+    ? { ...start, x, y }
+    : normalizeBox({ ...start, x, y, w, h })
+}
+
+export function boxesAt(
+  regions: readonly Region[],
+  mxN: number,
+  myN: number,
+  handlePx: number,
+  logW: number,
+  logH: number,
+  activeIdx: number
+): BoxCandidate[] {
+  const rx = handlePx / Math.max(1, logW)
+  const ry = handlePx / Math.max(1, logH)
+  const res: BoxCandidate[] = []
+  for (let i = 0; i < regions.length; i++) {
+    const b = regions[i]
+    const mode = rectHitTest(mxN, myN, b.x, b.y, b.x + b.w, b.y + b.h, rx, ry)
+    if (mode) res.push({ index: i, mode })
+  }
+  const ai = res.findIndex((c) => c.index === activeIdx)
+  if (ai > 0) res.unshift(res.splice(ai, 1)[0])
+  return res
+}
+
+export function tagRects(
+  regions: readonly Region[],
+  logW: number,
+  logH: number,
+  measureWidth: (s: string) => number,
+  height = 14
+): TagRect[] {
+  const placed: TagRect[] = []
+  const rects: TagRect[] = []
+  const hits = (a: TagRect, b: TagRect) =>
+    a.x < b.x + b.w && a.x + a.w > b.x && a.y < b.y + b.h && a.y + a.h > b.y
+  for (let i = 0; i < regions.length; i++) {
+    const b = regions[i]
+    const x1 = b.x * logW
+    const y1 = b.y * logH
+    const x2 = (b.x + b.w) * logW
+    const y2 = (b.y + b.h) * logH
+    const tag = String(i + 1).padStart(2, '0')
+    const w = measureWidth(tag) + 8
+    let pick: [number, number] = [x1, y1]
+    for (const [cx, cy] of [
+      [x1, y1],
+      [x2 - w, y1],
+      [x2 - w, y2 - height],
+      [x1, y2 - height]
+    ] as const) {
+      const candidate: TagRect = { x: cx, y: cy, w, h: height, tag }
+      if (!placed.some((p) => hits(candidate, p))) {
+        pick = [cx, cy]
+        break
+      }
+    }
+    const r: TagRect = { x: pick[0], y: pick[1], w, h: height, tag }
+    placed.push(r)
+    rects[i] = r
+  }
+  return rects
+}
+
+function isBoundingBox(b: unknown): b is BoundingBox {
+  if (!b || typeof b !== 'object') return false
+  const box = b as Record<string, unknown>
+  return (
+    typeof box.x === 'number' &&
+    typeof box.y === 'number' &&
+    typeof box.width === 'number' &&
+    typeof box.height === 'number'
+  )
+}
+
+export function fromBoundingBoxes(
+  boxes: readonly BoundingBox[],
+  width: number,
+  height: number
+): Region[] {
+  const w = width || 1
+  const h = height || 1
+  return boxes.filter(isBoundingBox).map((box) => {
+    const meta = (box.metadata ?? {}) as Partial<BoundingBoxMetadata>
+    return {
+      x: box.x / w,
+      y: box.y / h,
+      w: box.width / w,
+      h: box.height / h,
+      type: meta.type === 'text' ? 'text' : 'obj',
+      text: typeof meta.text === 'string' ? meta.text : '',
+      desc: typeof meta.desc === 'string' ? meta.desc : '',
+      palette: Array.isArray(meta.palette)
+        ? meta.palette.filter((c): c is string => typeof c === 'string')
+        : []
+    }
+  })
+}
+
+export function toBoundingBoxes(
+  regions: readonly Region[],
+  width: number,
+  height: number
+): BoundingBox[] {
+  return regions.map((r) => ({
+    x: Math.round(r.x * width),
+    y: Math.round(r.y * height),
+    width: Math.round(r.w * width),
+    height: Math.round(r.h * height),
+    metadata: {
+      type: r.type,
+      text: r.text,
+      desc: r.desc,
+      palette: r.palette.slice()
+    }
+  }))
+}
diff --git a/src/composables/boundingBoxes/useBoundingBoxes.test.ts b/src/composables/boundingBoxes/useBoundingBoxes.test.ts
new file mode 100644
index 0000000000..4dacf61755
--- /dev/null
+++ b/src/composables/boundingBoxes/useBoundingBoxes.test.ts
@@ -0,0 +1,249 @@
+import { render } from '@testing-library/vue'
+import { createPinia, setActivePinia } from 'pinia'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import type { Ref, ShallowRef } from 'vue'
+import { defineComponent, h, nextTick, ref, shallowRef } from 'vue'
+
+import { useBoundingBoxes } from './useBoundingBoxes'
+import type { BoundingBox } from '@/types/boundingBoxes'
+
+const { appState } = vi.hoisted(() => ({
+  appState: { node: null as unknown }
+}))
+
+vi.mock('@/scripts/app', () => ({
+  app: { canvas: { graph: { getNodeById: () => appState.node } } }
+}))
+
+const ctx = {
+  measureText: (s: string) => ({ width: s.length * 7 }),
+  setTransform: () => {},
+  clearRect: () => {},
+  fillRect: () => {},
+  strokeRect: () => {},
+  fillText: () => {},
+  drawImage: () => {},
+  save: () => {},
+  restore: () => {},
+  beginPath: () => {},
+  rect: () => {},
+  clip: () => {},
+  font: '',
+  fillStyle: '',
+  strokeStyle: '',
+  lineWidth: 0
+} as unknown as CanvasRenderingContext2D
+
+function makeCanvas(): HTMLCanvasElement {
+  const el = document.createElement('canvas')
+  Object.defineProperty(el, 'clientWidth', { value: 100, configurable: true })
+  Object.defineProperty(el, 'clientHeight', { value: 100, configurable: true })
+  el.getContext = (() => ctx) as unknown as HTMLCanvasElement['getContext']
+  el.getBoundingClientRect = () =>
+    ({
+      left: 0,
+      top: 0,
+      right: 100,
+      bottom: 100,
+      width: 100,
+      height: 100,
+      x: 0,
+      y: 0,
+      toJSON: () => ({})
+    }) as DOMRect
+  el.focus = () => {}
+  el.setPointerCapture = () => {}
+  el.releasePointerCapture = () => {}
+  return el
+}
+
+function makeNode() {
+  return {
+    widgets: [
+      { name: 'width', value: 512 },
+      { name: 'height', value: 512 }
+    ],
+    findInputSlot: () => -1,
+    getInputNode: () => null
+  }
+}
+
+const pe = (
+  clientX: number,
+  clientY: number,
+  over: Partial<PointerEvent> = {}
+) =>
+  ({
+    button: 0,
+    clientX,
+    clientY,
+    altKey: false,
+    pointerId: 1,
+    preventDefault: () => {},
+    stopPropagation: () => {},
+    ...over
+  }) as unknown as PointerEvent
+
+const flush = async () => {
+  await Promise.resolve()
+  await nextTick()
+}
+
+type Api = ReturnType<typeof useBoundingBoxes>
+interface Captured extends Api {
+  canvasEl: ShallowRef<HTMLCanvasElement | null>
+  modelValue: Ref<BoundingBox[]>
+}
+
+function setup(initial: BoundingBox[] = []) {
+  let captured: Captured | undefined
+  const Harness = defineComponent({
+    setup() {
+      const canvasEl = shallowRef<HTMLCanvasElement | null>(null)
+      const canvasContainer = shallowRef<HTMLDivElement | null>(null)
+      const inlineEditorEl = shallowRef<HTMLTextAreaElement | null>(null)
+      const modelValue = ref(initial)
+      const api = useBoundingBoxes('1', {
+        canvasEl,
+        canvasContainer,
+        inlineEditorEl,
+        modelValue
+      })
+      captured = { canvasEl, modelValue, ...api }
+      return () => h('div')
+    }
+  })
+  render(Harness)
+  captured!.canvasEl.value = makeCanvas()
+  return captured!
+}
+
+const box = (over: Partial<BoundingBox> = {}): BoundingBox => ({
+  x: 51,
+  y: 51,
+  width: 256,
+  height: 256,
+  metadata: { type: 'obj', text: '', desc: '', palette: ['#ff0000'] },
+  ...over
+})
+
+beforeEach(() => {
+  setActivePinia(createPinia())
+  appState.node = makeNode()
+  vi.stubGlobal('requestAnimationFrame', (cb: FrameRequestCallback) => {
+    void Promise.resolve().then(() => cb(0))
+    return 1
+  })
+  vi.stubGlobal('cancelAnimationFrame', () => {})
+})
+
+afterEach(() => {
+  vi.unstubAllGlobals()
+})
+
+describe('useBoundingBoxes initialization', () => {
+  it('derives regions from the initial model value', () => {
+    const c = setup([box()])
+    expect(c.hasRegions.value).toBe(true)
+    expect(c.activeRegion.value).toMatchObject({ type: 'obj' })
+  })
+
+  it('exposes an aspect-ratio canvas style from the node width/height', () => {
+    const c = setup()
+    expect(c.canvasStyle.value).toEqual({ aspectRatio: '512 / 512' })
+  })
+
+  it('starts with no active region when empty', () => {
+    const c = setup()
+    expect(c.hasRegions.value).toBe(false)
+    expect(c.activeRegion.value).toBeNull()
+  })
+})
+
+describe('useBoundingBoxes drawing', () => {
+  it('draws a new region and syncs it to the model value', async () => {
+    const c = setup()
+    c.onPointerDown(pe(10, 10))
+    c.onCanvasPointerMove(pe(60, 60))
+    c.onDocPointerUp(pe(60, 60))
+    await flush()
+    expect(c.modelValue.value).toHaveLength(1)
+    expect(c.modelValue.value[0].width).toBeGreaterThan(0)
+  })
+
+  it('discards a zero-size draw', async () => {
+    const c = setup()
+    c.onPointerDown(pe(10, 10))
+    c.onDocPointerUp(pe(10, 10))
+    await flush()
+    expect(c.modelValue.value).toHaveLength(0)
+  })
+
+  it('selects an existing region instead of drawing when clicking inside it', async () => {
+    const c = setup([box()])
+    c.onPointerDown(pe(30, 30))
+    c.onDocPointerUp(pe(30, 30))
+    await flush()
+    expect(c.modelValue.value).toHaveLength(1)
+  })
+})
+
+describe('useBoundingBoxes region editing', () => {
+  it('changes the active region type', async () => {
+    const c = setup([box()])
+    c.setActiveType('text')
+    await flush()
+    expect(c.modelValue.value[0].metadata.type).toBe('text')
+  })
+
+  it('deletes the active region on Delete', async () => {
+    const c = setup([box()])
+    c.onCanvasKeyDown({
+      key: 'Delete',
+      preventDefault: () => {},
+      stopPropagation: () => {}
+    } as unknown as KeyboardEvent)
+    await flush()
+    expect(c.modelValue.value).toHaveLength(0)
+  })
+
+  it('clears all regions', async () => {
+    const c = setup([box(), box({ x: 0 })])
+    c.clearAll()
+    await flush()
+    expect(c.modelValue.value).toHaveLength(0)
+  })
+})
+
+describe('useBoundingBoxes inline editor', () => {
+  it('opens on double click and commits the description', async () => {
+    const c = setup([box()])
+    c.onDoubleClick(pe(30, 30) as unknown as MouseEvent)
+    await flush()
+    expect(c.inlineEditor.value).not.toBeNull()
+
+    c.inlineEditor.value!.value = 'a label'
+    c.commitInlineEditor()
+    await flush()
+    expect(c.modelValue.value[0].metadata.desc).toBe('a label')
+    expect(c.inlineEditor.value).toBeNull()
+  })
+
+  it('closes the inline editor on Escape', async () => {
+    const c = setup([box()])
+    c.onDoubleClick(pe(30, 30) as unknown as MouseEvent)
+    await flush()
+    c.onInlineKeyDown({ key: 'Escape' } as KeyboardEvent)
+    expect(c.inlineEditor.value).toBeNull()
+  })
+})
+
+describe('useBoundingBoxes hover cursor', () => {
+  it('switches to a pointer cursor over a tag', async () => {
+    const c = setup([box({ x: 10, y: 10, width: 256, height: 256 })])
+    expect(c.canvasCursor.value).toBe('crosshair')
+    c.onCanvasPointerMove(pe(15, 15))
+    await flush()
+    expect(c.canvasCursor.value).toBe('pointer')
+  })
+})
diff --git a/src/composables/boundingBoxes/useBoundingBoxes.ts b/src/composables/boundingBoxes/useBoundingBoxes.ts
new file mode 100644
index 0000000000..7309b07090
--- /dev/null
+++ b/src/composables/boundingBoxes/useBoundingBoxes.ts
@@ -0,0 +1,614 @@
+import { useElementSize } from '@vueuse/core'
+import { storeToRefs } from 'pinia'
+import type { Ref, ShallowRef } from 'vue'
+import { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'
+
+import {
+  applyDrag,
+  boxesAt,
+  fromBoundingBoxes,
+  tagRects,
+  toBoundingBoxes
+} from '@/composables/boundingBoxes/boundingBoxesUtil'
+import type {
+  HitMode,
+  Region
+} from '@/composables/boundingBoxes/boundingBoxesUtil'
+import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
+import { app } from '@/scripts/app'
+import { useNodeOutputStore } from '@/stores/nodeOutputStore'
+import type { BoundingBox } from '@/types/boundingBoxes'
+import { readableTextColor, textOnColor } from '@/utils/colorUtil'
+
+const HANDLE_PX = 8
+const DIMENSION_STEP = 16
+const BG_DIM = 0.75
+const MAX_ELEMENT_COLORS = 5
+
+interface InlineEditorState {
+  value: string
+  style: Record<string, string>
+  index: number
+}
+
+interface UseBoundingBoxesOptions {
+  canvasEl: Readonly<ShallowRef<HTMLCanvasElement | null>>
+  canvasContainer: Readonly<ShallowRef<HTMLDivElement | null>>
+  inlineEditorEl: Readonly<ShallowRef<HTMLTextAreaElement | null>>
+  modelValue: Ref<BoundingBox[]>
+}
+
+export function useBoundingBoxes(
+  nodeId: string,
+  {
+    canvasEl,
+    canvasContainer,
+    inlineEditorEl,
+    modelValue
+  }: UseBoundingBoxesOptions
+) {
+  const focused = ref(false)
+  const drawing = ref(false)
+  const dragMode = ref<HitMode | null>(null)
+  const dragStartNorm = ref<{ x: number; y: number } | null>(null)
+  const boxAtStart = ref<Region | null>(null)
+  const hoverIndex = ref<number | null>(null)
+  const hoverTagIndex = ref<number | null>(null)
+  const bgImage = ref<HTMLImageElement | null>(null)
+  const inlineEditor = ref<InlineEditorState | null>(null)
+
+  const { width: containerWidth } = useElementSize(canvasContainer)
+
+  const litegraphNode = computed(() =>
+    nodeId && app.canvas?.graph ? app.canvas.graph.getNodeById(nodeId) : null
+  )
+  const { selectedNodeIds } = storeToRefs(useCanvasStore())
+  const isNodeSelected = computed(() =>
+    selectedNodeIds.value.has(String(nodeId))
+  )
+
+  function dimWidget(name: 'width' | 'height'): number | undefined {
+    const v = litegraphNode.value?.widgets?.find((w) => w.name === name)?.value
+    return typeof v === 'number' && v > 0 ? v : undefined
+  }
+  const widthValue = computed(() => dimWidget('width') ?? 1024)
+  const heightValue = computed(() => dimWidget('height') ?? 1024)
+
+  const state = ref({
+    regions: fromBoundingBoxes(
+      modelValue.value ?? [],
+      widthValue.value,
+      heightValue.value
+    )
+  })
+  const activeIndex = ref(state.value.regions.length ? 0 : -1)
+
+  const aspectRatio = computed(
+    () => `${widthValue.value} / ${heightValue.value}`
+  )
+  const canvasStyle = computed(() => ({ aspectRatio: aspectRatio.value }))
+
+  const activeRegion = computed(() =>
+    activeIndex.value >= 0 ? state.value.regions[activeIndex.value] : null
+  )
+  const hasRegions = computed(() => state.value.regions.length > 0)
+
+  function clampToCanvas(n: number) {
+    return Math.max(0, Math.min(1, n))
+  }
+
+  function logicalSize() {
+    const el = canvasEl.value
+    return { w: el?.clientWidth || 1, h: el?.clientHeight || 1 }
+  }
+
+  function pointerNorm(e: PointerEvent) {
+    const el = canvasEl.value
+    if (!el) return { x: 0, y: 0 }
+    const r = el.getBoundingClientRect()
+    return {
+      x: clampToCanvas((e.clientX - r.left) / r.width),
+      y: clampToCanvas((e.clientY - r.top) / r.height)
+    }
+  }
+
+  let rafHandle = 0
+  function requestDraw() {
+    if (rafHandle) return
+    rafHandle = requestAnimationFrame(() => {
+      rafHandle = 0
+      drawCanvas()
+    })
+  }
+
+  function measureWidth(ctx: CanvasRenderingContext2D, s: string) {
+    return ctx.measureText(s).width
+  }
+
+  function drawCanvas() {
+    const el = canvasEl.value
+    if (!el) return
+    const { w: W, h: H } = logicalSize()
+    const dpr = window.devicePixelRatio || 1
+    const bw = Math.max(1, Math.round(W * dpr))
+    const bh = Math.max(1, Math.round(H * dpr))
+    if (el.width !== bw || el.height !== bh) {
+      el.width = bw
+      el.height = bh
+    }
+    const ctx = el.getContext('2d')
+    if (!ctx) return
+    ctx.setTransform(dpr, 0, 0, dpr, 0, 0)
+    ctx.clearRect(0, 0, W, H)
+
+    if (bgImage.value) {
+      ctx.drawImage(bgImage.value, 0, 0, W, H)
+      ctx.fillStyle = `rgba(0,0,0,${BG_DIM})`
+      ctx.fillRect(0, 0, W, H)
+    }
+
+    const showActive = focused.value || isNodeSelected.value
+    const aIdx = showActive ? activeIndex.value : -1
+    const order = state.value.regions
+      .map((_, i) => i)
+      .filter((i) => i !== aIdx)
+      .reverse()
+    if (aIdx >= 0 && aIdx < state.value.regions.length) order.push(aIdx)
+
+    ctx.font = 'bold 11px monospace'
+    const tag_rects = tagRects(state.value.regions, W, H, (s) =>
+      measureWidth(ctx, s)
+    )
+
+    for (const i of order) {
+      const b = state.value.regions[i]
+      const active = i === aIdx
+      const pal = (b.palette || []).filter(Boolean)
+      const col = pal.length ? pal[0] : '#8c8c8c'
+      const x1 = b.x * W
+      const y1 = b.y * H
+      const x2 = (b.x + b.w) * W
+      const y2 = (b.y + b.h) * H
+      const w = x2 - x1
+      const h = y2 - y1
+      const hovered = i === hoverIndex.value || active
+
+      if (active) {
+        ctx.fillStyle = 'rgba(26,26,26,0.88)'
+        ctx.fillRect(x1, y1, w, h)
+      }
+      ctx.fillStyle = col + (hovered ? '3a' : '22')
+      ctx.fillRect(x1, y1, w, h)
+
+      const lw = active ? 2 : hovered ? 1.5 : 1
+      ctx.strokeStyle = col
+      ctx.lineWidth = lw
+      ctx.strokeRect(x1 + lw / 2, y1 + lw / 2, w - lw, h - lw)
+
+      if (pal.length) {
+        const sw = w / pal.length
+        const sh = 7
+        for (let p = 0; p < pal.length; p++) {
+          const sx = x1 + Math.round(p * sw)
+          ctx.fillStyle = pal[p]
+          ctx.fillRect(sx, y1, x1 + Math.round((p + 1) * sw) - sx, sh)
+        }
+      }
+
+      ctx.save()
+      ctx.beginPath()
+      ctx.rect(x1, y1, w, h)
+      ctx.clip()
+
+      let body = b.desc || ''
+      if (b.type === 'text' && b.text)
+        body = `"${b.text}"` + (body ? ` — ${body}` : '')
+      if (body) {
+        ctx.font = '12px monospace'
+        ctx.fillStyle = readableTextColor(col)
+        const pad = 4
+        const lh = 14
+        let ty = y1 + 15 + 12
+        for (const line of wrapLines(ctx, body, w - pad * 2)) {
+          if (ty > y1 + h) break
+          ctx.fillText(line, x1 + pad, ty)
+          ty += lh
+        }
+      }
+
+      const tr = tag_rects[i]
+      ctx.font = 'bold 11px monospace'
+      ctx.fillStyle = col
+      ctx.fillRect(tr.x, tr.y, tr.w, 14)
+      if (i === hoverTagIndex.value) {
+        ctx.fillStyle = 'rgba(255,255,255,0.25)'
+        ctx.fillRect(tr.x, tr.y, tr.w, 14)
+        ctx.strokeStyle = '#fff'
+        ctx.lineWidth = 1
+        ctx.strokeRect(tr.x + 0.5, tr.y + 0.5, tr.w - 1, 13)
+      }
+      ctx.fillStyle = textOnColor(col)
+      ctx.fillText(tr.tag, tr.x + 4, tr.y + 11)
+      ctx.restore()
+    }
+  }
+
+  function wrapLines(
+    ctx: CanvasRenderingContext2D,
+    text: string,
+    maxW: number
+  ): string[] {
+    const out: string[] = []
+    for (const para of text.split('\n')) {
+      let line = ''
+      for (const word of para.split(/\s+/)) {
+        if (!word) continue
+        const test = line ? `${line} ${word}` : word
+        if (line && ctx.measureText(test).width > maxW) {
+          out.push(line)
+          line = word
+        } else {
+          line = test
+        }
+      }
+      out.push(line)
+    }
+    return out
+  }
+
+  const hitTestPoint = (mN: { x: number; y: number }) => {
+    const { w: W, h: H } = logicalSize()
+    const cands = boxesAt(
+      state.value.regions,
+      mN.x,
+      mN.y,
+      HANDLE_PX,
+      W,
+      H,
+      activeIndex.value
+    )
+    if (!cands.length) return null
+    return (
+      cands.find((c) => c.index === activeIndex.value && c.mode !== 'move') ||
+      cands[0]
+    )
+  }
+
+  const titleAt = (mN: { x: number; y: number }) => {
+    const el = canvasEl.value
+    if (!el) return null
+    const ctx = el.getContext('2d')
+    if (!ctx) return null
+    const { w: W, h: H } = logicalSize()
+    const rects = tagRects(state.value.regions, W, H, (s) =>
+      measureWidth(ctx, s)
+    )
+    const px = mN.x * W
+    const py = mN.y * H
+    for (let i = state.value.regions.length - 1; i >= 0; i--) {
+      const r = rects[i]
+      if (r && px >= r.x && px <= r.x + r.w && py >= r.y && py <= r.y + r.h)
+        return i
+    }
+    return null
+  }
+
+  function pickForSelection(mN: { x: number; y: number }, cycle: boolean) {
+    const { w: W, h: H } = logicalSize()
+    const cands = boxesAt(
+      state.value.regions,
+      mN.x,
+      mN.y,
+      HANDLE_PX,
+      W,
+      H,
+      activeIndex.value
+    )
+    if (!cands.length) return null
+    const activeResize = cands.find(
+      (c) => c.index === activeIndex.value && c.mode !== 'move'
+    )
+    if (activeResize && !cycle) return activeResize
+    const ti = titleAt(mN)
+    if (ti !== null && !cycle) return { index: ti, mode: 'move' as HitMode }
+    if (cycle && cands.length > 1) {
+      const pos = cands.findIndex((c) => c.index === activeIndex.value)
+      return cands[(pos + 1) % cands.length]
+    }
+    return (
+      cands.find((c) => c.index === activeIndex.value && c.mode !== 'move') ||
+      cands[0]
+    )
+  }
+
+  function onPointerDown(e: PointerEvent) {
+    if (e.button !== 0) return
+    canvasEl.value?.focus()
+    hoverTagIndex.value = null
+    hoverIndex.value = null
+    const mN = pointerNorm(e)
+    const hit = pickForSelection(mN, e.altKey)
+    if (hit) {
+      activeIndex.value = hit.index
+      dragMode.value = hit.mode
+      boxAtStart.value = { ...state.value.regions[hit.index] }
+    } else {
+      dragMode.value = 'draw'
+      const nb: Region = {
+        x: mN.x,
+        y: mN.y,
+        w: 0,
+        h: 0,
+        type: 'obj',
+        text: '',
+        desc: '',
+        palette: []
+      }
+      state.value.regions.push(nb)
+      activeIndex.value = state.value.regions.length - 1
+      boxAtStart.value = { ...nb }
+    }
+    drawing.value = true
+    dragStartNorm.value = mN
+    canvasEl.value?.setPointerCapture(e.pointerId)
+    e.preventDefault()
+    requestDraw()
+  }
+
+  function onDocPointerMove(e: PointerEvent) {
+    if (
+      !drawing.value ||
+      !boxAtStart.value ||
+      !dragStartNorm.value ||
+      !dragMode.value
+    )
+      return
+    const mN = pointerNorm(e)
+    const dx = mN.x - dragStartNorm.value.x
+    const dy = mN.y - dragStartNorm.value.y
+    const nb = applyDrag(dragMode.value, boxAtStart.value, dx, dy)
+    state.value.regions[activeIndex.value] = nb
+    requestDraw()
+  }
+
+  function onDocPointerUp(e: PointerEvent) {
+    if (!drawing.value) return
+    drawing.value = false
+    canvasEl.value?.releasePointerCapture?.(e.pointerId)
+    const b = state.value.regions[activeIndex.value]
+    if (b && (b.w < 0.005 || b.h < 0.005) && dragMode.value === 'draw') {
+      removeRegion(activeIndex.value)
+    }
+    syncState()
+  }
+
+  function onCanvasPointerMove(e: PointerEvent) {
+    if (drawing.value) onDocPointerMove(e)
+    else onPointerMove(e)
+  }
+
+  function onPointerMove(e: PointerEvent) {
+    if (drawing.value) return
+    const mN = pointerNorm(e)
+    const ti = titleAt(mN)
+    const hit = hitTestPoint(mN)
+    const hb = ti !== null ? ti : hit ? hit.index : null
+    if (ti !== hoverTagIndex.value || hb !== hoverIndex.value) {
+      hoverTagIndex.value = ti
+      hoverIndex.value = hb
+      requestDraw()
+    }
+  }
+
+  function onPointerLeave() {
+    if (hoverTagIndex.value !== null || hoverIndex.value !== null) {
+      hoverTagIndex.value = null
+      hoverIndex.value = null
+      requestDraw()
+    }
+  }
+
+  const canvasCursor = computed(() =>
+    hoverTagIndex.value !== null ? 'pointer' : 'crosshair'
+  )
+
+  function onDoubleClick(e: MouseEvent) {
+    e.preventDefault()
+    const mN = pointerNormFromMouse(e)
+    const { w: W, h: H } = logicalSize()
+    const cands = boxesAt(
+      state.value.regions,
+      mN.x,
+      mN.y,
+      HANDLE_PX,
+      W,
+      H,
+      activeIndex.value
+    )
+    const target = cands.find((c) => c.index === activeIndex.value) || cands[0]
+    if (!target) return
+    openInlineEditor(target.index)
+  }
+
+  function pointerNormFromMouse(e: MouseEvent) {
+    const el = canvasEl.value
+    if (!el) return { x: 0, y: 0 }
+    const r = el.getBoundingClientRect()
+    return {
+      x: clampToCanvas((e.clientX - r.left) / r.width),
+      y: clampToCanvas((e.clientY - r.top) / r.height)
+    }
+  }
+
+  function openInlineEditor(index: number) {
+    const b = state.value.regions[index]
+    if (!b) return
+    activeIndex.value = index
+    const { w: W, h: H } = logicalSize()
+    const w = Math.min(W, Math.max(70, b.w * W))
+    const h = Math.min(H, Math.max(42, b.h * H))
+    const left = Math.max(0, Math.min(b.x * W, W - w))
+    const top = Math.max(0, Math.min(b.y * H, H - h))
+    inlineEditor.value = {
+      value: b.desc || '',
+      index,
+      style: {
+        left: `${left}px`,
+        top: `${top}px`,
+        width: `${w}px`,
+        height: `${h}px`,
+        borderColor: (b.palette || []).find(Boolean) || '#46b4e6'
+      }
+    }
+    void nextTick(() => {
+      inlineEditorEl.value?.focus()
+      inlineEditorEl.value?.select()
+    })
+  }
+
+  function onInlineKeyDown(e: KeyboardEvent) {
+    if (e.key === 'Escape') {
+      inlineEditor.value = null
+    } else if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
+      commitInlineEditor()
+    }
+  }
+
+  function commitInlineEditor() {
+    const ed = inlineEditor.value
+    if (!ed) return
+    const b = state.value.regions[ed.index]
+    if (b) b.desc = ed.value
+    inlineEditor.value = null
+    syncState()
+  }
+
+  function onCanvasKeyDown(e: KeyboardEvent) {
+    if (drawing.value) return
+    const idx = activeIndex.value
+    if ((e.key === 'Delete' || e.key === 'Backspace') && idx >= 0) {
+      e.preventDefault()
+      e.stopPropagation()
+      removeRegion(idx)
+      syncState()
+    }
+  }
+
+  function removeRegion(i: number) {
+    state.value.regions.splice(i, 1)
+    if (!state.value.regions.length) activeIndex.value = -1
+    else if (i <= activeIndex.value)
+      activeIndex.value = Math.max(0, activeIndex.value - 1)
+  }
+
+  function setActiveType(t: 'obj' | 'text') {
+    if (activeRegion.value) {
+      activeRegion.value.type = t
+      syncState()
+    }
+  }
+
+  function clearAll() {
+    state.value.regions = []
+    activeIndex.value = -1
+    syncState()
+  }
+
+  function syncState() {
+    modelValue.value = toBoundingBoxes(
+      state.value.regions,
+      widthValue.value,
+      heightValue.value
+    )
+    requestDraw()
+  }
+
+  watch(containerWidth, () => requestDraw())
+  watch(
+    () => state.value.regions.length,
+    () => requestDraw()
+  )
+  watch(isNodeSelected, () => requestDraw())
+  watch([widthValue, heightValue], () => syncState())
+
+  const nodeOutputStore = useNodeOutputStore()
+  function applyImageDimensions(naturalWidth: number, naturalHeight: number) {
+    const node = litegraphNode.value
+    if (!node) return
+    const snap = (v: number) =>
+      Math.max(DIMENSION_STEP, Math.round(v / DIMENSION_STEP) * DIMENSION_STEP)
+    const targetW = snap(naturalWidth)
+    const targetH = snap(naturalHeight)
+    const widthWidget = node.widgets?.find((w) => w.name === 'width')
+    const heightWidget = node.widgets?.find((w) => w.name === 'height')
+    if (widthWidget && widthWidget.value !== targetW) {
+      widthWidget.value = targetW
+      widthWidget.callback?.(targetW)
+    }
+    if (heightWidget && heightWidget.value !== targetH) {
+      heightWidget.value = targetH
+      heightWidget.callback?.(targetH)
+    }
+  }
+
+  let lastBgUrl = ''
+  function updateBgImage() {
+    const node = litegraphNode.value
+    if (!node) return
+    const slot = node.findInputSlot('background')
+    const inputNode = slot >= 0 ? node.getInputNode(slot) : null
+    const url = inputNode
+      ? nodeOutputStore.getNodeImageUrls(inputNode)?.[0]
+      : undefined
+    if (!url) {
+      if (bgImage.value) {
+        bgImage.value = null
+        lastBgUrl = ''
+        requestDraw()
+      }
+      return
+    }
+    if (url === lastBgUrl) return
+    lastBgUrl = url
+    const currentUrl = url
+    const img = new Image()
+    img.crossOrigin = 'anonymous'
+    img.onload = () => {
+      if (currentUrl !== lastBgUrl) return
+      bgImage.value = img
+      applyImageDimensions(img.naturalWidth, img.naturalHeight)
+      requestDraw()
+    }
+    img.src = url
+  }
+  watch(() => nodeOutputStore.nodeOutputs, updateBgImage, { deep: true })
+  watch(() => nodeOutputStore.nodePreviewImages, updateBgImage, { deep: true })
+
+  updateBgImage()
+  void nextTick(() => requestDraw())
+
+  onBeforeUnmount(() => {
+    if (rafHandle) cancelAnimationFrame(rafHandle)
+  })
+
+  return {
+    canvasStyle,
+    canvasCursor,
+    focused,
+    activeRegion,
+    hasRegions,
+    inlineEditor,
+    maxColors: MAX_ELEMENT_COLORS,
+    onPointerDown,
+    onCanvasPointerMove,
+    onDocPointerUp,
+    onPointerLeave,
+    onDoubleClick,
+    onCanvasKeyDown,
+    onInlineKeyDown,
+    commitInlineEditor,
+    setActiveType,
+    clearAll,
+    syncState
+  }
+}
diff --git a/src/composables/graph/useErrorClearingHooks.test.ts b/src/composables/graph/useErrorClearingHooks.test.ts
index fd61e2e9c0..209144d7df 100644
--- a/src/composables/graph/useErrorClearingHooks.test.ts
+++ b/src/composables/graph/useErrorClearingHooks.test.ts
@@ -21,6 +21,7 @@ import { useMissingModelStore } from '@/platform/missingModel/missingModelStore'
 import { useMissingNodesErrorStore } from '@/platform/nodeReplacement/missingNodesErrorStore'
 import { app } from '@/scripts/app'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
 import { seedRequiredInputMissingNodeError } from '@/utils/__tests__/executionErrorTestUtils'
 import type { MissingMediaCandidate } from '@/platform/missingMedia/types'
 import type { MissingModelCandidate } from '@/platform/missingModel/types'
@@ -50,7 +51,11 @@ describe('Connection error clearing via onConnectionsChange', () => {
 
     const store = useExecutionErrorStore()
     vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(graph)
-    seedRequiredInputMissingNodeError(store, String(node.id), 'clip')
+    seedRequiredInputMissingNodeError(
+      store,
+      createNodeExecutionId([node.id]),
+      'clip'
+    )
 
     node.onConnectionsChange!(NodeSlotType.INPUT, 0, true, null, node.inputs[0])
 
@@ -62,7 +67,11 @@ describe('Connection error clearing via onConnectionsChange', () => {
     installErrorClearingHooks(graph)
 
     const store = useExecutionErrorStore()
-    seedRequiredInputMissingNodeError(store, String(node.id), 'clip')
+    seedRequiredInputMissingNodeError(
+      store,
+      createNodeExecutionId([node.id]),
+      'clip'
+    )
 
     node.onConnectionsChange!(
       NodeSlotType.INPUT,
@@ -81,7 +90,11 @@ describe('Connection error clearing via onConnectionsChange', () => {
     installErrorClearingHooks(graph)
 
     const store = useExecutionErrorStore()
-    seedRequiredInputMissingNodeError(store, String(node.id), 'clip')
+    seedRequiredInputMissingNodeError(
+      store,
+      createNodeExecutionId([node.id]),
+      'clip'
+    )
 
     node.onConnectionsChange!(
       NodeSlotType.OUTPUT,
@@ -103,7 +116,11 @@ describe('Connection error clearing via onConnectionsChange', () => {
 
     const store = useExecutionErrorStore()
     vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(graph)
-    seedRequiredInputMissingNodeError(store, String(node.id), 'model')
+    seedRequiredInputMissingNodeError(
+      store,
+      createNodeExecutionId([node.id]),
+      'model'
+    )
 
     node.onConnectionsChange!(NodeSlotType.INPUT, 0, true, null, node.inputs[0])
 
@@ -229,7 +246,11 @@ describe('Widget change error clearing via onWidgetChanged', () => {
     const store = useExecutionErrorStore()
     const mediaStore = useMissingMediaStore()
     vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(graph)
-    seedRequiredInputMissingNodeError(store, String(node.id), 'image')
+    seedRequiredInputMissingNodeError(
+      store,
+      createNodeExecutionId([node.id]),
+      'image'
+    )
     mediaStore.setMissingMedia([
       {
         nodeId: String(node.id),
@@ -279,7 +300,11 @@ describe('installErrorClearingHooks lifecycle', () => {
     // Verify the hooks actually work
     const store = useExecutionErrorStore()
     vi.spyOn(app, 'rootGraph', 'get').mockReturnValue(graph)
-    seedRequiredInputMissingNodeError(store, String(lateNode.id), 'value')
+    seedRequiredInputMissingNodeError(
+      store,
+      createNodeExecutionId([lateNode.id]),
+      'value'
+    )
 
     lateNode.onConnectionsChange!(
       NodeSlotType.INPUT,
diff --git a/src/composables/graph/useErrorClearingHooks.ts b/src/composables/graph/useErrorClearingHooks.ts
index f60789c966..68496ef7a4 100644
--- a/src/composables/graph/useErrorClearingHooks.ts
+++ b/src/composables/graph/useErrorClearingHooks.ts
@@ -34,6 +34,7 @@ import { useNodeReplacementStore } from '@/platform/nodeReplacement/nodeReplacem
 import { getCnrIdFromNode } from '@/platform/nodeReplacement/cnrIdUtil'
 import { app } from '@/scripts/app'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
+import { appendNodeExecutionId } from '@/types/nodeIdentification'
 import { useModelToNodeStore } from '@/stores/modelToNodeStore'
 import {
   collectAllNodes,
@@ -83,7 +84,7 @@ function installNodeHooks(node: LGraphNode): void {
 
       const promotedSource = widgetPromotedSource(node, widget)
       const executionId = promotedSource
-        ? `${hostExecId}:${promotedSource.nodeId}`
+        ? appendNodeExecutionId(hostExecId, promotedSource.nodeId)
         : hostExecId
       const widgetName = promotedSource?.widgetName ?? widget.name
 
diff --git a/src/composables/graph/useGraphNodeManager.test.ts b/src/composables/graph/useGraphNodeManager.test.ts
index ccc6969849..c94a9ffeba 100644
--- a/src/composables/graph/useGraphNodeManager.test.ts
+++ b/src/composables/graph/useGraphNodeManager.test.ts
@@ -703,3 +703,55 @@ describe('reconcileNodeErrorFlags (via lastNodeErrors watcher)', () => {
     expect(subgraphNode.has_errors).toBe(true)
   })
 })
+
+describe('Pre-remove vueNodeData drain', () => {
+  beforeEach(() => {
+    setActivePinia(createTestingPinia({ stubActions: false }))
+  })
+
+  it('drops vueNodeData entry before node.onRemoved fires', () => {
+    const graph = new LGraph()
+    const node = new LGraphNode('test')
+    graph.add(node)
+    const { vueNodeData } = useGraphNodeManager(graph)
+
+    expect(vueNodeData.has(String(node.id))).toBe(true)
+
+    let dataPresentInOnRemoved: boolean | undefined
+    node.onRemoved = () => {
+      dataPresentInOnRemoved = vueNodeData.has(String(node.id))
+    }
+
+    graph.remove(node)
+
+    expect(
+      dataPresentInOnRemoved,
+      'vueNodeData entry must be cleared before node.onRemoved fires so reactive consumers cannot observe the detached node'
+    ).toBe(false)
+  })
+
+  it('clears vueNodeData when LGraph.clear() dispatches node:before-removed for each node', () => {
+    const graph = new LGraph()
+    const nodeA = new LGraphNode('a')
+    const nodeB = new LGraphNode('b')
+    graph.add(nodeA)
+    graph.add(nodeB)
+    const { vueNodeData } = useGraphNodeManager(graph)
+
+    expect(vueNodeData.size).toBe(2)
+
+    const beforeRemovedSpy = vi.fn()
+    graph.events.addEventListener('node:before-removed', beforeRemovedSpy)
+
+    graph.clear()
+
+    expect(
+      beforeRemovedSpy,
+      'clear() must dispatch node:before-removed so reactive consumers can drop refs before nodes detach'
+    ).toHaveBeenCalledTimes(2)
+    expect(
+      vueNodeData.size,
+      'node:before-removed listener must drain vueNodeData when clear() removes every node'
+    ).toBe(0)
+  })
+})
diff --git a/src/composables/graph/useGraphNodeManager.ts b/src/composables/graph/useGraphNodeManager.ts
index 1a1fbb8560..1e29ecc4d9 100644
--- a/src/composables/graph/useGraphNodeManager.ts
+++ b/src/composables/graph/useGraphNodeManager.ts
@@ -30,6 +30,8 @@ import { useWidgetValueStore } from '@/stores/widgetValueStore'
 import type { WidgetValue, SafeControlWidget } from '@/types/simplifiedWidget'
 import { normalizeControlOption } from '@/types/simplifiedWidget'
 import { getWidgetIdForNode } from '@/utils/litegraphUtil'
+import type { NodeId as WorkflowNodeId } from '@/platform/workflow/validation/schemas/workflowSchema'
+import type { NodeExecutionId } from '@/types/nodeIdentification'
 import type { WidgetId } from '@/types/widgetId'
 
 import type {
@@ -94,7 +96,7 @@ export interface SafeWidgetData {
    * host subgraph node. Used for missing-model lookups that key by
    * execution ID (e.g. `"65:42"` vs the host node's `"65"`).
    */
-  sourceExecutionId?: string
+  sourceExecutionId?: NodeExecutionId
   /**
    * Interior source widget name. Only set for promoted widgets, where `name`
    * is the host input slot name; missing-model lookups key by the interior
@@ -137,7 +139,7 @@ export interface GraphNodeManager {
   vueNodeData: ReadonlyMap<string, VueNodeData>
 
   // Access to original LiteGraph nodes (non-reactive)
-  getNode(id: string): LGraphNode | undefined
+  getNode(id: WorkflowNodeId): LGraphNode | undefined
 
   // Lifecycle methods
   cleanup(): void
@@ -225,7 +227,7 @@ function isDOMBackedWidget(widget: IBaseWidget): boolean {
 interface PromotedWidgetMetadata {
   controlWidget?: SafeControlWidget
   isDOMWidget: boolean
-  sourceExecutionId?: string
+  sourceExecutionId?: NodeExecutionId
   sourceWidgetName?: string
 }
 
@@ -516,8 +518,8 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
   }
 
   // Get access to original LiteGraph node (non-reactive)
-  const getNode = (id: string): LGraphNode | undefined => {
-    return nodeRefs.get(id)
+  const getNode = (id: WorkflowNodeId): LGraphNode | undefined => {
+    return nodeRefs.get(String(id))
   }
 
   const syncWithGraph = () => {
@@ -608,27 +610,20 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
     }
   }
 
-  /**
-   * Handles node removal from the graph - cleans up all references
-   */
+  const dropNodeReferences = (node: LGraphNode) => {
+    const id = String(node.id)
+    nodeRefs.delete(id)
+    vueNodeData.delete(id)
+  }
+
   const handleNodeRemoved = (
     node: LGraphNode,
     originalCallback?: (node: LGraphNode) => void
   ) => {
     const id = String(node.id)
-
-    // Remove node from layout store
     setSource(LayoutSource.Canvas)
     void deleteNode(id)
-
-    // Clean up all tracking references
-    nodeRefs.delete(id)
-    vueNodeData.delete(id)
-
-    // Call original callback if provided
-    if (originalCallback) {
-      originalCallback(node)
-    }
+    originalCallback?.(node)
   }
 
   /**
@@ -637,7 +632,8 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
   const createCleanupFunction = (
     originalOnNodeAdded: ((node: LGraphNode) => void) | undefined,
     originalOnNodeRemoved: ((node: LGraphNode) => void) | undefined,
-    originalOnTrigger: ((event: LGraphTriggerEvent) => void) | undefined
+    originalOnTrigger: ((event: LGraphTriggerEvent) => void) | undefined,
+    beforeNodeRemovedListener: (e: CustomEvent<{ node: LGraphNode }>) => void
   ) => {
     return () => {
       // Restore original callbacks
@@ -645,15 +641,17 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
       graph.onNodeRemoved = originalOnNodeRemoved || undefined
       graph.onTrigger = originalOnTrigger || undefined
 
+      graph.events.removeEventListener(
+        'node:before-removed',
+        beforeNodeRemovedListener
+      )
+
       // Clear all state maps
       nodeRefs.clear()
       vueNodeData.clear()
     }
   }
 
-  /**
-   * Sets up event listeners - now simplified with extracted handlers
-   */
   const setupEventListeners = (): (() => void) => {
     // Store original callbacks
     const originalOnNodeAdded = graph.onNodeAdded
@@ -669,6 +667,16 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
       handleNodeRemoved(node, originalOnNodeRemoved)
     }
 
+    const beforeNodeRemovedListener = (
+      e: CustomEvent<{ node: LGraphNode }>
+    ) => {
+      dropNodeReferences(e.detail.node)
+    }
+    graph.events.addEventListener(
+      'node:before-removed',
+      beforeNodeRemovedListener
+    )
+
     const triggerHandlers: {
       [K in LGraphTriggerAction]: (event: LGraphTriggerParam<K>) => void
     } = {
@@ -817,11 +825,11 @@ export function useGraphNodeManager(graph: LGraph): GraphNodeManager {
     // Initialize state
     syncWithGraph()
 
-    // Return cleanup function
     return createCleanupFunction(
       originalOnNodeAdded || undefined,
       originalOnNodeRemoved || undefined,
-      originalOnTrigger || undefined
+      originalOnTrigger || undefined,
+      beforeNodeRemovedListener
     )
   }
 
diff --git a/src/composables/graph/useGroupContextMenu.test.ts b/src/composables/graph/useGroupContextMenu.test.ts
new file mode 100644
index 0000000000..7c77adf84c
--- /dev/null
+++ b/src/composables/graph/useGroupContextMenu.test.ts
@@ -0,0 +1,184 @@
+import { fromAny, fromPartial } from '@total-typescript/shoehorn'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { useGroupContextMenu } from '@/composables/graph/useGroupContextMenu'
+import type {
+  CanvasPointerEvent,
+  LGraphNode
+} from '@/lib/litegraph/src/litegraph'
+import { LGraphCanvas, LiteGraph } from '@/lib/litegraph/src/litegraph'
+
+const {
+  mockShowNodeOptions,
+  mockUpdateSelectedItems,
+  mockGetCanvasContextMenuTarget
+} = vi.hoisted(() => ({
+  mockShowNodeOptions: vi.fn(),
+  mockUpdateSelectedItems: vi.fn(),
+  mockGetCanvasContextMenuTarget: vi.fn<
+    () => { reroute?: unknown; group?: unknown }
+  >(() => ({}))
+}))
+
+vi.mock('@/composables/graph/useMoreOptionsMenu', () => ({
+  showNodeOptions: mockShowNodeOptions
+}))
+
+vi.mock('@/renderer/core/canvas/canvasStore', () => ({
+  useCanvasStore: () => ({ updateSelectedItems: mockUpdateSelectedItems })
+}))
+
+vi.mock('@/lib/litegraph/src/canvas/getCanvasContextMenuTarget', () => ({
+  getCanvasContextMenuTarget: mockGetCanvasContextMenuTarget
+}))
+
+interface StubCanvas {
+  graph: object
+  deselectAll: ReturnType<typeof vi.fn>
+  selectedItems: Set<unknown>
+  state: { selectionChanged: boolean }
+}
+
+describe('useGroupContextMenu', () => {
+  const event = fromPartial<CanvasPointerEvent>({ canvasX: 10, canvasY: 20 })
+  let group: {
+    id: number
+    selected?: boolean
+    recomputeInsideNodes: ReturnType<typeof vi.fn>
+  }
+  let legacyMenuMock: ReturnType<typeof vi.fn>
+  let stubCanvas: StubCanvas
+
+  beforeEach(() => {
+    vi.clearAllMocks()
+    LiteGraph.vueNodesMode = true
+    group = { id: 1, recomputeInsideNodes: vi.fn() }
+    mockGetCanvasContextMenuTarget.mockReturnValue({ group })
+
+    legacyMenuMock = vi.fn()
+    LGraphCanvas.prototype.processContextMenu = fromAny(legacyMenuMock)
+
+    useGroupContextMenu()
+
+    stubCanvas = {
+      graph: {},
+      deselectAll: vi.fn(),
+      selectedItems: new Set(),
+      state: { selectionChanged: false }
+    }
+    stubCanvas.deselectAll.mockImplementation(() => {
+      stubCanvas.selectedItems.clear()
+    })
+  })
+
+  function invoke(node: LGraphNode | undefined) {
+    LGraphCanvas.prototype.processContextMenu.call(
+      fromAny(stubCanvas),
+      node,
+      event
+    )
+  }
+
+  it('opens the Vue menu and selects only the group in Nodes 2.0 mode', () => {
+    invoke(undefined)
+
+    expect(stubCanvas.deselectAll).toHaveBeenCalledOnce()
+    expect(group.selected).toBe(true)
+    expect(stubCanvas.selectedItems.has(group)).toBe(true)
+    expect(stubCanvas.state.selectionChanged).toBe(true)
+    expect(group.recomputeInsideNodes).toHaveBeenCalledOnce()
+    expect(mockUpdateSelectedItems).toHaveBeenCalledOnce()
+    expect(mockShowNodeOptions).toHaveBeenCalledWith(event)
+    expect(mockUpdateSelectedItems.mock.invocationCallOrder[0]).toBeLessThan(
+      mockShowNodeOptions.mock.invocationCallOrder[0]
+    )
+    expect(legacyMenuMock).not.toHaveBeenCalled()
+  })
+
+  it('falls through to the legacy menu when a node is under the cursor', () => {
+    invoke(fromPartial<LGraphNode>({}))
+
+    expect(mockGetCanvasContextMenuTarget).not.toHaveBeenCalled()
+    expect(legacyMenuMock).toHaveBeenCalledOnce()
+    expect(mockShowNodeOptions).not.toHaveBeenCalled()
+  })
+
+  it('falls through to the legacy menu in legacy (non-Nodes 2.0) mode', () => {
+    LiteGraph.vueNodesMode = false
+
+    invoke(undefined)
+
+    expect(mockGetCanvasContextMenuTarget).not.toHaveBeenCalled()
+    expect(legacyMenuMock).toHaveBeenCalledOnce()
+    expect(mockShowNodeOptions).not.toHaveBeenCalled()
+  })
+
+  it('falls through to the legacy menu when no group is under the cursor', () => {
+    mockGetCanvasContextMenuTarget.mockReturnValue({})
+
+    invoke(undefined)
+
+    expect(legacyMenuMock).toHaveBeenCalledOnce()
+    expect(mockShowNodeOptions).not.toHaveBeenCalled()
+    expect(stubCanvas.selectedItems.size).toBe(0)
+  })
+
+  it('falls through to the legacy menu when the cursor is on a reroute', () => {
+    mockGetCanvasContextMenuTarget.mockReturnValue({
+      reroute: { id: 5 },
+      group
+    })
+
+    invoke(undefined)
+
+    expect(legacyMenuMock).toHaveBeenCalledOnce()
+    expect(mockShowNodeOptions).not.toHaveBeenCalled()
+    expect(stubCanvas.selectedItems.size).toBe(0)
+  })
+
+  it('keeps the menu open without re-selecting when only the group is selected', () => {
+    group.selected = true
+    stubCanvas.selectedItems.add(group)
+
+    invoke(undefined)
+
+    expect(stubCanvas.deselectAll).not.toHaveBeenCalled()
+    expect(stubCanvas.selectedItems.size).toBe(1)
+    expect(stubCanvas.selectedItems.has(group)).toBe(true)
+    expect(stubCanvas.state.selectionChanged).toBe(false)
+    expect(group.recomputeInsideNodes).not.toHaveBeenCalled()
+    expect(mockUpdateSelectedItems).toHaveBeenCalledOnce()
+    expect(mockShowNodeOptions).toHaveBeenCalledWith(event)
+    expect(legacyMenuMock).not.toHaveBeenCalled()
+  })
+
+  it('reselects the group when selected child nodes would hide group actions', () => {
+    const childNode = { selected: true }
+    group.selected = true
+    stubCanvas.selectedItems.add(group)
+    stubCanvas.selectedItems.add(childNode)
+
+    invoke(undefined)
+
+    expect(stubCanvas.deselectAll).toHaveBeenCalledOnce()
+    expect(stubCanvas.selectedItems.size).toBe(1)
+    expect(stubCanvas.selectedItems.has(group)).toBe(true)
+    expect(stubCanvas.state.selectionChanged).toBe(true)
+    expect(group.recomputeInsideNodes).toHaveBeenCalledOnce()
+    expect(mockUpdateSelectedItems).toHaveBeenCalledOnce()
+    expect(mockShowNodeOptions).toHaveBeenCalledWith(event)
+    expect(legacyMenuMock).not.toHaveBeenCalled()
+  })
+
+  it('falls through to the legacy menu when the canvas has no graph', () => {
+    LGraphCanvas.prototype.processContextMenu.call(
+      fromAny({ deselectAll: vi.fn() }),
+      undefined,
+      event
+    )
+
+    expect(mockGetCanvasContextMenuTarget).not.toHaveBeenCalled()
+    expect(legacyMenuMock).toHaveBeenCalledOnce()
+    expect(mockShowNodeOptions).not.toHaveBeenCalled()
+  })
+})
diff --git a/src/composables/graph/useGroupContextMenu.ts b/src/composables/graph/useGroupContextMenu.ts
new file mode 100644
index 0000000000..0e428f6da6
--- /dev/null
+++ b/src/composables/graph/useGroupContextMenu.ts
@@ -0,0 +1,49 @@
+import { showNodeOptions } from '@/composables/graph/useMoreOptionsMenu'
+import { getCanvasContextMenuTarget } from '@/lib/litegraph/src/canvas/getCanvasContextMenuTarget'
+import { LGraphCanvas, LiteGraph } from '@/lib/litegraph/src/litegraph'
+import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
+
+/**
+ * Routes Nodes 2.0 group right-clicks to Vue while nodes, reroutes,
+ * background, and legacy mode stay on litegraph.
+ */
+export function useGroupContextMenu() {
+  const original = LGraphCanvas.prototype.processContextMenu
+
+  function processContextMenuWithVueGroupMenu(
+    this: LGraphCanvas,
+    ...args: Parameters<typeof original>
+  ): void {
+    const [node, event] = args
+
+    if (node || !LiteGraph.vueNodesMode || !this.graph) {
+      original.apply(this, args)
+      return
+    }
+
+    const { reroute, group } = getCanvasContextMenuTarget(
+      this,
+      event.canvasX,
+      event.canvasY
+    )
+    if (reroute || !group) {
+      original.apply(this, args)
+      return
+    }
+
+    const groupIsOnlySelection =
+      this.selectedItems.size === 1 && this.selectedItems.has(group)
+
+    if (!groupIsOnlySelection) {
+      this.deselectAll()
+      group.selected = true
+      group.recomputeInsideNodes()
+      this.selectedItems.add(group)
+      this.state.selectionChanged = true
+    }
+    useCanvasStore().updateSelectedItems()
+    showNodeOptions(event)
+  }
+
+  LGraphCanvas.prototype.processContextMenu = processContextMenuWithVueGroupMenu
+}
diff --git a/src/composables/maskeditor/useMaskEditorSaver.test.ts b/src/composables/maskeditor/useMaskEditorSaver.test.ts
index 7031bf0189..5a49df7660 100644
--- a/src/composables/maskeditor/useMaskEditorSaver.test.ts
+++ b/src/composables/maskeditor/useMaskEditorSaver.test.ts
@@ -181,4 +181,24 @@ describe('useMaskEditorSaver', () => {
     expect(store.nodeOutputs[locatorId]).toBeDefined()
     expect(store.nodeOutputs[locatorId]?.images?.length).toBeGreaterThan(0)
   })
+
+  it('omits subfolder from the upload FormData under the unified contract', async () => {
+    const fetchApiMock = vi.mocked(api.fetchApi)
+
+    const { save } = useMaskEditorSaver()
+    await save()
+
+    // The unified contract uploads to /upload/image with only image + type;
+    // subfolder is intentionally omitted (the server assigns it). Assert it
+    // here so the next reader knows the omission is deliberate, not accidental.
+    expect(fetchApiMock).toHaveBeenCalledWith(
+      '/upload/image',
+      expect.objectContaining({ method: 'POST' })
+    )
+    const [, init] = fetchApiMock.mock.calls[0]
+    const body = init?.body as FormData
+    expect(body).toBeInstanceOf(FormData)
+    expect(body.get('type')).toBe('input')
+    expect(body.get('subfolder')).toBeNull()
+  })
 })
diff --git a/src/composables/maskeditor/useMaskEditorSaver.ts b/src/composables/maskeditor/useMaskEditorSaver.ts
index 17b82f8c5f..c903d0f40c 100644
--- a/src/composables/maskeditor/useMaskEditorSaver.ts
+++ b/src/composables/maskeditor/useMaskEditorSaver.ts
@@ -1,3 +1,5 @@
+import type { UploadImageResponse } from '@comfyorg/ingest-types'
+
 import { useMaskEditorDataStore } from '@/stores/maskEditorDataStore'
 import { useMaskEditorStore } from '@/stores/maskEditorStore'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
@@ -6,7 +8,6 @@ import type {
   EditorOutputLayer,
   ImageRef
 } from '@/stores/maskEditorDataStore'
-import { isCloud } from '@/platform/distribution/types'
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
 import { createAnnotatedPath } from '@/utils/createAnnotatedPath'
@@ -209,18 +210,11 @@ export function useMaskEditorSaver() {
   }
 
   async function uploadAllLayers(outputData: EditorOutputData): Promise<void> {
-    const sourceRef = dataStore.inputData!.sourceRef
-
-    const actualMaskedRef = await uploadMask(outputData.maskedImage, sourceRef)
-    const actualPaintRef = await uploadImage(outputData.paintLayer, sourceRef)
-    const actualPaintedRef = await uploadImage(
-      outputData.paintedImage,
-      sourceRef
-    )
-
-    const actualPaintedMaskedRef = await uploadMask(
-      outputData.paintedMaskedImage,
-      actualPaintedRef
+    const actualMaskedRef = await uploadLayer(outputData.maskedImage)
+    const actualPaintRef = await uploadLayer(outputData.paintLayer)
+    const actualPaintedRef = await uploadLayer(outputData.paintedImage)
+    const actualPaintedMaskedRef = await uploadLayer(
+      outputData.paintedMaskedImage
     )
 
     outputData.maskedImage.ref = actualMaskedRef
@@ -229,50 +223,10 @@ export function useMaskEditorSaver() {
     outputData.paintedMaskedImage.ref = actualPaintedMaskedRef
   }
 
-  async function uploadMask(
-    layer: EditorOutputLayer,
-    originalRef: ImageRef
-  ): Promise<ImageRef> {
+  async function uploadLayer(layer: EditorOutputLayer): Promise<ImageRef> {
     const formData = new FormData()
     formData.append('image', layer.blob, layer.ref.filename)
-    formData.append('original_ref', JSON.stringify(originalRef))
     formData.append('type', 'input')
-    formData.append('subfolder', 'clipspace')
-
-    const response = await api.fetchApi('/upload/mask', {
-      method: 'POST',
-      body: formData
-    })
-
-    if (!response.ok) {
-      throw new Error(`Failed to upload mask: ${layer.ref.filename}`)
-    }
-
-    try {
-      const data = await response.json()
-      if (data?.name) {
-        return {
-          filename: data.name,
-          subfolder: data.subfolder || layer.ref.subfolder,
-          type: data.type || layer.ref.type
-        }
-      }
-    } catch (error) {
-      console.warn('[MaskEditorSaver] Failed to parse upload response:', error)
-    }
-
-    return layer.ref
-  }
-
-  async function uploadImage(
-    layer: EditorOutputLayer,
-    originalRef: ImageRef
-  ): Promise<ImageRef> {
-    const formData = new FormData()
-    formData.append('image', layer.blob, layer.ref.filename)
-    formData.append('original_ref', JSON.stringify(originalRef))
-    formData.append('type', 'input')
-    formData.append('subfolder', 'clipspace')
 
     const response = await api.fetchApi('/upload/image', {
       method: 'POST',
@@ -280,23 +234,35 @@ export function useMaskEditorSaver() {
     })
 
     if (!response.ok) {
-      throw new Error(`Failed to upload image: ${layer.ref.filename}`)
+      const body = await response.text().catch(() => '')
+      throw new Error(
+        `Failed to upload ${layer.ref.filename} (${response.status}${body ? `: ${body}` : ''})`
+      )
     }
 
+    let data: UploadImageResponse
     try {
-      const data = await response.json()
-      if (data?.name) {
-        return {
-          filename: data.name,
-          subfolder: data.subfolder || layer.ref.subfolder,
-          type: data.type || layer.ref.type
-        }
-      }
+      data = await response.json()
     } catch (error) {
-      console.warn('[MaskEditorSaver] Failed to parse upload response:', error)
+      throw new Error(
+        `Invalid upload response for ${layer.ref.filename}: ${
+          error instanceof Error ? error.message : String(error)
+        }`,
+        { cause: error }
+      )
     }
 
-    return layer.ref
+    if (!data?.name) {
+      throw new Error(
+        `Upload response missing 'name' for ${layer.ref.filename}`
+      )
+    }
+
+    return {
+      filename: data.name,
+      subfolder: data.subfolder || '',
+      type: data.type || 'input'
+    }
   }
 
   async function updateNodePreview(
@@ -322,19 +288,8 @@ export function useMaskEditorSaver() {
 
     const imageWidget = node.widgets?.find((w) => w.name === 'image')
     if (imageWidget) {
-      // Widget value format differs between Cloud and OSS:
-      // - Cloud: JUST the filename (subfolder handled by backend)
-      // - OSS: subfolder/filename (traditional format)
-      let widgetValue: string
-      if (isCloud) {
-        widgetValue =
-          mainRef.filename + (mainRef.type ? ` [${mainRef.type}]` : '')
-      } else {
-        widgetValue =
-          (mainRef.subfolder ? mainRef.subfolder + '/' : '') +
-          mainRef.filename +
-          (mainRef.type ? ` [${mainRef.type}]` : '')
-      }
+      const widgetValue =
+        mainRef.filename + (mainRef.type ? ` [${mainRef.type}]` : '')
 
       imageWidget.value = widgetValue
 
diff --git a/src/composables/node/startModelNodeDragFromAsset.test.ts b/src/composables/node/startModelNodeDragFromAsset.test.ts
new file mode 100644
index 0000000000..bf19b73ae3
--- /dev/null
+++ b/src/composables/node/startModelNodeDragFromAsset.test.ts
@@ -0,0 +1,87 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
+import { startModelNodeDragFromAsset } from '@/composables/node/startModelNodeDragFromAsset'
+
+const { mockStartDrag, mockGetNodeProvider } = vi.hoisted(() => ({
+  mockStartDrag: vi.fn(),
+  mockGetNodeProvider: vi.fn()
+}))
+
+vi.mock('@/composables/node/useNodeDragToCanvas', () => ({
+  useNodeDragToCanvas: () => ({ startDrag: mockStartDrag })
+}))
+
+vi.mock('@/stores/modelToNodeStore', () => ({
+  useModelToNodeStore: () => ({ getNodeProvider: mockGetNodeProvider })
+}))
+
+function createAsset(overrides: Partial<AssetItem> = {}): AssetItem {
+  return {
+    id: 'asset-123',
+    name: 'sd_xl_base_1.0.safetensors',
+    size: 1024,
+    created_at: '2025-10-01T00:00:00Z',
+    tags: ['models', 'checkpoints'],
+    user_metadata: { filename: 'sd_xl_base_1.0.safetensors' },
+    ...overrides
+  }
+}
+
+describe('startModelNodeDragFromAsset', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    vi.spyOn(console, 'error').mockImplementation(() => {})
+  })
+
+  it('starts a ghost drag for the resolved node carrying the widget value', () => {
+    const nodeDef = { name: 'CheckpointLoaderSimple' }
+    mockGetNodeProvider.mockReturnValue({ nodeDef, key: 'ckpt_name' })
+
+    const error = startModelNodeDragFromAsset(createAsset())
+
+    expect(error).toBeUndefined()
+    expect(mockStartDrag).toHaveBeenCalledWith(nodeDef, {
+      widgetValues: { ckpt_name: 'sd_xl_base_1.0.safetensors' },
+      source: 'sidebar_drag'
+    })
+  })
+
+  it('threads the node-add source through to the drag', () => {
+    const nodeDef = { name: 'CheckpointLoaderSimple' }
+    mockGetNodeProvider.mockReturnValue({ nodeDef, key: 'ckpt_name' })
+
+    startModelNodeDragFromAsset(createAsset(), 'asset_browser')
+
+    expect(mockStartDrag).toHaveBeenCalledWith(nodeDef, {
+      widgetValues: { ckpt_name: 'sd_xl_base_1.0.safetensors' },
+      source: 'asset_browser'
+    })
+  })
+
+  it('carries no widget value when the provider has no key', () => {
+    const nodeDef = { name: 'FL_ChatterboxVC' }
+    mockGetNodeProvider.mockReturnValue({ nodeDef, key: '' })
+
+    startModelNodeDragFromAsset(
+      createAsset({
+        tags: ['models', 'chatterbox/chatterbox_vc'],
+        user_metadata: { filename: 'chatterbox_vc_model.pt' }
+      })
+    )
+
+    expect(mockStartDrag).toHaveBeenCalledWith(nodeDef, {
+      widgetValues: undefined,
+      source: 'sidebar_drag'
+    })
+  })
+
+  it('returns the resolution error and does not start a drag for an invalid asset', () => {
+    mockGetNodeProvider.mockReturnValue(null)
+
+    const error = startModelNodeDragFromAsset(createAsset())
+
+    expect(error?.code).toBe('NO_PROVIDER')
+    expect(mockStartDrag).not.toHaveBeenCalled()
+  })
+})
diff --git a/src/composables/node/startModelNodeDragFromAsset.ts b/src/composables/node/startModelNodeDragFromAsset.ts
new file mode 100644
index 0000000000..7cebf0dab1
--- /dev/null
+++ b/src/composables/node/startModelNodeDragFromAsset.ts
@@ -0,0 +1,38 @@
+import { useNodeDragToCanvas } from '@/composables/node/useNodeDragToCanvas'
+import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
+import { resolveModelNodeFromAsset } from '@/platform/assets/utils/resolveModelNodeFromAsset'
+import type { ResolveModelNodeError } from '@/platform/assets/utils/resolveModelNodeFromAsset'
+import type { NodeAddSource } from '@/platform/telemetry/types'
+import type { ModelNodeProvider } from '@/stores/modelToNodeStore'
+
+/**
+ * Arms a ghost drag for a model loader node. Providers with no widget key
+ * (auto-load nodes) start the drag without widget values.
+ */
+export function startModelLoaderDrag(
+  provider: ModelNodeProvider,
+  filename: string,
+  source: NodeAddSource = 'sidebar_drag'
+) {
+  const widgetValues = provider.key ? { [provider.key]: filename } : undefined
+  useNodeDragToCanvas().startDrag(provider.nodeDef, { widgetValues, source })
+}
+
+/**
+ * Starts a ghost drag for the model loader node described by an asset. The
+ * node is created where the user next clicks the canvas, with the asset's
+ * filename written into the loader widget.
+ *
+ * @returns the resolution error when the asset cannot be mapped to a node,
+ *   otherwise `undefined`.
+ */
+export function startModelNodeDragFromAsset(
+  asset: AssetItem,
+  source: NodeAddSource = 'sidebar_drag'
+): ResolveModelNodeError | undefined {
+  const resolved = resolveModelNodeFromAsset(asset)
+  if (!resolved.success) return resolved.error
+
+  const { provider, filename } = resolved.value
+  startModelLoaderDrag(provider, filename, source)
+}
diff --git a/src/composables/node/useNodeDragToCanvas.test.ts b/src/composables/node/useNodeDragToCanvas.test.ts
index 6df6b856a5..a8859ba18d 100644
--- a/src/composables/node/useNodeDragToCanvas.test.ts
+++ b/src/composables/node/useNodeDragToCanvas.test.ts
@@ -7,7 +7,8 @@ const {
   mockAddNodeOnGraph,
   mockConvertEventToCanvasOffset,
   mockSelectItems,
-  mockCanvas
+  mockCanvas,
+  mockToastAdd
 } = vi.hoisted(() => {
   const mockConvertEventToCanvasOffset = vi.fn()
   const mockSelectItems = vi.fn()
@@ -15,6 +16,7 @@ const {
     mockAddNodeOnGraph: vi.fn(),
     mockConvertEventToCanvasOffset,
     mockSelectItems,
+    mockToastAdd: vi.fn(),
     mockCanvas: {
       canvas: {
         getBoundingClientRect: vi.fn()
@@ -37,6 +39,12 @@ vi.mock('@/services/litegraphService', () => ({
   }))
 }))
 
+vi.mock('@/platform/updates/common/toastStore', () => ({
+  useToastStore: vi.fn(() => ({ add: mockToastAdd }))
+}))
+
+vi.mock('@/i18n', () => ({ t: (key: string) => key }))
+
 describe('useNodeDragToCanvas', () => {
   let useNodeDragToCanvas: typeof UseNodeDragToCanvasType
 
@@ -54,8 +62,8 @@ describe('useNodeDragToCanvas', () => {
   })
 
   afterEach(() => {
-    const { cleanupGlobalListeners } = useNodeDragToCanvas()
-    cleanupGlobalListeners()
+    const { cancelDrag } = useNodeDragToCanvas()
+    cancelDrag()
     vi.restoreAllMocks()
   })
 
@@ -71,22 +79,6 @@ describe('useNodeDragToCanvas', () => {
       expect(isDragging.value).toBe(true)
       expect(draggedNode.value).toBe(mockNodeDef)
     })
-
-    it('should set dragMode to click by default', () => {
-      const { dragMode, startDrag } = useNodeDragToCanvas()
-
-      startDrag(mockNodeDef)
-
-      expect(dragMode.value).toBe('click')
-    })
-
-    it('should set dragMode to native when specified', () => {
-      const { dragMode, startDrag } = useNodeDragToCanvas()
-
-      startDrag(mockNodeDef, 'native')
-
-      expect(dragMode.value).toBe('native')
-    })
   })
 
   describe('cancelDrag', () => {
@@ -102,30 +94,15 @@ describe('useNodeDragToCanvas', () => {
       expect(isDragging.value).toBe(false)
       expect(draggedNode.value).toBeNull()
     })
-
-    it('should reset dragMode to click', () => {
-      const { dragMode, startDrag, cancelDrag } = useNodeDragToCanvas()
-
-      startDrag(mockNodeDef, 'native')
-      expect(dragMode.value).toBe('native')
-
-      cancelDrag()
-
-      expect(dragMode.value).toBe('click')
-    })
   })
 
-  describe('setupGlobalListeners', () => {
-    it('should add event listeners to document', () => {
+  describe('drag listener lifecycle', () => {
+    it('should attach document listeners on startDrag', () => {
       const addEventListenerSpy = vi.spyOn(document, 'addEventListener')
-      const { setupGlobalListeners } = useNodeDragToCanvas()
+      const { startDrag } = useNodeDragToCanvas()
 
-      setupGlobalListeners()
+      startDrag(mockNodeDef)
 
-      expect(addEventListenerSpy).toHaveBeenCalledWith(
-        'pointermove',
-        expect.any(Function)
-      )
       expect(addEventListenerSpy).toHaveBeenCalledWith(
         'pointerdown',
         expect.any(Function),
@@ -142,35 +119,53 @@ describe('useNodeDragToCanvas', () => {
       )
     })
 
-    it('should only setup listeners once', () => {
+    it('should not attach drag listeners until a drag starts', () => {
       const addEventListenerSpy = vi.spyOn(document, 'addEventListener')
-      const { setupGlobalListeners } = useNodeDragToCanvas()
+      useNodeDragToCanvas()
 
-      setupGlobalListeners()
+      expect(addEventListenerSpy).not.toHaveBeenCalledWith(
+        'pointerup',
+        expect.any(Function),
+        true
+      )
+      expect(addEventListenerSpy).not.toHaveBeenCalledWith(
+        'keydown',
+        expect.any(Function)
+      )
+    })
+
+    it('should detach document listeners on cancelDrag', () => {
+      const removeEventListenerSpy = vi.spyOn(document, 'removeEventListener')
+      const { startDrag, cancelDrag } = useNodeDragToCanvas()
+
+      startDrag(mockNodeDef)
+      cancelDrag()
+
+      expect(removeEventListenerSpy).toHaveBeenCalledWith(
+        'pointerdown',
+        expect.any(Function),
+        true
+      )
+      expect(removeEventListenerSpy).toHaveBeenCalledWith(
+        'pointerup',
+        expect.any(Function),
+        true
+      )
+    })
+
+    it('should only attach listeners once across re-arms', () => {
+      const addEventListenerSpy = vi.spyOn(document, 'addEventListener')
+      const { startDrag } = useNodeDragToCanvas()
+
+      startDrag(mockNodeDef)
       const callCount = addEventListenerSpy.mock.calls.length
 
-      setupGlobalListeners()
+      startDrag(mockNodeDef)
 
       expect(addEventListenerSpy.mock.calls.length).toBe(callCount)
     })
   })
 
-  describe('cursorPosition', () => {
-    it('should update on pointermove', () => {
-      const { cursorPosition, setupGlobalListeners } = useNodeDragToCanvas()
-
-      setupGlobalListeners()
-
-      const pointerEvent = new PointerEvent('pointermove', {
-        clientX: 100,
-        clientY: 200
-      })
-      document.dispatchEvent(pointerEvent)
-
-      expect(cursorPosition.value).toEqual({ x: 100, y: 200 })
-    })
-  })
-
   describe('endDrag behavior', () => {
     it('should add node when pointer is over canvas', () => {
       mockCanvas.canvas.getBoundingClientRect.mockReturnValue({
@@ -181,9 +176,7 @@ describe('useNodeDragToCanvas', () => {
       })
       mockConvertEventToCanvasOffset.mockReturnValue([150, 150])
 
-      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
-
-      setupGlobalListeners()
+      const { startDrag } = useNodeDragToCanvas()
       startDrag(mockNodeDef)
 
       const pointerEvent = new PointerEvent('pointerup', {
@@ -206,10 +199,7 @@ describe('useNodeDragToCanvas', () => {
         bottom: 500
       })
 
-      const { startDrag, setupGlobalListeners, isDragging } =
-        useNodeDragToCanvas()
-
-      setupGlobalListeners()
+      const { startDrag, isDragging } = useNodeDragToCanvas()
       startDrag(mockNodeDef)
 
       const pointerEvent = new PointerEvent('pointerup', {
@@ -224,10 +214,7 @@ describe('useNodeDragToCanvas', () => {
     })
 
     it('should cancel drag on Escape key', () => {
-      const { startDrag, setupGlobalListeners, isDragging } =
-        useNodeDragToCanvas()
-
-      setupGlobalListeners()
+      const { startDrag, isDragging } = useNodeDragToCanvas()
       startDrag(mockNodeDef)
 
       expect(isDragging.value).toBe(true)
@@ -239,10 +226,7 @@ describe('useNodeDragToCanvas', () => {
     })
 
     it('should not cancel drag on other keys', () => {
-      const { startDrag, setupGlobalListeners, isDragging } =
-        useNodeDragToCanvas()
-
-      setupGlobalListeners()
+      const { startDrag, isDragging } = useNodeDragToCanvas()
       startDrag(mockNodeDef)
 
       const keyEvent = new KeyboardEvent('keydown', { key: 'Enter' })
@@ -262,8 +246,7 @@ describe('useNodeDragToCanvas', () => {
       const placedNode = { id: 1 }
       mockAddNodeOnGraph.mockReturnValue(placedNode)
 
-      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
-      setupGlobalListeners()
+      const { startDrag } = useNodeDragToCanvas()
       startDrag(mockNodeDef)
 
       document.dispatchEvent(
@@ -277,6 +260,102 @@ describe('useNodeDragToCanvas', () => {
       expect(mockSelectItems).toHaveBeenCalledWith([placedNode])
     })
 
+    it('should apply the requested widget values to the placed node', () => {
+      mockCanvas.canvas.getBoundingClientRect.mockReturnValue({
+        left: 0,
+        right: 500,
+        top: 0,
+        bottom: 500
+      })
+      mockConvertEventToCanvasOffset.mockReturnValue([150, 150])
+      const widget = { name: 'ckpt_name', value: '' }
+      mockAddNodeOnGraph.mockReturnValue({ id: 1, widgets: [widget] })
+
+      const { startDrag } = useNodeDragToCanvas()
+      startDrag(mockNodeDef, {
+        widgetValues: { ckpt_name: 'model.safetensors' }
+      })
+
+      document.dispatchEvent(
+        new PointerEvent('pointerup', {
+          clientX: 250,
+          clientY: 250,
+          bubbles: true
+        })
+      )
+
+      expect(widget.value).toBe('model.safetensors')
+    })
+
+    it('should warn but still place the node when a requested widget is missing', () => {
+      mockCanvas.canvas.getBoundingClientRect.mockReturnValue({
+        left: 0,
+        right: 500,
+        top: 0,
+        bottom: 500
+      })
+      mockConvertEventToCanvasOffset.mockReturnValue([150, 150])
+      const placedNode = { id: 1, widgets: [] }
+      mockAddNodeOnGraph.mockReturnValue(placedNode)
+      const consoleErrorSpy = vi
+        .spyOn(console, 'error')
+        .mockImplementation(() => {})
+
+      const { startDrag } = useNodeDragToCanvas()
+      startDrag(mockNodeDef, {
+        widgetValues: { ckpt_name: 'model.safetensors' }
+      })
+
+      document.dispatchEvent(
+        new PointerEvent('pointerup', {
+          clientX: 250,
+          clientY: 250,
+          bubbles: true
+        })
+      )
+
+      expect(mockSelectItems).toHaveBeenCalledWith([placedNode])
+      expect(mockToastAdd).toHaveBeenCalledWith(
+        expect.objectContaining({
+          severity: 'warn',
+          detail: 'assetBrowser.failedToSetModelValue'
+        })
+      )
+      expect(consoleErrorSpy).toHaveBeenCalledWith(
+        expect.stringContaining('ckpt_name')
+      )
+    })
+
+    it('should show an error toast when the graph fails to add the node', () => {
+      mockCanvas.canvas.getBoundingClientRect.mockReturnValue({
+        left: 0,
+        right: 500,
+        top: 0,
+        bottom: 500
+      })
+      mockConvertEventToCanvasOffset.mockReturnValue([150, 150])
+      mockAddNodeOnGraph.mockReturnValue(null)
+      vi.spyOn(console, 'error').mockImplementation(() => {})
+
+      const { startDrag } = useNodeDragToCanvas()
+      startDrag(mockNodeDef)
+
+      document.dispatchEvent(
+        new PointerEvent('pointerup', {
+          clientX: 250,
+          clientY: 250,
+          bubbles: true
+        })
+      )
+
+      expect(mockToastAdd).toHaveBeenCalledWith(
+        expect.objectContaining({
+          severity: 'error',
+          detail: 'assetBrowser.failedToCreateNode'
+        })
+      )
+    })
+
     it('should not call selectItems when graph returns no node', () => {
       mockCanvas.canvas.getBoundingClientRect.mockReturnValue({
         left: 0,
@@ -286,9 +365,9 @@ describe('useNodeDragToCanvas', () => {
       })
       mockConvertEventToCanvasOffset.mockReturnValue([150, 150])
       mockAddNodeOnGraph.mockReturnValue(null)
+      vi.spyOn(console, 'error').mockImplementation(() => {})
 
-      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
-      setupGlobalListeners()
+      const { startDrag } = useNodeDragToCanvas()
       startDrag(mockNodeDef)
 
       document.dispatchEvent(
@@ -311,11 +390,8 @@ describe('useNodeDragToCanvas', () => {
       })
       mockConvertEventToCanvasOffset.mockReturnValue([150, 150])
 
-      const { startDrag, setupGlobalListeners, isDragging } =
-        useNodeDragToCanvas()
-
-      setupGlobalListeners()
-      startDrag(mockNodeDef, 'native')
+      const { startDrag, isDragging } = useNodeDragToCanvas()
+      startDrag(mockNodeDef, { mode: 'native' })
 
       const pointerEvent = new PointerEvent('pointerup', {
         clientX: 250,
@@ -341,7 +417,7 @@ describe('useNodeDragToCanvas', () => {
 
       const { startDrag, handleNativeDrop } = useNodeDragToCanvas()
 
-      startDrag(mockNodeDef, 'native')
+      startDrag(mockNodeDef, { mode: 'native' })
       handleNativeDrop(250, 250)
 
       expect(mockAddNodeOnGraph).toHaveBeenCalledWith(mockNodeDef, {
@@ -359,7 +435,7 @@ describe('useNodeDragToCanvas', () => {
 
       const { startDrag, handleNativeDrop, isDragging } = useNodeDragToCanvas()
 
-      startDrag(mockNodeDef, 'native')
+      startDrag(mockNodeDef, { mode: 'native' })
       handleNativeDrop(600, 250)
 
       expect(mockAddNodeOnGraph).not.toHaveBeenCalled()
@@ -377,7 +453,7 @@ describe('useNodeDragToCanvas', () => {
 
       const { startDrag, handleNativeDrop } = useNodeDragToCanvas()
 
-      startDrag(mockNodeDef, 'click')
+      startDrag(mockNodeDef)
       handleNativeDrop(250, 250)
 
       expect(mockAddNodeOnGraph).not.toHaveBeenCalled()
@@ -392,14 +468,12 @@ describe('useNodeDragToCanvas', () => {
       })
       mockConvertEventToCanvasOffset.mockReturnValue([200, 200])
 
-      const { startDrag, handleNativeDrop, isDragging, dragMode } =
-        useNodeDragToCanvas()
+      const { startDrag, handleNativeDrop, isDragging } = useNodeDragToCanvas()
 
-      startDrag(mockNodeDef, 'native')
+      startDrag(mockNodeDef, { mode: 'native' })
       handleNativeDrop(250, 250)
 
       expect(isDragging.value).toBe(false)
-      expect(dragMode.value).toBe('click')
     })
   })
 
@@ -426,31 +500,29 @@ describe('useNodeDragToCanvas', () => {
     })
 
     it('should stop propagation when in click-drag mode over canvas', () => {
-      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
-      setupGlobalListeners()
+      const { startDrag } = useNodeDragToCanvas()
       startDrag(mockNodeDef)
 
       expect(dispatchPointerDown(250, 250)).toHaveBeenCalled()
     })
 
-    it('should not stop propagation when not dragging', () => {
-      const { setupGlobalListeners } = useNodeDragToCanvas()
-      setupGlobalListeners()
+    it('should not stop propagation once the drag is cancelled', () => {
+      const { startDrag, cancelDrag } = useNodeDragToCanvas()
+      startDrag(mockNodeDef)
+      cancelDrag()
 
       expect(dispatchPointerDown(250, 250)).not.toHaveBeenCalled()
     })
 
     it('should not stop propagation in native drag mode', () => {
-      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
-      setupGlobalListeners()
-      startDrag(mockNodeDef, 'native')
+      const { startDrag } = useNodeDragToCanvas()
+      startDrag(mockNodeDef, { mode: 'native' })
 
       expect(dispatchPointerDown(250, 250)).not.toHaveBeenCalled()
     })
 
     it('should not stop propagation when pointer is outside canvas', () => {
-      const { startDrag, setupGlobalListeners } = useNodeDragToCanvas()
-      setupGlobalListeners()
+      const { startDrag } = useNodeDragToCanvas()
       startDrag(mockNodeDef)
 
       expect(dispatchPointerDown(600, 250)).not.toHaveBeenCalled()
@@ -477,10 +549,8 @@ describe('useNodeDragToCanvas', () => {
     }
 
     it('should prefer tracked drag position over dragend coordinates', () => {
-      const { startDrag, setupGlobalListeners, handleNativeDrop } =
-        useNodeDragToCanvas()
-      setupGlobalListeners()
-      startDrag(mockNodeDef, 'native')
+      const { startDrag, handleNativeDrop } = useNodeDragToCanvas()
+      startDrag(mockNodeDef, { mode: 'native' })
 
       fireDrag(250, 250)
       // dragend supplies a bad position (the Firefox bug); the tracked one
@@ -494,10 +564,8 @@ describe('useNodeDragToCanvas', () => {
     })
 
     it('should ignore drag events with (0, 0)', () => {
-      const { startDrag, setupGlobalListeners, handleNativeDrop } =
-        useNodeDragToCanvas()
-      setupGlobalListeners()
-      startDrag(mockNodeDef, 'native')
+      const { startDrag, handleNativeDrop } = useNodeDragToCanvas()
+      startDrag(mockNodeDef, { mode: 'native' })
 
       fireDrag(250, 250)
       fireDrag(0, 0)
@@ -510,10 +578,8 @@ describe('useNodeDragToCanvas', () => {
     })
 
     it('should fall back to dragend coordinates when no drag fired', () => {
-      const { startDrag, setupGlobalListeners, handleNativeDrop } =
-        useNodeDragToCanvas()
-      setupGlobalListeners()
-      startDrag(mockNodeDef, 'native')
+      const { startDrag, handleNativeDrop } = useNodeDragToCanvas()
+      startDrag(mockNodeDef, { mode: 'native' })
 
       handleNativeDrop(250, 250)
 
@@ -523,32 +589,14 @@ describe('useNodeDragToCanvas', () => {
       })
     })
 
-    it('should ignore dragover events fired before startDrag', () => {
-      const { startDrag, setupGlobalListeners, handleNativeDrop } =
-        useNodeDragToCanvas()
-      setupGlobalListeners()
-
-      fireDrag(250, 250)
-      startDrag(mockNodeDef, 'native')
-      handleNativeDrop(300, 300)
-
-      expect(mockConvertEventToCanvasOffset).toHaveBeenCalledWith({
-        clientX: 300,
-        clientY: 300
-      })
-    })
-
     it('should clear tracked position between drags', () => {
-      const { startDrag, setupGlobalListeners, handleNativeDrop } =
-        useNodeDragToCanvas()
-      setupGlobalListeners()
-
-      startDrag(mockNodeDef, 'native')
+      const { startDrag, handleNativeDrop } = useNodeDragToCanvas()
+      startDrag(mockNodeDef, { mode: 'native' })
       fireDrag(250, 250)
       handleNativeDrop(1505, 102)
 
       // Second drag - no drag events, so we should fall back to args.
-      startDrag(mockNodeDef, 'native')
+      startDrag(mockNodeDef, { mode: 'native' })
       handleNativeDrop(300, 300)
 
       expect(mockConvertEventToCanvasOffset).toHaveBeenLastCalledWith({
diff --git a/src/composables/node/useNodeDragToCanvas.ts b/src/composables/node/useNodeDragToCanvas.ts
index 51305c42ad..40357ebd72 100644
--- a/src/composables/node/useNodeDragToCanvas.ts
+++ b/src/composables/node/useNodeDragToCanvas.ts
@@ -1,23 +1,32 @@
 import { ref, shallowRef } from 'vue'
 
+import { t } from '@/i18n'
+import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { withNodeAddSource } from '@/platform/telemetry/nodeAdded/nodeAddSource'
+import type { NodeAddSource } from '@/platform/telemetry/types'
+import { useToastStore } from '@/platform/updates/common/toastStore'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useLitegraphService } from '@/services/litegraphService'
 import type { ComfyNodeDefImpl } from '@/stores/nodeDefStore'
 
 type DragMode = 'click' | 'native'
+type WidgetValues = Record<string, string>
+type Position = { x: number; y: number }
+
+interface StartDragOptions {
+  mode?: DragMode
+  widgetValues?: WidgetValues
+  source?: NodeAddSource
+}
 
 const isDragging = ref(false)
 const draggedNode = shallowRef<ComfyNodeDefImpl | null>(null)
-const cursorPosition = ref({ x: 0, y: 0 })
 const dragMode = ref<DragMode>('click')
-const lastNativeDragPosition = shallowRef<{ x: number; y: number }>()
+const lastNativeDragPosition = shallowRef<Position>()
+const pendingWidgetValues = shallowRef<WidgetValues>()
+const pendingSource = ref<NodeAddSource>('sidebar_drag')
 let listenersSetup = false
 
-function updatePosition(e: PointerEvent) {
-  cursorPosition.value = { x: e.clientX, y: e.clientY }
-}
-
 // Firefox dragend can report stale clientX/Y and `drag` can fire with
 // (0, 0). dragover on the target reliably reports real client coords.
 // https://bugzilla.mozilla.org/show_bug.cgi?id=1773886
@@ -27,11 +36,20 @@ function trackNativeDragPosition(e: DragEvent) {
   lastNativeDragPosition.value = { x: e.clientX, y: e.clientY }
 }
 
-function cancelDrag() {
-  isDragging.value = false
-  draggedNode.value = null
-  dragMode.value = 'click'
-  lastNativeDragPosition.value = undefined
+function applyWidgetValues(node: LGraphNode, values: WidgetValues) {
+  for (const [name, value] of Object.entries(values)) {
+    const widget = node.widgets?.find((w) => w.name === name)
+    if (!widget) {
+      console.error(`Widget ${name} not found on node ${node.type}`)
+      useToastStore().add({
+        severity: 'warn',
+        summary: t('g.warning'),
+        detail: t('assetBrowser.failedToSetModelValue')
+      })
+      continue
+    }
+    widget.value = value
+  }
 }
 
 function isOverCanvas(clientX: number, clientY: number): boolean {
@@ -59,10 +77,22 @@ function addNodeAtPosition(clientX: number, clientY: number): boolean {
     clientX,
     clientY
   } as PointerEvent)
-  const node = withNodeAddSource('sidebar_drag', () =>
+  const node = withNodeAddSource(pendingSource.value, () =>
     useLitegraphService().addNodeOnGraph(nodeDef, { pos })
   )
-  if (node) canvas.selectItems([node])
+  if (!node) {
+    console.error(`Failed to add node to graph: ${nodeDef.name}`)
+    useToastStore().add({
+      severity: 'error',
+      summary: t('g.error'),
+      detail: t('assetBrowser.failedToCreateNode')
+    })
+    return true
+  }
+
+  if (pendingWidgetValues.value)
+    applyWidgetValues(node, pendingWidgetValues.value)
+  canvas.selectItems([node])
   return true
 }
 
@@ -92,7 +122,6 @@ function setupGlobalListeners() {
   if (listenersSetup) return
   listenersSetup = true
 
-  document.addEventListener('pointermove', updatePosition)
   document.addEventListener('pointerdown', blockCommitPointerDown, true)
   document.addEventListener('pointerup', endDrag, true)
   document.addEventListener('keydown', handleKeydown)
@@ -103,22 +132,37 @@ function cleanupGlobalListeners() {
   if (!listenersSetup) return
   listenersSetup = false
 
-  document.removeEventListener('pointermove', updatePosition)
   document.removeEventListener('pointerdown', blockCommitPointerDown, true)
   document.removeEventListener('pointerup', endDrag, true)
   document.removeEventListener('keydown', handleKeydown)
   document.removeEventListener('dragover', trackNativeDragPosition)
+}
 
-  if (isDragging.value && dragMode.value === 'click') {
-    cancelDrag()
-  }
+function cancelDrag() {
+  isDragging.value = false
+  draggedNode.value = null
+  dragMode.value = 'click'
+  lastNativeDragPosition.value = undefined
+  pendingWidgetValues.value = undefined
+  pendingSource.value = 'sidebar_drag'
+  cleanupGlobalListeners()
 }
 
 export function useNodeDragToCanvas() {
-  function startDrag(nodeDef: ComfyNodeDefImpl, mode: DragMode = 'click') {
+  function startDrag(
+    nodeDef: ComfyNodeDefImpl,
+    {
+      mode = 'click',
+      widgetValues,
+      source = 'sidebar_drag'
+    }: StartDragOptions = {}
+  ) {
     isDragging.value = true
     draggedNode.value = nodeDef
     dragMode.value = mode
+    pendingWidgetValues.value = widgetValues
+    pendingSource.value = source
+    setupGlobalListeners()
   }
 
   function handleNativeDrop(clientX: number, clientY: number) {
@@ -134,12 +178,9 @@ export function useNodeDragToCanvas() {
   return {
     isDragging,
     draggedNode,
-    cursorPosition,
-    dragMode,
+    pendingWidgetValues,
     startDrag,
     cancelDrag,
-    handleNativeDrop,
-    setupGlobalListeners,
-    cleanupGlobalListeners
+    handleNativeDrop
   }
 }
diff --git a/src/composables/node/useNodePreviewAndDrag.test.ts b/src/composables/node/useNodePreviewAndDrag.test.ts
index 79e365a907..91435e6a0d 100644
--- a/src/composables/node/useNodePreviewAndDrag.test.ts
+++ b/src/composables/node/useNodePreviewAndDrag.test.ts
@@ -124,7 +124,9 @@ describe('useNodePreviewAndDrag', () => {
 
       expect(result.isDragging.value).toBe(true)
       expect(result.isHovered.value).toBe(false)
-      expect(mockStartDrag).toHaveBeenCalledWith(mockNodeDef, 'native')
+      expect(mockStartDrag).toHaveBeenCalledWith(mockNodeDef, {
+        mode: 'native'
+      })
       expect(mockDataTransfer.effectAllowed).toBe('copy')
       expect(mockDataTransfer.setData).toHaveBeenCalledWith(
         'application/x-comfy-node',
diff --git a/src/composables/node/useNodePreviewAndDrag.ts b/src/composables/node/useNodePreviewAndDrag.ts
index 87c4b503f7..8876475748 100644
--- a/src/composables/node/useNodePreviewAndDrag.ts
+++ b/src/composables/node/useNodePreviewAndDrag.ts
@@ -125,7 +125,7 @@ export function useNodePreviewAndDrag(
     isDragging.value = true
     isHovered.value = false
 
-    startDrag(nodeDef.value, 'native')
+    startDrag(nodeDef.value, { mode: 'native' })
 
     if (e.dataTransfer) {
       e.dataTransfer.effectAllowed = 'copy'
diff --git a/src/composables/node/usePromotedPreviews.test.ts b/src/composables/node/usePromotedPreviews.test.ts
index a15131d113..565f8472e0 100644
--- a/src/composables/node/usePromotedPreviews.test.ts
+++ b/src/composables/node/usePromotedPreviews.test.ts
@@ -137,6 +137,18 @@ describe(usePromotedPreviews, () => {
     expect(promotedPreviews.value).toEqual([])
   })
 
+  it('returns empty array (does not throw) when SubgraphNode is detached', () => {
+    const setup = createSetup()
+    const parentGraph = setup.subgraphNode.graph!
+    parentGraph.add(setup.subgraphNode)
+    parentGraph.remove(setup.subgraphNode)
+
+    expect(setup.subgraphNode.graph).toBeNull()
+    const { promotedPreviews } = usePromotedPreviews(() => setup.subgraphNode)
+    expect(() => promotedPreviews.value).not.toThrow()
+    expect(promotedPreviews.value).toEqual([])
+  })
+
   it('returns empty array when no $$ promotions exist', () => {
     const setup = createSetup()
     addInteriorNode(setup, { id: 10 })
diff --git a/src/composables/node/usePromotedPreviews.ts b/src/composables/node/usePromotedPreviews.ts
index 8cebb1bbfb..15f181e86f 100644
--- a/src/composables/node/usePromotedPreviews.ts
+++ b/src/composables/node/usePromotedPreviews.ts
@@ -6,7 +6,11 @@ import { SubgraphNode } from '@/lib/litegraph/src/subgraph/SubgraphNode'
 import type { UUID } from '@/utils/uuid'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
 import { usePreviewExposureStore } from '@/stores/previewExposureStore'
-import { createNodeLocatorId } from '@/types/nodeIdentification'
+import {
+  appendNodeExecutionId,
+  createNodeLocatorId
+} from '@/types/nodeIdentification'
+import type { NodeExecutionId } from '@/types/nodeIdentification'
 
 interface PromotedPreview {
   sourceNodeId: string
@@ -38,7 +42,7 @@ export function usePromotedPreviews(
   function readReactivePreviewUrls(
     leafHost: SubgraphNode,
     leafSourceNodeId: string,
-    leafExecutionId: string,
+    leafExecutionId: NodeExecutionId,
     interiorNode: LGraphNode
   ): string[] | undefined {
     const locatorId = createNodeLocatorId(
@@ -68,6 +72,7 @@ export function usePromotedPreviews(
   const promotedPreviews = computed((): PromotedPreview[] => {
     const node = toValue(lgraphNode)
     if (!(node instanceof SubgraphNode)) return []
+    if (node.isDetached) return []
 
     const rootGraphId = node.rootGraph.id
     const hostLocator = String(node.id)
@@ -121,7 +126,7 @@ export function usePromotedPreviews(
       const urls = readReactivePreviewUrls(
         leafHost,
         leaf.sourceNodeId,
-        `${leafHostLocator}:${leaf.sourceNodeId}`,
+        appendNodeExecutionId(leafHostLocator, leaf.sourceNodeId),
         interiorNode
       )
       if (!urls?.length) return []
diff --git a/src/composables/painter/usePainter.test.ts b/src/composables/painter/usePainter.test.ts
index ef70fc7410..dcae8cf692 100644
--- a/src/composables/painter/usePainter.test.ts
+++ b/src/composables/painter/usePainter.test.ts
@@ -384,7 +384,63 @@ describe('usePainter', () => {
         '/upload/image',
         expect.objectContaining({ method: 'POST' })
       )
-      expect(result).toBe('painter/uploaded.png [temp]')
+      expect(result).toBe('uploaded.png [input]')
+
+      const [, init] = fetchApiMock.mock.calls[0]
+      const body = init?.body as FormData
+      expect(body).toBeInstanceOf(FormData)
+      expect(body.get('type')).toBe('input')
+      expect(body.get('subfolder')).toBeNull()
+    })
+
+    it('throws when the upload response is missing a name', async () => {
+      const maskWidget = makeWidget('mask', '')
+      mockWidgets.push(maskWidget)
+
+      vi.mocked(api.fetchApi).mockResolvedValueOnce({
+        status: 200,
+        json: async () => ({})
+      } as Response)
+
+      const fakeCanvas = {
+        width: 4,
+        height: 4,
+        toBlob: (cb: BlobCallback) => cb(new Blob(['x']))
+      } as unknown as HTMLCanvasElement
+
+      const { canvasEl } = mountPainter('test-node', '')
+      canvasEl.value = fakeCanvas
+      await nextTick()
+
+      await expect(
+        maskWidget.serializeValue!({} as LGraphNode, 0)
+      ).rejects.toThrow(/missing 'name'/)
+    })
+
+    it('throws when the upload response body is not valid JSON', async () => {
+      const maskWidget = makeWidget('mask', '')
+      mockWidgets.push(maskWidget)
+
+      vi.mocked(api.fetchApi).mockResolvedValueOnce({
+        status: 200,
+        json: async () => {
+          throw new SyntaxError('Unexpected token')
+        }
+      } as unknown as Response)
+
+      const fakeCanvas = {
+        width: 4,
+        height: 4,
+        toBlob: (cb: BlobCallback) => cb(new Blob(['x']))
+      } as unknown as HTMLCanvasElement
+
+      const { canvasEl } = mountPainter('test-node', '')
+      canvasEl.value = fakeCanvas
+      await nextTick()
+
+      await expect(
+        maskWidget.serializeValue!({} as LGraphNode, 0)
+      ).rejects.toThrow(/painter\.uploadError/)
     })
 
     it('returns existing modelValue when canvas element is unmounted at serialize time', async () => {
diff --git a/src/composables/painter/usePainter.ts b/src/composables/painter/usePainter.ts
index b7a214e104..e466585f5c 100644
--- a/src/composables/painter/usePainter.ts
+++ b/src/composables/painter/usePainter.ts
@@ -1,3 +1,4 @@
+import type { UploadImageResponse } from '@comfyorg/ingest-types'
 import type { Ref } from 'vue'
 import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
 import { useElementSize } from '@vueuse/core'
@@ -12,7 +13,6 @@ import { hexToRgb } from '@/utils/colorUtil'
 import type { Point } from '@/extensions/core/maskeditor/types'
 import type { LGraphNode } from '@/lib/litegraph/src/LGraphNode'
 import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
-import { isCloud } from '@/platform/distribution/types'
 import { useToastStore } from '@/platform/updates/common/toastStore'
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
@@ -631,8 +631,7 @@ export function usePainter(nodeId: string, options: UsePainterOptions) {
     const name = `painter-${nodeId}-${Date.now()}.png`
     const body = new FormData()
     body.append('image', blob, name)
-    if (!isCloud) body.append('subfolder', 'painter')
-    body.append('type', isCloud ? 'input' : 'temp')
+    body.append('type', 'input')
 
     let resp: Response
     try {
@@ -650,15 +649,16 @@ export function usePainter(nodeId: string, options: UsePainterOptions) {
     }
 
     if (resp.status !== 200) {
+      const bodyText = await resp.text().catch(() => '')
       const err = t('painter.uploadError', {
         status: resp.status,
-        statusText: resp.statusText
+        statusText: bodyText || resp.statusText || 'unknown error'
       })
       toastStore.addAlert(err)
       throw new Error(err)
     }
 
-    let data: { name: string }
+    let data: UploadImageResponse
     try {
       data = await resp.json()
     } catch (e) {
@@ -670,9 +670,13 @@ export function usePainter(nodeId: string, options: UsePainterOptions) {
       throw new Error(err, { cause: e })
     }
 
-    const result = isCloud
-      ? `${data.name} [input]`
-      : `painter/${data.name} [temp]`
+    if (!data?.name) {
+      const detail = `Painter upload succeeded (${resp.status}) but response is missing 'name'`
+      toastStore.addAlert(detail)
+      throw new Error(detail)
+    }
+
+    const result = `${data.name} [input]`
     modelValue.value = result
     isDirty.value = false
     return result
diff --git a/src/composables/palette/usePaletteSwatchRow.test.ts b/src/composables/palette/usePaletteSwatchRow.test.ts
new file mode 100644
index 0000000000..ed84fb1541
--- /dev/null
+++ b/src/composables/palette/usePaletteSwatchRow.test.ts
@@ -0,0 +1,114 @@
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import type { EffectScope } from 'vue'
+import { effectScope, ref, shallowRef } from 'vue'
+
+import { usePaletteSwatchRow } from './usePaletteSwatchRow'
+
+const scopes: EffectScope[] = []
+
+afterEach(() => {
+  while (scopes.length) scopes.pop()?.stop()
+})
+
+function setup(initial: string[]) {
+  const modelValue = ref(initial)
+  const container = shallowRef(document.createElement('div'))
+  const picker = shallowRef(document.createElement('input'))
+  const scope = effectScope()
+  scopes.push(scope)
+  const api = scope.run(() =>
+    usePaletteSwatchRow({ modelValue, container, picker })
+  )!
+  return { modelValue, container, picker, ...api }
+}
+
+const mouseEvent = () => ({ stopPropagation: vi.fn() }) as unknown as MouseEvent
+
+describe('usePaletteSwatchRow', () => {
+  it('appends a default color', () => {
+    const { modelValue, addColor } = setup(['#000000'])
+    addColor()
+    expect(modelValue.value).toEqual(['#000000', '#ffffff'])
+  })
+
+  it('removes a color by index', () => {
+    const { modelValue, remove } = setup(['#a', '#b', '#c'])
+    remove(1)
+    expect(modelValue.value).toEqual(['#a', '#c'])
+  })
+
+  it('seeds the picker input with the clicked color before opening it', () => {
+    const { picker, openPicker } = setup(['#112233'])
+    const click = vi.spyOn(picker.value!, 'click')
+    openPicker(0, mouseEvent())
+    expect(picker.value!.value).toBe('#112233')
+    expect(click).toHaveBeenCalled()
+  })
+
+  it('falls back to white when the slot is empty', () => {
+    const { picker, openPicker } = setup([''])
+    openPicker(0, mouseEvent())
+    expect(picker.value!.value).toBe('#ffffff')
+  })
+
+  it('writes the picked color back to the open slot', () => {
+    const { modelValue, openPicker, onPickerInput } = setup(['#a', '#b'])
+    openPicker(1, mouseEvent())
+    onPickerInput({ target: { value: '#123456' } } as unknown as Event)
+    expect(modelValue.value).toEqual(['#a', '#123456'])
+  })
+
+  it('ignores picker input when no slot is open', () => {
+    const { modelValue, onPickerInput } = setup(['#a'])
+    onPickerInput({ target: { value: '#123456' } } as unknown as Event)
+    expect(modelValue.value).toEqual(['#a'])
+  })
+
+  it('reorders via drag when the pointer crosses another swatch', () => {
+    const { modelValue, container, onPointerDown } = setup(['#a', '#b'])
+    for (const i of [0, 1]) {
+      const swatch = document.createElement('div')
+      swatch.setAttribute('data-index', String(i))
+      container.value!.appendChild(swatch)
+    }
+    const second = container.value!.children[1] as HTMLDivElement
+    second.getBoundingClientRect = () =>
+      ({ left: 100, right: 140, top: 0, bottom: 20, width: 40 }) as DOMRect
+
+    onPointerDown(0, { button: 0, clientX: 10, clientY: 10 } as PointerEvent)
+    document.dispatchEvent(
+      new MouseEvent('pointermove', { clientX: 130, clientY: 10, buttons: 1 })
+    )
+    expect(modelValue.value).toEqual(['#b', '#a'])
+  })
+
+  it('cancels a stale drag when the primary button is no longer pressed', () => {
+    const { modelValue, container, onPointerDown } = setup(['#a', '#b'])
+    for (const i of [0, 1]) {
+      const swatch = document.createElement('div')
+      swatch.setAttribute('data-index', String(i))
+      container.value!.appendChild(swatch)
+    }
+    const second = container.value!.children[1] as HTMLDivElement
+    second.getBoundingClientRect = () =>
+      ({ left: 100, right: 140, top: 0, bottom: 20, width: 40 }) as DOMRect
+
+    onPointerDown(0, { button: 0, clientX: 10, clientY: 10 } as PointerEvent)
+    document.dispatchEvent(
+      new MouseEvent('pointermove', { clientX: 130, clientY: 10, buttons: 0 })
+    )
+    expect(modelValue.value).toEqual(['#a', '#b'])
+  })
+
+  it('ignores non-left-button pointer downs', () => {
+    const { modelValue, container, onPointerDown } = setup(['#a', '#b'])
+    const swatch = document.createElement('div')
+    swatch.setAttribute('data-index', '1')
+    container.value!.appendChild(swatch)
+    onPointerDown(0, { button: 2, clientX: 10, clientY: 10 } as PointerEvent)
+    document.dispatchEvent(
+      new MouseEvent('pointermove', { clientX: 130, clientY: 10 })
+    )
+    expect(modelValue.value).toEqual(['#a', '#b'])
+  })
+})
diff --git a/src/composables/palette/usePaletteSwatchRow.ts b/src/composables/palette/usePaletteSwatchRow.ts
new file mode 100644
index 0000000000..a9876faba9
--- /dev/null
+++ b/src/composables/palette/usePaletteSwatchRow.ts
@@ -0,0 +1,114 @@
+import { useEventListener } from '@vueuse/core'
+import type { Ref, ShallowRef } from 'vue'
+import { ref } from 'vue'
+
+interface UsePaletteSwatchRowOptions {
+  modelValue: Ref<string[]>
+  container: Readonly<ShallowRef<HTMLDivElement | null>>
+  picker: Readonly<ShallowRef<HTMLInputElement | null>>
+}
+
+export function usePaletteSwatchRow({
+  modelValue,
+  container,
+  picker
+}: UsePaletteSwatchRowOptions) {
+  const pickerIndex = ref<number | null>(null)
+
+  function openPicker(i: number, e: MouseEvent) {
+    e.stopPropagation()
+    pickerIndex.value = i
+    const el = picker.value
+    if (!el) return
+    el.value = modelValue.value[i] || '#ffffff'
+    el.click()
+  }
+
+  function onPickerInput(e: Event) {
+    const v = (e.target as HTMLInputElement).value
+    if (pickerIndex.value === null) return
+    const next = modelValue.value.slice()
+    next[pickerIndex.value] = v
+    modelValue.value = next
+  }
+
+  function remove(i: number) {
+    const next = modelValue.value.slice()
+    next.splice(i, 1)
+    modelValue.value = next
+  }
+
+  function addColor() {
+    modelValue.value = [...modelValue.value, '#ffffff']
+  }
+
+  const drag = ref<{
+    index: number
+    startX: number
+    startY: number
+    active: boolean
+  } | null>(null)
+
+  function onPointerDown(i: number, e: PointerEvent) {
+    if (e.button !== 0) return
+    drag.value = {
+      index: i,
+      startX: e.clientX,
+      startY: e.clientY,
+      active: false
+    }
+  }
+
+  useEventListener(document, 'pointermove', (e: PointerEvent) => {
+    const d = drag.value
+    if (!d) return
+    if ((e.buttons & 1) === 0) {
+      drag.value = null
+      return
+    }
+    if (!d.active) {
+      if (Math.abs(e.clientX - d.startX) + Math.abs(e.clientY - d.startY) < 4)
+        return
+      d.active = true
+    }
+    const rows =
+      container.value?.querySelectorAll<HTMLDivElement>('[data-index]')
+    if (!rows) return
+    for (const other of rows) {
+      if (parseInt(other.dataset.index || '-1', 10) === d.index) continue
+      const r = other.getBoundingClientRect()
+      if (
+        e.clientX >= r.left &&
+        e.clientX <= r.right &&
+        e.clientY >= r.top - 6 &&
+        e.clientY <= r.bottom + 6
+      ) {
+        const oi = parseInt(other.dataset.index || '-1', 10)
+        if (oi < 0) continue
+        const next = modelValue.value.slice()
+        const [moved] = next.splice(d.index, 1)
+        const insertAt = e.clientX > r.left + r.width / 2 ? oi + 1 : oi
+        next.splice(insertAt > d.index ? insertAt - 1 : insertAt, 0, moved)
+        modelValue.value = next
+        drag.value = null
+        return
+      }
+    }
+  })
+
+  useEventListener(document, 'pointerup', () => {
+    drag.value = null
+  })
+
+  useEventListener(document, 'pointercancel', () => {
+    drag.value = null
+  })
+
+  return {
+    openPicker,
+    onPickerInput,
+    remove,
+    addColor,
+    onPointerDown
+  }
+}
diff --git a/src/composables/useCoreCommands.test.ts b/src/composables/useCoreCommands.test.ts
index 1908e77364..b5f3163835 100644
--- a/src/composables/useCoreCommands.test.ts
+++ b/src/composables/useCoreCommands.test.ts
@@ -5,11 +5,13 @@ import { ref } from 'vue'
 import { useCoreCommands } from '@/composables/useCoreCommands'
 import { useExternalLink } from '@/composables/useExternalLink'
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
 import type * as ModelStoreModule from '@/stores/modelStore'
 import { createMockLGraphNode } from '@/utils/__tests__/litegraphTestUtils'
+import { fromPartial } from '@total-typescript/shoehorn'
 
 // Mock vue-i18n for useExternalLink
 const mockLocale = ref('en')
@@ -135,6 +137,23 @@ vi.mock('@/stores/toastStore', () => ({
   useToastStore: vi.fn(() => ({}))
 }))
 
+const mockToastAdd = vi.hoisted(() => vi.fn())
+vi.mock('@/platform/updates/common/toastStore', () => ({
+  useToastStore: vi.fn(() => ({ add: mockToastAdd }))
+}))
+
+const mockAssetBrowse = vi.hoisted(() =>
+  vi.fn<(options: { onAssetSelected?: (asset: AssetItem) => void }) => void>()
+)
+vi.mock('@/platform/assets/composables/useAssetBrowserDialog', () => ({
+  useAssetBrowserDialog: vi.fn(() => ({ browse: mockAssetBrowse }))
+}))
+
+const mockStartModelNodeDrag = vi.hoisted(() => vi.fn())
+vi.mock('@/composables/node/startModelNodeDragFromAsset', () => ({
+  startModelNodeDragFromAsset: mockStartModelNodeDrag
+}))
+
 const mockChangeTracker = vi.hoisted(() => ({
   captureCanvasState: vi.fn()
 }))
@@ -618,4 +637,47 @@ describe('useCoreCommands', () => {
       expect(mockShowAbout).toHaveBeenCalled()
     })
   })
+
+  describe('BrowseModelAssets command', () => {
+    const asset = fromPartial<AssetItem>({ id: 'asset-1' })
+
+    async function selectAssetFromBrowser() {
+      vi.mocked(useSettingStore).mockReturnValue(createMockSettingStore(true))
+
+      const command = useCoreCommands().find(
+        (cmd) => cmd.id === 'Comfy.BrowseModelAssets'
+      )!
+      await command.function()
+
+      const { onAssetSelected } = mockAssetBrowse.mock.calls[0][0]
+      onAssetSelected?.(asset)
+    }
+
+    it('starts a model node drag for the selected asset', async () => {
+      mockStartModelNodeDrag.mockReturnValue(undefined)
+
+      await selectAssetFromBrowser()
+
+      expect(mockStartModelNodeDrag).toHaveBeenCalledWith(
+        asset,
+        'asset_browser'
+      )
+      expect(mockToastAdd).not.toHaveBeenCalled()
+    })
+
+    it('shows an error toast when the asset cannot start a drag', async () => {
+      vi.spyOn(console, 'error').mockImplementation(() => {})
+      mockStartModelNodeDrag.mockReturnValue({
+        code: 'NO_PROVIDER',
+        message: 'No node provider registered',
+        assetId: 'asset-1'
+      })
+
+      await selectAssetFromBrowser()
+
+      expect(mockToastAdd).toHaveBeenCalledWith(
+        expect.objectContaining({ severity: 'error' })
+      )
+    })
+  })
 })
diff --git a/src/composables/useCoreCommands.ts b/src/composables/useCoreCommands.ts
index 4853983d20..c31327a6a9 100644
--- a/src/composables/useCoreCommands.ts
+++ b/src/composables/useCoreCommands.ts
@@ -2,6 +2,7 @@ import { useCurrentUser } from '@/composables/auth/useCurrentUser'
 import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useSelectedLiteGraphItems } from '@/composables/canvas/useSelectedLiteGraphItems'
 import { useSubgraphOperations } from '@/composables/graph/useSubgraphOperations'
+import { startModelNodeDragFromAsset } from '@/composables/node/startModelNodeDragFromAsset'
 import { useExternalLink } from '@/composables/useExternalLink'
 import { useModelSelectorDialog } from '@/composables/useModelSelectorDialog'
 import { useRunButtonTelemetry } from '@/composables/useRunButtonTelemetry'
@@ -21,7 +22,6 @@ import {
 import type { Point } from '@/lib/litegraph/src/litegraph'
 import { useBillingContext } from '@/composables/billing/useBillingContext'
 import { useAssetBrowserDialog } from '@/platform/assets/composables/useAssetBrowserDialog'
-import { createModelNodeFromAsset } from '@/platform/assets/utils/createModelNodeFromAsset'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { buildSupportUrl } from '@/platform/support/config'
 import { useTelemetry } from '@/platform/telemetry'
@@ -1307,14 +1307,14 @@ export function useCoreCommands(): ComfyCommand[] {
           assetType: 'models',
           title: t('sideToolbar.modelLibrary'),
           onAssetSelected: (asset) => {
-            const result = createModelNodeFromAsset(asset)
-            if (!result.success) {
+            const error = startModelNodeDragFromAsset(asset, 'asset_browser')
+            if (error) {
               toastStore.add({
                 severity: 'error',
                 summary: t('g.error'),
                 detail: t('assetBrowser.failedToCreateNode')
               })
-              console.error('Node creation failed:', result.error)
+              console.error('Node creation failed:', error)
             }
           }
         })
diff --git a/src/composables/useHdrViewer.ts b/src/composables/useHdrViewer.ts
new file mode 100644
index 0000000000..664ff537e0
--- /dev/null
+++ b/src/composables/useHdrViewer.ts
@@ -0,0 +1,443 @@
+import * as THREE from 'three'
+import { EXRLoader } from 'three/examples/jsm/loaders/EXRLoader'
+import { RGBELoader } from 'three/examples/jsm/loaders/RGBELoader'
+import { computed, onUnmounted, ref, shallowRef, watch } from 'vue'
+
+import type { ChromaticityCoords, GamutName } from '@/renderer/hdr/colorGamut'
+import {
+  detectGamutFromChromaticities,
+  gamutToSrgbMatrix
+} from '@/renderer/hdr/colorGamut'
+import {
+  HDR_VIEWER_FRAGMENT_SHADER,
+  HDR_VIEWER_VERTEX_SHADER
+} from '@/renderer/hdr/hdrViewerShader'
+import type { ChannelHistograms, ImageStats } from '@/renderer/hdr/hdrStats'
+import {
+  computeChannelHistograms,
+  computeImageStats
+} from '@/renderer/hdr/hdrStats'
+import { WebGLViewport } from '@/renderer/three/WebGLViewport'
+import { getImageFilenameFromUrl } from '@/utils/hdrFormatUtil'
+
+const MIN_ZOOM = 0.05
+const MAX_ZOOM = 64
+
+export type ChannelMode = 'rgb' | 'r' | 'g' | 'b' | 'a' | 'luminance'
+
+export const CHANNEL_MODES: ChannelMode[] = [
+  'rgb',
+  'r',
+  'g',
+  'b',
+  'a',
+  'luminance'
+]
+
+const CHANNEL_INDEX: Record<ChannelMode, number> = {
+  rgb: 0,
+  r: 1,
+  g: 2,
+  b: 3,
+  a: 4,
+  luminance: 5
+}
+
+export interface PixelReadout {
+  x: number
+  y: number
+  r: number
+  g: number
+  b: number
+  a: number | null
+}
+
+interface ExrTexData {
+  header?: { chromaticities?: ChromaticityCoords }
+}
+
+function createLoader(url: string) {
+  const filename = getImageFilenameFromUrl(url)
+  if (filename?.toLowerCase().endsWith('.hdr')) return new RGBELoader()
+  const loader = new EXRLoader()
+  loader.setDataType(THREE.FloatType)
+  return loader
+}
+
+function makeReader(
+  data: ArrayLike<number>,
+  type: THREE.TextureDataType
+): (index: number) => number {
+  if (type === THREE.HalfFloatType) {
+    return (index) => THREE.DataUtils.fromHalfFloat(data[index])
+  }
+  return (index) => data[index]
+}
+
+function loadHdrTexture(
+  url: string
+): Promise<{ texture: THREE.DataTexture; gamut: GamutName }> {
+  return new Promise((resolve, reject) => {
+    createLoader(url).load(
+      url,
+      (texture, texData) => {
+        const chromaticities = (texData as ExrTexData)?.header?.chromaticities
+        resolve({
+          texture,
+          gamut: detectGamutFromChromaticities(chromaticities)
+        })
+      },
+      undefined,
+      reject
+    )
+  })
+}
+
+export function useHdrViewer() {
+  const exposureStops = ref(0)
+  const dither = ref(true)
+  const clipWarnings = ref(false)
+  const gamut = ref<GamutName>('sRGB')
+  const channel = ref<ChannelMode>('rgb')
+  const loading = ref(true)
+  const error = ref<string | null>(null)
+  const dimensions = ref<string | null>(null)
+  const stats = ref<ImageStats | null>(null)
+  const histograms = shallowRef<ChannelHistograms | null>(null)
+  const pixel = ref<PixelReadout | null>(null)
+
+  const histogram = computed<Uint32Array | null>(() => {
+    const channelHistograms = histograms.value
+    if (!channelHistograms) return null
+    switch (channel.value) {
+      case 'r':
+        return channelHistograms.r
+      case 'g':
+        return channelHistograms.g
+      case 'b':
+        return channelHistograms.b
+      case 'a':
+        return channelHistograms.a
+      default:
+        return channelHistograms.luminance
+    }
+  })
+
+  const containerRef = shallowRef<HTMLElement | null>(null)
+
+  let renderer: THREE.WebGLRenderer | null = null
+  let viewport: WebGLViewport | null = null
+  let scene: THREE.Scene | null = null
+  let camera: THREE.OrthographicCamera | null = null
+  let material: THREE.ShaderMaterial | null = null
+  let mesh: THREE.Mesh | null = null
+  let texture: THREE.Texture | null = null
+  let imageAspect = 1
+  let frameRequested = false
+
+  let readSample: ((index: number) => number) | null = null
+  let imageWidth = 0
+  let imageHeight = 0
+  let imageChannels = 4
+
+  const raycaster = new THREE.Raycaster()
+  const pointerNdc = new THREE.Vector2()
+
+  function requestRender() {
+    if (!renderer || frameRequested) return
+    frameRequested = true
+    requestAnimationFrame(() => {
+      frameRequested = false
+      if (renderer && scene && camera) renderer.render(scene, camera)
+    })
+  }
+
+  function containerSize() {
+    const el = containerRef.value
+    return {
+      width: el?.clientWidth || 1,
+      height: el?.clientHeight || 1
+    }
+  }
+
+  function updateProjection() {
+    if (!camera) return
+    const { width, height } = containerSize()
+    const halfH = 0.5
+    const halfW = (0.5 * width) / height
+    camera.left = -halfW
+    camera.right = halfW
+    camera.top = halfH
+    camera.bottom = -halfH
+    camera.updateProjectionMatrix()
+  }
+
+  function fitView() {
+    if (!camera) return
+    const { width, height } = containerSize()
+    const containerAspect = width / height
+    camera.zoom = Math.min(1, containerAspect / imageAspect)
+    camera.position.set(0, 0, 1)
+    camera.updateProjectionMatrix()
+    requestRender()
+  }
+
+  function applyUniforms() {
+    if (!material) return
+    material.uniforms.uGain.value = Math.pow(2, exposureStops.value)
+    material.uniforms.uDither.value = dither.value
+    material.uniforms.uClipWarnings.value = clipWarnings.value
+    material.uniforms.uChannel.value = CHANNEL_INDEX[channel.value]
+    const m = gamutToSrgbMatrix(gamut.value)
+    ;(material.uniforms.uGamutToSRGB.value as THREE.Matrix3).set(
+      m[0],
+      m[1],
+      m[2],
+      m[3],
+      m[4],
+      m[5],
+      m[6],
+      m[7],
+      m[8]
+    )
+    requestRender()
+  }
+
+  function buildScene() {
+    renderer = new THREE.WebGLRenderer({ antialias: false, alpha: false })
+    viewport = new WebGLViewport(renderer)
+    renderer.outputColorSpace = THREE.LinearSRGBColorSpace
+    renderer.setPixelRatio(window.devicePixelRatio)
+    renderer.setClearColor(0x0a0a0a, 1)
+
+    scene = new THREE.Scene()
+    camera = new THREE.OrthographicCamera(-1, 1, 1, -1, 0.1, 10)
+    camera.position.set(0, 0, 1)
+
+    material = new THREE.ShaderMaterial({
+      glslVersion: THREE.GLSL3,
+      vertexShader: HDR_VIEWER_VERTEX_SHADER,
+      fragmentShader: HDR_VIEWER_FRAGMENT_SHADER,
+      uniforms: {
+        uImage: { value: null },
+        uGamutToSRGB: { value: new THREE.Matrix3() },
+        uGain: { value: 1 },
+        uChannel: { value: 0 },
+        uDither: { value: true },
+        uClipWarnings: { value: false },
+        uClipRange: { value: new THREE.Vector2(0, 1) }
+      }
+    })
+
+    mesh = new THREE.Mesh(new THREE.PlaneGeometry(1, 1), material)
+    scene.add(mesh)
+  }
+
+  function resize() {
+    if (!renderer) return
+    const { width, height } = containerSize()
+    renderer.setSize(width, height, false)
+    updateProjection()
+    requestRender()
+  }
+
+  function setTexture(loaded: THREE.DataTexture) {
+    if (!material || !mesh) return
+    loaded.colorSpace = THREE.LinearSRGBColorSpace
+    loaded.minFilter = THREE.LinearFilter
+    loaded.magFilter = THREE.LinearFilter
+    loaded.needsUpdate = true
+
+    const { width, height, data } = loaded.image
+    texture = loaded
+    imageAspect = width / height
+    mesh.scale.set(imageAspect, 1, 1)
+    material.uniforms.uImage.value = loaded
+    dimensions.value = `${width} x ${height}`
+
+    if (!data) return
+    imageWidth = width
+    imageHeight = height
+    imageChannels = data.length / (width * height)
+    readSample = makeReader(data, loaded.type)
+    stats.value = computeImageStats(readSample, data.length, imageChannels)
+    histograms.value = computeChannelHistograms(
+      readSample,
+      data.length,
+      imageChannels
+    )
+  }
+
+  async function mount(container: HTMLElement, url: string) {
+    containerRef.value = container
+    loading.value = true
+    error.value = null
+
+    try {
+      buildScene()
+      container.appendChild(renderer!.domElement)
+      renderer!.domElement.classList.add('block', 'size-full')
+      resize()
+      applyUniforms()
+      attachInteractions(renderer!.domElement)
+      viewport!.observeResize(container, resize)
+
+      const { texture: loaded, gamut: detectedGamut } =
+        await loadHdrTexture(url)
+      if (!material || !mesh) {
+        loaded.dispose()
+        return
+      }
+      gamut.value = detectedGamut
+      setTexture(loaded)
+      applyUniforms()
+      fitView()
+    } catch (e) {
+      error.value = e instanceof Error ? e.message : String(e)
+      dispose()
+    } finally {
+      loading.value = false
+    }
+  }
+
+  function normalizeExposure() {
+    const max = stats.value?.max ?? 0
+    exposureStops.value = max > 0 ? -Math.log2(max) : 0
+  }
+
+  function attachInteractions(canvas: HTMLCanvasElement) {
+    canvas.addEventListener('wheel', onWheel, { passive: false })
+    canvas.addEventListener('pointerdown', onPointerDown)
+    canvas.addEventListener('pointermove', onHoverMove)
+    canvas.addEventListener('pointerleave', onHoverLeave)
+  }
+
+  function onWheel(event: WheelEvent) {
+    if (!camera) return
+    event.preventDefault()
+    const factor = Math.exp(-event.deltaY * 0.001)
+    const nextZoom = THREE.MathUtils.clamp(
+      camera.zoom * factor,
+      MIN_ZOOM,
+      MAX_ZOOM
+    )
+    camera.zoom = nextZoom
+    camera.updateProjectionMatrix()
+    requestRender()
+  }
+
+  let dragStart: { x: number; y: number; camX: number; camY: number } | null =
+    null
+
+  function onPointerDown(event: PointerEvent) {
+    if (!camera) return
+    dragStart = {
+      x: event.clientX,
+      y: event.clientY,
+      camX: camera.position.x,
+      camY: camera.position.y
+    }
+    window.addEventListener('pointermove', onPointerMove)
+    window.addEventListener('pointerup', onPointerUp)
+  }
+
+  function onPointerMove(event: PointerEvent) {
+    if (!camera || !dragStart) return
+    const { height } = containerSize()
+    const worldPerPixel = 1 / (height * camera.zoom)
+    camera.position.x =
+      dragStart.camX - (event.clientX - dragStart.x) * worldPerPixel
+    camera.position.y =
+      dragStart.camY + (event.clientY - dragStart.y) * worldPerPixel
+    requestRender()
+  }
+
+  function onPointerUp() {
+    dragStart = null
+    window.removeEventListener('pointermove', onPointerMove)
+    window.removeEventListener('pointerup', onPointerUp)
+  }
+
+  function onHoverMove(event: PointerEvent) {
+    if (!camera || !mesh || !renderer || dragStart || !readSample) return
+    const rect = renderer.domElement.getBoundingClientRect()
+    pointerNdc.x = ((event.clientX - rect.left) / rect.width) * 2 - 1
+    pointerNdc.y = -(((event.clientY - rect.top) / rect.height) * 2 - 1)
+    raycaster.setFromCamera(pointerNdc, camera)
+    const hit = raycaster.intersectObject(mesh)[0]
+    if (!hit?.uv) {
+      pixel.value = null
+      return
+    }
+    const col = THREE.MathUtils.clamp(
+      Math.floor(hit.uv.x * imageWidth),
+      0,
+      imageWidth - 1
+    )
+    const row = THREE.MathUtils.clamp(
+      Math.floor(hit.uv.y * imageHeight),
+      0,
+      imageHeight - 1
+    )
+    const base = (row * imageWidth + col) * imageChannels
+    pixel.value = {
+      x: col,
+      y: imageHeight - 1 - row,
+      r: readSample(base),
+      g: readSample(base + 1),
+      b: readSample(base + 2),
+      a: imageChannels === 4 ? readSample(base + 3) : null
+    }
+  }
+
+  function onHoverLeave() {
+    pixel.value = null
+  }
+
+  function dispose() {
+    window.removeEventListener('pointermove', onPointerMove)
+    window.removeEventListener('pointerup', onPointerUp)
+
+    if (renderer) {
+      renderer.domElement.removeEventListener('wheel', onWheel)
+      renderer.domElement.removeEventListener('pointerdown', onPointerDown)
+      renderer.domElement.removeEventListener('pointermove', onHoverMove)
+      renderer.domElement.removeEventListener('pointerleave', onHoverLeave)
+    }
+    viewport?.disposeRenderer()
+    texture?.dispose()
+    material?.dispose()
+    mesh?.geometry.dispose()
+
+    renderer = null
+    viewport = null
+    scene = null
+    camera = null
+    material = null
+    mesh = null
+    texture = null
+    readSample = null
+  }
+
+  watch([exposureStops, dither, clipWarnings, gamut, channel], applyUniforms)
+
+  onUnmounted(dispose)
+
+  return {
+    exposureStops,
+    dither,
+    clipWarnings,
+    gamut,
+    channel,
+    loading,
+    error,
+    dimensions,
+    stats,
+    histogram,
+    pixel,
+    mount,
+    dispose,
+    fitView,
+    normalizeExposure
+  }
+}
diff --git a/src/core/graph/subgraph/promotionUtils.test.ts b/src/core/graph/subgraph/promotionUtils.test.ts
index 2bffb2230c..6228b8240c 100644
--- a/src/core/graph/subgraph/promotionUtils.test.ts
+++ b/src/core/graph/subgraph/promotionUtils.test.ts
@@ -522,6 +522,22 @@ describe('hasUnpromotedWidgets', () => {
 
     expect(hasUnpromotedWidgets(subgraphNode)).toBe(false)
   })
+
+  it('returns false (does not throw) when SubgraphNode is detached', () => {
+    const subgraph = createTestSubgraph()
+    const subgraphNode = createTestSubgraphNode(subgraph)
+    const parentGraph = subgraphNode.graph!
+    parentGraph.add(subgraphNode)
+    const interiorNode = new LGraphNode('InnerNode')
+    subgraph.add(interiorNode)
+    interiorNode.addWidget('text', 'seed', '123', () => {})
+
+    parentGraph.remove(subgraphNode)
+
+    expect(subgraphNode.graph).toBeNull()
+    expect(() => hasUnpromotedWidgets(subgraphNode)).not.toThrow()
+    expect(hasUnpromotedWidgets(subgraphNode)).toBe(false)
+  })
 })
 
 describe('isLinkedPromotion', () => {
diff --git a/src/core/graph/subgraph/promotionUtils.ts b/src/core/graph/subgraph/promotionUtils.ts
index eaddf3b672..57370e6807 100644
--- a/src/core/graph/subgraph/promotionUtils.ts
+++ b/src/core/graph/subgraph/promotionUtils.ts
@@ -633,6 +633,7 @@ export function pruneDisconnected(subgraphNode: SubgraphNode) {
 }
 
 export function hasUnpromotedWidgets(subgraphNode: SubgraphNode): boolean {
+  if (subgraphNode.isDetached) return false
   const { subgraph } = subgraphNode
 
   return subgraph.nodes.some((interiorNode) =>
diff --git a/src/extensions/core/createBoundingBoxes.test.ts b/src/extensions/core/createBoundingBoxes.test.ts
new file mode 100644
index 0000000000..75eaf92fff
--- /dev/null
+++ b/src/extensions/core/createBoundingBoxes.test.ts
@@ -0,0 +1,89 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+const { state } = vi.hoisted(() => ({
+  state: {
+    extension: null as { nodeCreated: (node: unknown) => void } | null,
+    widgetState: undefined as { options: Record<string, unknown> } | undefined
+  }
+}))
+
+vi.mock('@/services/extensionService', () => ({
+  useExtensionService: () => ({
+    registerExtension: (ext: { nodeCreated: (node: unknown) => void }) => {
+      state.extension = ext
+    }
+  })
+}))
+
+vi.mock('@/stores/widgetValueStore', () => ({
+  useWidgetValueStore: () => ({ getWidget: () => state.widgetState })
+}))
+
+await import('./createBoundingBoxes')
+
+interface MockWidget {
+  name: string
+  hidden: boolean
+  options: Record<string, unknown>
+  widgetId?: string
+}
+
+function makeNode(connected: boolean, comfyClass = 'CreateBoundingBoxes') {
+  const widgets: MockWidget[] = [
+    { name: 'width', hidden: false, options: {} },
+    { name: 'height', hidden: false, options: {} },
+    { name: 'other', hidden: false, options: {} }
+  ]
+  return {
+    constructor: { comfyClass },
+    size: [100, 100] as [number, number],
+    setSize: vi.fn(),
+    findInputSlot: () => 0,
+    isInputConnected: () => connected,
+    widgets,
+    onConnectionsChange: undefined as unknown
+  }
+}
+
+beforeEach(() => {
+  state.widgetState = undefined
+})
+
+describe('Comfy.CreateBoundingBoxes extension', () => {
+  it('ignores nodes of other classes', () => {
+    const node = makeNode(true, 'SomethingElse')
+    state.extension!.nodeCreated(node)
+    expect(node.setSize).not.toHaveBeenCalled()
+  })
+
+  it('enlarges the node and hides width/height when a background is connected', () => {
+    const node = makeNode(true)
+    state.extension!.nodeCreated(node)
+    expect(node.setSize).toHaveBeenCalledWith([420, 560])
+    expect(node.widgets[0].hidden).toBe(true)
+    expect(node.widgets[1].hidden).toBe(true)
+    expect(node.widgets[0].options.hidden).toBe(true)
+    expect(node.widgets[2].hidden).toBe(false)
+  })
+
+  it('shows width/height when no background is connected', () => {
+    const node = makeNode(false)
+    state.extension!.nodeCreated(node)
+    expect(node.widgets[0].hidden).toBe(false)
+    expect(node.widgets[0].options.hidden).toBe(false)
+  })
+
+  it('writes visibility through the widget value store when present', () => {
+    state.widgetState = { options: {} }
+    const node = makeNode(true)
+    node.widgets[0].widgetId = 'w-0'
+    state.extension!.nodeCreated(node)
+    expect(state.widgetState.options.hidden).toBe(true)
+  })
+
+  it('chains a connections-change handler that re-syncs visibility', () => {
+    const node = makeNode(false)
+    state.extension!.nodeCreated(node)
+    expect(typeof node.onConnectionsChange).toBe('function')
+  })
+})
diff --git a/src/extensions/core/createBoundingBoxes.ts b/src/extensions/core/createBoundingBoxes.ts
new file mode 100644
index 0000000000..691c61d6b9
--- /dev/null
+++ b/src/extensions/core/createBoundingBoxes.ts
@@ -0,0 +1,38 @@
+import { useChainCallback } from '@/composables/functional/useChainCallback'
+import { useExtensionService } from '@/services/extensionService'
+import { useWidgetValueStore } from '@/stores/widgetValueStore'
+
+const DIMENSION_WIDGETS = new Set(['width', 'height'])
+
+useExtensionService().registerExtension({
+  name: 'Comfy.CreateBoundingBoxes',
+
+  nodeCreated(node) {
+    if (node.constructor.comfyClass !== 'CreateBoundingBoxes') return
+
+    const [oldWidth, oldHeight] = node.size
+    node.setSize([Math.max(oldWidth, 420), Math.max(oldHeight, 560)])
+
+    const widgetValueStore = useWidgetValueStore()
+
+    const syncDimensionVisibility = () => {
+      const slot = node.findInputSlot('background')
+      const hidden = slot >= 0 && node.isInputConnected(slot)
+      for (const widget of node.widgets ?? []) {
+        if (!DIMENSION_WIDGETS.has(widget.name)) continue
+        widget.hidden = hidden
+        const state = widget.widgetId
+          ? widgetValueStore.getWidget(widget.widgetId)
+          : undefined
+        if (state?.options) state.options.hidden = hidden
+        else widget.options.hidden = hidden
+      }
+    }
+
+    syncDimensionVisibility()
+    node.onConnectionsChange = useChainCallback(
+      node.onConnectionsChange,
+      syncDimensionVisibility
+    )
+  }
+})
diff --git a/src/extensions/core/index.ts b/src/extensions/core/index.ts
index 37cc00935f..17bcd621dc 100644
--- a/src/extensions/core/index.ts
+++ b/src/extensions/core/index.ts
@@ -2,6 +2,7 @@ import { isCloud, isNightly } from '@/platform/distribution/types'
 
 import './clipspace'
 import './contextMenuFilter'
+import './createBoundingBoxes'
 import './customWidgets'
 import './dynamicPrompts'
 import './editAttention'
diff --git a/src/extensions/core/load3d/Viewport3d.ts b/src/extensions/core/load3d/Viewport3d.ts
index a35bd52de6..45d2bcc9dc 100644
--- a/src/extensions/core/load3d/Viewport3d.ts
+++ b/src/extensions/core/load3d/Viewport3d.ts
@@ -1,5 +1,7 @@
 import * as THREE from 'three'
 
+import { WebGLViewport } from '@/renderer/three/WebGLViewport'
+
 import type { CameraManager } from './CameraManager'
 import type { ControlsManager } from './ControlsManager'
 import type { EventManager } from './EventManager'
@@ -27,8 +29,7 @@ export type Viewport3dDeps = {
   viewHelperManager: ViewHelperManager
 }
 
-export class Viewport3d {
-  renderer: THREE.WebGLRenderer
+export class Viewport3d extends WebGLViewport {
   protected clock: THREE.Clock
   private renderLoop: RenderLoopHandle | null = null
   private onContextMenuCallback?: (event: MouseEvent) => void
@@ -52,7 +53,6 @@ export class Viewport3d {
   isViewerMode: boolean = false
 
   private disposeContextMenuGuard: (() => void) | null = null
-  private resizeObserver: ResizeObserver | null = null
   private getZoomScaleCallback: (() => number) | undefined
   private externalActiveCamera: THREE.Camera | null = null
   private overlay: SceneOverlay | null = null
@@ -63,6 +63,7 @@ export class Viewport3d {
     deps: Viewport3dDeps,
     options: Load3DOptions = {}
   ) {
+    super(deps.renderer)
     this.clock = new THREE.Clock()
     this.isViewerMode = options.isViewerMode || false
     this.onContextMenuCallback = options.onContextMenu
@@ -73,7 +74,6 @@ export class Viewport3d {
       this.applyTargetSize(options.width, options.height)
     }
 
-    this.renderer = deps.renderer
     this.eventManager = deps.eventManager
     this.sceneManager = deps.sceneManager
     this.cameraManager = deps.cameraManager
@@ -94,7 +94,7 @@ export class Viewport3d {
     this.STATUS_MOUSE_ON_VIEWER = false
 
     this.initContextMenu()
-    this.initResizeObserver(container)
+    this.observeResize(container, () => this.handleResize())
   }
 
   start(): void {
@@ -118,16 +118,6 @@ export class Viewport3d {
     this.targetAspectRatio = width / height
   }
 
-  private initResizeObserver(container: Element | HTMLElement): void {
-    if (typeof ResizeObserver === 'undefined') return
-
-    this.resizeObserver?.disconnect()
-    this.resizeObserver = new ResizeObserver(() => {
-      this.handleResize()
-    })
-    this.resizeObserver.observe(container)
-  }
-
   private initContextMenu(): void {
     this.disposeContextMenuGuard = attachContextMenuGuard(
       this.renderer.domElement,
@@ -400,29 +390,15 @@ export class Viewport3d {
       this.initialRenderTimer = null
     }
 
-    if (this.resizeObserver) {
-      this.resizeObserver.disconnect()
-      this.resizeObserver = null
-    }
-
     this.disposeContextMenuGuard?.()
     this.disposeContextMenuGuard = null
 
-    this.renderer.forceContextLoss()
-    const canvas = this.renderer.domElement
-    const event = new Event('webglcontextlost', {
-      bubbles: true,
-      cancelable: true
-    })
-    canvas.dispatchEvent(event)
-
     this.renderLoop?.stop()
     this.renderLoop = null
 
     this.disposeManagers()
 
-    this.renderer.dispose()
-    this.renderer.domElement.remove()
+    this.disposeRenderer()
   }
 
   protected disposeManagers(): void {
diff --git a/src/extensions/core/widgetInputs.ts b/src/extensions/core/widgetInputs.ts
index 9b3c659799..19ac7aee3d 100644
--- a/src/extensions/core/widgetInputs.ts
+++ b/src/extensions/core/widgetInputs.ts
@@ -7,7 +7,6 @@ import type {
   LLink
 } from '@/lib/litegraph/src/litegraph'
 import { NodeSlot } from '@/lib/litegraph/src/node/NodeSlot'
-import type { CanvasPointerEvent } from '@/lib/litegraph/src/types/events'
 import type {
   IBaseWidget,
   TWidgetValue
@@ -273,17 +272,7 @@ export class PrimitiveNode extends LGraphNode {
       widgetName: 'value',
       nodeTypeForBrowser: targetNode.comfyClass ?? '',
       inputNameForBrowser: targetInputName,
-      defaultValue,
-      onValueChange: (widget, newValue, oldValue) => {
-        widget.callback?.(
-          widget.value,
-          app.canvas,
-          this,
-          app.canvas.graph_mouse,
-          {} as CanvasPointerEvent
-        )
-        this.onWidgetChanged?.(widget.name, newValue, oldValue, widget)
-      }
+      defaultValue
     })
   }
 
diff --git a/src/lib/litegraph/src/LGraph.test.ts b/src/lib/litegraph/src/LGraph.test.ts
index fb47840bb9..21d3b31dca 100644
--- a/src/lib/litegraph/src/LGraph.test.ts
+++ b/src/lib/litegraph/src/LGraph.test.ts
@@ -5,6 +5,7 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
 import type { NodeId, Subgraph } from '@/lib/litegraph/src/litegraph'
 import {
   LGraph,
+  LGraphGroup,
   LGraphNode,
   LiteGraph,
   LLink,
@@ -323,6 +324,96 @@ describe('Graph Clearing and Callbacks', () => {
   })
 })
 
+describe('node:before-removed event', () => {
+  it('fires node:before-removed for a successful node removal', () => {
+    const graph = new LGraph()
+    const node = new LGraphNode('test')
+    graph.add(node)
+
+    const events: { node: LGraphNode; graphAtDispatch: unknown }[] = []
+    graph.events.addEventListener('node:before-removed', (e) => {
+      events.push({
+        node: e.detail.node,
+        graphAtDispatch: e.detail.node.graph
+      })
+    })
+
+    graph.remove(node)
+
+    expect(events).toHaveLength(1)
+    expect(events[0].node).toBe(node)
+    expect(events[0].graphAtDispatch).toBe(graph)
+    expect(node.graph).toBeNull()
+  })
+
+  it('does not fire node:before-removed for a node not in the graph', () => {
+    const graph = new LGraph()
+    const node = new LGraphNode('test')
+
+    const fired = vi.fn()
+    graph.events.addEventListener('node:before-removed', fired)
+
+    graph.remove(node)
+
+    expect(fired).not.toHaveBeenCalled()
+  })
+
+  it('does not fire node:before-removed when removing an LGraphGroup', () => {
+    const graph = new LGraph()
+    const group = new LGraphGroup('test-group')
+    graph.add(group)
+
+    const fired = vi.fn()
+    graph.events.addEventListener('node:before-removed', fired)
+
+    graph.remove(group)
+
+    expect(fired).not.toHaveBeenCalled()
+  })
+
+  it('does not fire node:before-removed when ignore_remove is set', () => {
+    const graph = new LGraph()
+    const node = new LGraphNode('test')
+    graph.add(node)
+    node.ignore_remove = true
+
+    const fired = vi.fn()
+    graph.events.addEventListener('node:before-removed', fired)
+
+    graph.remove(node)
+
+    expect(fired).not.toHaveBeenCalled()
+    expect(graph.nodes).toContain(node)
+  })
+
+  it('fires node:before-removed before node.onRemoved and detach', () => {
+    const graph = new LGraph()
+    const node = new LGraphNode('test')
+    graph.add(node)
+
+    const order: string[] = []
+    graph.events.addEventListener('node:before-removed', () => {
+      order.push(
+        `before-removed(graph=${node.graph === graph ? 'set' : 'null'})`
+      )
+    })
+    node.onRemoved = () => {
+      order.push(`onRemoved(graph=${node.graph === graph ? 'set' : 'null'})`)
+    }
+    graph.onNodeRemoved = (n) => {
+      order.push(`onNodeRemoved(graph=${n.graph === null ? 'null' : 'set'})`)
+    }
+
+    graph.remove(node)
+
+    expect(order).toEqual([
+      'before-removed(graph=set)',
+      'onRemoved(graph=set)',
+      'onNodeRemoved(graph=null)'
+    ])
+  })
+})
+
 describe('Subgraph Definition Garbage Collection', () => {
   beforeEach(() => {
     setActivePinia(createTestingPinia({ stubActions: false }))
@@ -375,6 +466,53 @@ describe('Subgraph Definition Garbage Collection', () => {
     expect(graphRemovedNodeIds.size).toBe(2)
   })
 
+  it('subgraph-definition GC dispatches node:before-removed on the inner subgraph for each inner node', () => {
+    const rootGraph = new LGraph()
+    const { subgraph, innerNodes } = createSubgraphWithNodes(rootGraph, 2)
+
+    const dispatched: { node: LGraphNode; graphAtDispatch: unknown }[] = []
+    subgraph.events.addEventListener('node:before-removed', (e) => {
+      dispatched.push({
+        node: e.detail.node,
+        graphAtDispatch: e.detail.node.graph
+      })
+    })
+
+    const subgraphNode = createTestSubgraphNode(subgraph, { pos: [100, 100] })
+    rootGraph.add(subgraphNode)
+
+    rootGraph.remove(subgraphNode)
+
+    expect(dispatched.map((e) => e.node)).toEqual(innerNodes)
+    for (const entry of dispatched) {
+      expect(entry.graphAtDispatch).toBe(subgraph)
+    }
+  })
+
+  it('subgraph-definition GC dispatches node:before-removed before each inner node onRemoved', () => {
+    const rootGraph = new LGraph()
+    const { subgraph, innerNodes } = createSubgraphWithNodes(rootGraph, 1)
+    const innerNode = innerNodes[0]
+
+    const order: string[] = []
+    subgraph.events.addEventListener('node:before-removed', () => {
+      order.push('before-removed')
+    })
+    innerNode.onRemoved = () => {
+      order.push('onRemoved')
+    }
+    subgraph.onNodeRemoved = () => {
+      order.push('onNodeRemoved')
+    }
+
+    const subgraphNode = createTestSubgraphNode(subgraph, { pos: [100, 100] })
+    rootGraph.add(subgraphNode)
+
+    rootGraph.remove(subgraphNode)
+
+    expect(order).toEqual(['before-removed', 'onRemoved', 'onNodeRemoved'])
+  })
+
   it('subgraph definition is removed when SubgraphNode is removed', () => {
     const rootGraph = new LGraph()
     const { subgraph } = createSubgraphWithNodes(rootGraph, 1)
diff --git a/src/lib/litegraph/src/LGraph.ts b/src/lib/litegraph/src/LGraph.ts
index 3ebc50a946..ae8413873a 100644
--- a/src/lib/litegraph/src/LGraph.ts
+++ b/src/lib/litegraph/src/LGraph.ts
@@ -155,6 +155,13 @@ export interface BaseLGraph {
   readonly rootGraph: LGraph
 }
 
+function fireNodeRemovalLifecycle(node: LGraphNode): void {
+  const graph: LGraph | null = node.graph
+  graph?.events.dispatch('node:before-removed', { node })
+  node.onRemoved?.()
+  graph?.onNodeRemoved?.(node)
+}
+
 /**
  * LGraph is the class that contain a full graph. We instantiate one and add nodes to it, and then we can run the execution loop.
  * supported callbacks:
@@ -386,8 +393,7 @@ export class LGraph
     // safe clear
     if (this._nodes) {
       for (const _node of this._nodes) {
-        _node.onRemoved?.()
-        this.onNodeRemoved?.(_node)
+        fireNodeRemovalLifecycle(_node)
       }
     }
 
@@ -1046,6 +1052,8 @@ export class LGraph
     // sure? - almost sure is wrong
     this.beforeChange()
 
+    this.events.dispatch('node:before-removed', { node })
+
     const { inputs, outputs } = node
 
     // disconnect inputs
@@ -1081,10 +1089,7 @@ export class LGraph
       )
 
       if (!hasRemainingReferences) {
-        forEachNode(node.subgraph, (innerNode) => {
-          innerNode.onRemoved?.()
-          innerNode.graph?.onNodeRemoved?.(innerNode)
-        })
+        forEachNode(node.subgraph, fireNodeRemovalLifecycle)
         this.rootGraph.subgraphs.delete(node.subgraph.id)
       }
     }
diff --git a/src/lib/litegraph/src/LGraphCanvas.ts b/src/lib/litegraph/src/LGraphCanvas.ts
index 3e65ae6074..6269f0f422 100644
--- a/src/lib/litegraph/src/LGraphCanvas.ts
+++ b/src/lib/litegraph/src/LGraphCanvas.ts
@@ -27,6 +27,7 @@ import type { LinkId } from './LLink'
 import { Reroute } from './Reroute'
 import type { RerouteId } from './Reroute'
 import { LinkConnector } from './canvas/LinkConnector'
+import { getCanvasContextMenuTarget } from './canvas/getCanvasContextMenuTarget'
 import { isOverNodeInput, isOverNodeOutput } from './canvas/measureSlots'
 import { strokeShape } from './draw'
 import {
@@ -828,6 +829,7 @@ export class LGraphCanvas implements CustomEventDispatcher<LGraphCanvasEventMap>
       if (this._lowQualityZoomThreshold > 0) {
         this._isLowQuality = scale < this._lowQualityZoomThreshold
       }
+      this.setDirty(true, true)
     }
 
     // Initialize link renderer if graph is available
@@ -8719,42 +8721,25 @@ export class LGraphCanvas implements CustomEventDispatcher<LGraphCanvasEventMap>
       menu_info = this.getCanvasMenuOptions()
       if (!this.graph) throw new NullGraphError()
 
-      // Check for reroutes
-      if (this.links_render_mode !== LinkRenderType.HIDDEN_LINK) {
-        // Try layout store first, fallback to old method
-        const rerouteLayout = layoutStore.queryRerouteAtPoint({
-          x: event.canvasX,
-          y: event.canvasY
-        })
+      const { reroute, group } = getCanvasContextMenuTarget(
+        this,
+        event.canvasX,
+        event.canvasY
+      )
+      if (reroute) {
+        menu_info.unshift(
+          {
+            content: 'Delete Reroute',
+            callback: () => {
+              if (!this.graph) throw new NullGraphError()
 
-        let reroute: Reroute | undefined
-        if (rerouteLayout) {
-          reroute = this.graph.getReroute(rerouteLayout.id)
-        } else {
-          reroute = this.graph.getRerouteOnPos(
-            event.canvasX,
-            event.canvasY,
-            this._visibleReroutes
-          )
-        }
-        if (reroute) {
-          menu_info.unshift(
-            {
-              content: 'Delete Reroute',
-              callback: () => {
-                if (!this.graph) throw new NullGraphError()
-
-                this.graph.removeReroute(reroute.id)
-              }
-            },
-            null
-          )
-        }
+              this.graph.removeReroute(reroute.id)
+            }
+          },
+          null
+        )
       }
-
-      const group = this.graph.getGroupOnPos(event.canvasX, event.canvasY)
       if (group) {
-        // on group
         menu_info.push(null, {
           content: 'Edit Group',
           has_submenu: true,
diff --git a/src/lib/litegraph/src/canvas/getCanvasContextMenuTarget.test.ts b/src/lib/litegraph/src/canvas/getCanvasContextMenuTarget.test.ts
new file mode 100644
index 0000000000..1594411478
--- /dev/null
+++ b/src/lib/litegraph/src/canvas/getCanvasContextMenuTarget.test.ts
@@ -0,0 +1,97 @@
+import { fromAny } from '@total-typescript/shoehorn'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { getCanvasContextMenuTarget } from '@/lib/litegraph/src/canvas/getCanvasContextMenuTarget'
+import { LinkRenderType } from '@/lib/litegraph/src/types/globalEnums'
+
+const { mockQueryRerouteAtPoint } = vi.hoisted(() => ({
+  mockQueryRerouteAtPoint: vi.fn<() => unknown>(() => null)
+}))
+
+vi.mock('@/renderer/core/layout/store/layoutStore', () => ({
+  layoutStore: { queryRerouteAtPoint: mockQueryRerouteAtPoint }
+}))
+
+interface StubGraph {
+  getReroute: ReturnType<typeof vi.fn>
+  getRerouteOnPos: ReturnType<typeof vi.fn>
+  getGroupOnPos: ReturnType<typeof vi.fn>
+}
+
+interface StubCanvas {
+  graph: StubGraph | null
+  links_render_mode: number
+  _visibleReroutes: Set<unknown>
+}
+
+describe('getCanvasContextMenuTarget', () => {
+  let graph: StubGraph
+  let canvas: StubCanvas
+
+  beforeEach(() => {
+    vi.clearAllMocks()
+    mockQueryRerouteAtPoint.mockReturnValue(null)
+    graph = {
+      getReroute: vi.fn(() => ({ id: 9 })),
+      getRerouteOnPos: vi.fn(() => undefined),
+      getGroupOnPos: vi.fn(() => ({ id: 1 }))
+    }
+    canvas = {
+      graph,
+      links_render_mode: LinkRenderType.SPLINE_LINK,
+      _visibleReroutes: new Set()
+    }
+  })
+
+  function resolve() {
+    return getCanvasContextMenuTarget(fromAny(canvas), 10, 20)
+  }
+
+  it('returns the group under the point', () => {
+    const target = resolve()
+
+    expect(graph.getGroupOnPos).toHaveBeenCalledWith(10, 20)
+    expect(target.group).toEqual({ id: 1 })
+    expect(target.reroute).toBeUndefined()
+  })
+
+  it('resolves a reroute from the layout store without the positional fallback', () => {
+    mockQueryRerouteAtPoint.mockReturnValue({ id: 9 })
+
+    const target = resolve()
+
+    expect(graph.getReroute).toHaveBeenCalledWith(9)
+    expect(graph.getRerouteOnPos).not.toHaveBeenCalled()
+    expect(target.reroute).toEqual({ id: 9 })
+  })
+
+  it('falls back to the visible-scoped positional hit-test when the layout store misses', () => {
+    graph.getRerouteOnPos.mockReturnValue({ id: 7 })
+
+    const target = resolve()
+
+    expect(graph.getRerouteOnPos).toHaveBeenCalledWith(
+      10,
+      20,
+      canvas._visibleReroutes
+    )
+    expect(target.reroute).toEqual({ id: 7 })
+  })
+
+  it('skips reroute detection when links are hidden', () => {
+    canvas.links_render_mode = LinkRenderType.HIDDEN_LINK
+
+    const target = resolve()
+
+    expect(mockQueryRerouteAtPoint).not.toHaveBeenCalled()
+    expect(graph.getRerouteOnPos).not.toHaveBeenCalled()
+    expect(target.reroute).toBeUndefined()
+    expect(target.group).toEqual({ id: 1 })
+  })
+
+  it('returns an empty target when the canvas has no graph', () => {
+    canvas.graph = null
+
+    expect(resolve()).toEqual({})
+  })
+})
diff --git a/src/lib/litegraph/src/canvas/getCanvasContextMenuTarget.ts b/src/lib/litegraph/src/canvas/getCanvasContextMenuTarget.ts
new file mode 100644
index 0000000000..70f0686957
--- /dev/null
+++ b/src/lib/litegraph/src/canvas/getCanvasContextMenuTarget.ts
@@ -0,0 +1,36 @@
+import { layoutStore } from '@/renderer/core/layout/store/layoutStore'
+
+import type { LGraphCanvas } from '../LGraphCanvas'
+import type { LGraphGroup } from '../LGraphGroup'
+import type { Reroute } from '../Reroute'
+import { LinkRenderType } from '../types/globalEnums'
+
+interface CanvasContextMenuTarget {
+  reroute?: Reroute
+  group?: LGraphGroup
+}
+
+/** Resolves the reroute and group under a canvas-space point for a right-click. */
+export function getCanvasContextMenuTarget(
+  canvas: LGraphCanvas,
+  x: number,
+  y: number
+): CanvasContextMenuTarget {
+  const { graph } = canvas
+  if (!graph) return {}
+
+  let reroute: Reroute | undefined
+  if (canvas.links_render_mode !== LinkRenderType.HIDDEN_LINK) {
+    const layoutHit = layoutStore.queryRerouteAtPoint({ x, y })
+    reroute = layoutHit
+      ? graph.getReroute(layoutHit.id)
+      : graph.getRerouteOnPos(
+          x,
+          y,
+          (canvas as unknown as { _visibleReroutes: Iterable<Reroute> })
+            ._visibleReroutes
+        )
+  }
+
+  return { reroute, group: graph.getGroupOnPos(x, y) }
+}
diff --git a/src/lib/litegraph/src/infrastructure/LGraphEventMap.ts b/src/lib/litegraph/src/infrastructure/LGraphEventMap.ts
index 53d5fcfc0a..2f0eafb2bd 100644
--- a/src/lib/litegraph/src/infrastructure/LGraphEventMap.ts
+++ b/src/lib/litegraph/src/infrastructure/LGraphEventMap.ts
@@ -1,5 +1,5 @@
 import type { LGraph } from '@/lib/litegraph/src/LGraph'
-import type { NodeId } from '@/lib/litegraph/src/LGraphNode'
+import type { LGraphNode, NodeId } from '@/lib/litegraph/src/LGraphNode'
 import type { LLink, ResolvedConnection } from '@/lib/litegraph/src/LLink'
 import type { ReadOnlyRect } from '@/lib/litegraph/src/interfaces'
 import type { Subgraph } from '@/lib/litegraph/src/subgraph/Subgraph'
@@ -51,6 +51,13 @@ export interface LGraphEventMap {
     closingGraph: LGraph | Subgraph
   }
 
+  /**
+   * Fires on the owning graph before per-node teardown begins
+   */
+  'node:before-removed': {
+    node: LGraphNode
+  }
+
   'node:property:changed': {
     nodeId: NodeId
     property: string
diff --git a/src/lib/litegraph/src/subgraph/SubgraphNode.test.ts b/src/lib/litegraph/src/subgraph/SubgraphNode.test.ts
index e27d6f0988..ecdd031bcb 100644
--- a/src/lib/litegraph/src/subgraph/SubgraphNode.test.ts
+++ b/src/lib/litegraph/src/subgraph/SubgraphNode.test.ts
@@ -85,6 +85,19 @@ describe('SubgraphNode Construction', () => {
     expect(subgraphNode.graph).toBeNull()
   })
 
+  it('should return empty widgets array (not throw) after removal', () => {
+    const subgraph = createTestSubgraph()
+    const subgraphNode = createTestSubgraphNode(subgraph)
+    const parentGraph = subgraphNode.graph!
+    parentGraph.add(subgraphNode)
+
+    parentGraph.remove(subgraphNode)
+
+    expect(subgraphNode.graph).toBeNull()
+    expect(() => subgraphNode.widgets).not.toThrow()
+    expect(subgraphNode.widgets).toEqual([])
+  })
+
   subgraphTest(
     'should synchronize slots with subgraph definition',
     ({ subgraphWithNode }) => {
diff --git a/src/lib/litegraph/src/subgraph/SubgraphNode.ts b/src/lib/litegraph/src/subgraph/SubgraphNode.ts
index 00b5d5cfa5..97d40a6a5b 100644
--- a/src/lib/litegraph/src/subgraph/SubgraphNode.ts
+++ b/src/lib/litegraph/src/subgraph/SubgraphNode.ts
@@ -68,6 +68,10 @@ export class SubgraphNode extends LGraphNode implements BaseLGraph {
     return this.graph.rootGraph
   }
 
+  get isDetached(): boolean {
+    return !this.graph
+  }
+
   override get displayType(): string {
     return 'Subgraph node'
   }
diff --git a/src/lib/litegraph/src/types/widgets.ts b/src/lib/litegraph/src/types/widgets.ts
index 21165eae90..bfd21acf79 100644
--- a/src/lib/litegraph/src/types/widgets.ts
+++ b/src/lib/litegraph/src/types/widgets.ts
@@ -1,5 +1,6 @@
 import type { Bounds } from '@/renderer/core/layout/types'
 import type { CurveData } from '@/components/curve/types'
+import type { BoundingBox } from '@/types/boundingBoxes'
 import type { WidgetId } from '@/types/widgetId'
 
 import type {
@@ -141,6 +142,8 @@ export type IWidget =
   | ICurveWidget
   | IPainterWidget
   | IRangeWidget
+  | IBoundingBoxesWidget
+  | IColorsWidget
 
 export interface IBooleanWidget extends IBaseWidget<boolean, 'toggle'> {
   type: 'toggle'
@@ -343,6 +346,19 @@ export interface IPainterWidget extends IBaseWidget<string, 'painter'> {
   value: string
 }
 
+export interface IBoundingBoxesWidget extends IBaseWidget<
+  BoundingBox[],
+  'boundingboxes'
+> {
+  type: 'boundingboxes'
+  value: BoundingBox[]
+}
+
+export interface IColorsWidget extends IBaseWidget<string[], 'colors'> {
+  type: 'colors'
+  value: string[]
+}
+
 export interface RangeValue {
   min: number
   max: number
diff --git a/src/lib/litegraph/src/widgets/BoundingBoxesWidget.test.ts b/src/lib/litegraph/src/widgets/BoundingBoxesWidget.test.ts
new file mode 100644
index 0000000000..300c6f7e05
--- /dev/null
+++ b/src/lib/litegraph/src/widgets/BoundingBoxesWidget.test.ts
@@ -0,0 +1,42 @@
+import { describe, expect, it, vi } from 'vitest'
+
+import { LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type { DrawWidgetOptions } from '@/lib/litegraph/src/widgets/BaseWidget'
+
+import { BoundingBoxesWidget } from './BoundingBoxesWidget'
+
+function fakeCtx() {
+  return {
+    save: vi.fn(),
+    restore: vi.fn(),
+    fillRect: vi.fn(),
+    strokeRect: vi.fn(),
+    fillText: vi.fn(),
+    fillStyle: '',
+    strokeStyle: '',
+    font: '',
+    textAlign: '',
+    textBaseline: ''
+  } as unknown as CanvasRenderingContext2D
+}
+
+describe('BoundingBoxesWidget', () => {
+  it('has the boundingboxes type and draws the Vue-only placeholder', () => {
+    const node = new LGraphNode('Test')
+    const widget = new BoundingBoxesWidget(
+      {
+        type: 'boundingboxes',
+        name: 'editor_state',
+        value: [],
+        options: {},
+        y: 0
+      },
+      node
+    )
+    expect(widget.type).toBe('boundingboxes')
+    const ctx = fakeCtx()
+    widget.drawWidget(ctx, { width: 200 } as DrawWidgetOptions)
+    expect(ctx.fillText).toHaveBeenCalled()
+    expect(() => widget.onClick({} as never)).not.toThrow()
+  })
+})
diff --git a/src/lib/litegraph/src/widgets/BoundingBoxesWidget.ts b/src/lib/litegraph/src/widgets/BoundingBoxesWidget.ts
new file mode 100644
index 0000000000..a018410563
--- /dev/null
+++ b/src/lib/litegraph/src/widgets/BoundingBoxesWidget.ts
@@ -0,0 +1,16 @@
+import type { IBoundingBoxesWidget } from '../types/widgets'
+import { BaseWidget } from './BaseWidget'
+import type { DrawWidgetOptions, WidgetEventOptions } from './BaseWidget'
+
+export class BoundingBoxesWidget
+  extends BaseWidget<IBoundingBoxesWidget>
+  implements IBoundingBoxesWidget
+{
+  override type = 'boundingboxes' as const
+
+  drawWidget(ctx: CanvasRenderingContext2D, options: DrawWidgetOptions): void {
+    this.drawVueOnlyWarning(ctx, options, 'Bounding Boxes')
+  }
+
+  onClick(_options: WidgetEventOptions): void {}
+}
diff --git a/src/lib/litegraph/src/widgets/ColorsWidget.test.ts b/src/lib/litegraph/src/widgets/ColorsWidget.test.ts
new file mode 100644
index 0000000000..9c60dc0132
--- /dev/null
+++ b/src/lib/litegraph/src/widgets/ColorsWidget.test.ts
@@ -0,0 +1,36 @@
+import { describe, expect, it, vi } from 'vitest'
+
+import { LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type { DrawWidgetOptions } from '@/lib/litegraph/src/widgets/BaseWidget'
+
+import { ColorsWidget } from './ColorsWidget'
+
+function fakeCtx() {
+  return {
+    save: vi.fn(),
+    restore: vi.fn(),
+    fillRect: vi.fn(),
+    strokeRect: vi.fn(),
+    fillText: vi.fn(),
+    fillStyle: '',
+    strokeStyle: '',
+    font: '',
+    textAlign: '',
+    textBaseline: ''
+  } as unknown as CanvasRenderingContext2D
+}
+
+describe('ColorsWidget', () => {
+  it('has the colors type and draws the Vue-only placeholder', () => {
+    const node = new LGraphNode('Test')
+    const widget = new ColorsWidget(
+      { type: 'colors', name: 'palette', value: [], options: {}, y: 0 },
+      node
+    )
+    expect(widget.type).toBe('colors')
+    const ctx = fakeCtx()
+    widget.drawWidget(ctx, { width: 200 } as DrawWidgetOptions)
+    expect(ctx.fillText).toHaveBeenCalled()
+    expect(() => widget.onClick({} as never)).not.toThrow()
+  })
+})
diff --git a/src/lib/litegraph/src/widgets/ColorsWidget.ts b/src/lib/litegraph/src/widgets/ColorsWidget.ts
new file mode 100644
index 0000000000..4c77211849
--- /dev/null
+++ b/src/lib/litegraph/src/widgets/ColorsWidget.ts
@@ -0,0 +1,16 @@
+import type { IColorsWidget } from '../types/widgets'
+import { BaseWidget } from './BaseWidget'
+import type { DrawWidgetOptions, WidgetEventOptions } from './BaseWidget'
+
+export class ColorsWidget
+  extends BaseWidget<IColorsWidget>
+  implements IColorsWidget
+{
+  override type = 'colors' as const
+
+  drawWidget(ctx: CanvasRenderingContext2D, options: DrawWidgetOptions): void {
+    this.drawVueOnlyWarning(ctx, options, 'Colors')
+  }
+
+  onClick(_options: WidgetEventOptions): void {}
+}
diff --git a/src/lib/litegraph/src/widgets/widgetMap.ts b/src/lib/litegraph/src/widgets/widgetMap.ts
index 86fe73d9e0..c511f017cb 100644
--- a/src/lib/litegraph/src/widgets/widgetMap.ts
+++ b/src/lib/litegraph/src/widgets/widgetMap.ts
@@ -21,6 +21,8 @@ import { FileUploadWidget } from './FileUploadWidget'
 import { GalleriaWidget } from './GalleriaWidget'
 import { GradientSliderWidget } from './GradientSliderWidget'
 import { ImageCompareWidget } from './ImageCompareWidget'
+import { BoundingBoxesWidget } from './BoundingBoxesWidget'
+import { ColorsWidget } from './ColorsWidget'
 import { PainterWidget } from './PainterWidget'
 import { RangeWidget } from './RangeWidget'
 import { ImageCropWidget } from './ImageCropWidget'
@@ -62,6 +64,8 @@ export type WidgetTypeMap = {
   curve: CurveWidget
   painter: PainterWidget
   range: RangeWidget
+  boundingboxes: BoundingBoxesWidget
+  colors: ColorsWidget
   [key: string]: BaseWidget
 }
 
@@ -144,6 +148,10 @@ export function toConcreteWidget<TWidget extends IWidget | IBaseWidget>(
       return toClass(PainterWidget, narrowedWidget, node)
     case 'range':
       return toClass(RangeWidget, narrowedWidget, node)
+    case 'boundingboxes':
+      return toClass(BoundingBoxesWidget, narrowedWidget, node)
+    case 'colors':
+      return toClass(ColorsWidget, narrowedWidget, node)
     default: {
       if (wrapLegacyWidgets) return toClass(LegacyWidget, widget, node)
     }
diff --git a/src/locales/ar/main.json b/src/locales/ar/main.json
index 0d62a2b39c..69aabbb8d8 100644
--- a/src/locales/ar/main.json
+++ b/src/locales/ar/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "نموذج لورا",
     "LOSS_MAP": "خريطة الخسارة",
     "LUMA_CONCEPTS": "مفاهيم Luma",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "مرجع Luma",
     "MASK": "قناع",
     "MESH": "شبكة",
@@ -3979,6 +3980,7 @@
     "fileTooLarge": "الملف كبير جدًا ({size} ميجابايت). الحد الأقصى المدعوم هو {maxSize} ميجابايت",
     "fileUploadFailed": "فشل رفع الملف",
     "interrupted": "تم إيقاف التنفيذ",
+    "invalidTemplateData": "فشل في تحميل قالب العقدة: بيانات غير صالحة",
     "legacyMaskEditorDeprecated": "محرر القناع القديم لم يعد مدعوماً وسيتم إزالته قريباً.",
     "migrateToLitegraphReroute": "سيتم إزالة عقد إعادة التوجيه في الإصدارات المستقبلية. انقر للترحيل إلى إعادة التوجيه الأصلية في Litegraph.",
     "missingModelVerificationFailed": "فشل التحقق من النماذج المفقودة. قد لا تظهر بعض النماذج في علامة تبويب الأخطاء.",
diff --git a/src/locales/ar/nodeDefs.json b/src/locales/ar/nodeDefs.json
index 7de6538cc1..3ba8ed06aa 100644
--- a/src/locales/ar/nodeDefs.json
+++ b/src/locales/ar/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "fuse_method",
         "tooltip": "الطريقة المستخدمة لدمج نوافذ السياق."
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "قائمة مؤشرات الـ latent التي سيتم الاحتفاظ بها داخل الضوضاء latent لكل نافذة. تُستخدم في سير العمل حيث يكون المحتوى المرجعي (مثل صورة البداية) موجودًا مباشرةً في الضوضاء latent بدلاً من قنوات التكييف المنفصلة (مثل أسلوب inplace في I2V مثل LTXV، AnimateDiff). مستقلة عن cond_retain_index_list."
+      },
       "model": {
         "name": "model",
         "tooltip": "النموذج المراد تطبيق نوافذ السياق عليه أثناء أخذ العينات."
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "تعيين نوافذ السياق لنماذج شبيهة بـ LTXV.",
+    "display_name": "نوافذ السياق LTXV",
+    "inputs": {
+      "closed_loop": {
+        "name": "حلقة مغلقة",
+        "tooltip": "ما إذا كان سيتم إغلاق حلقة نافذة السياق؛ تنطبق فقط على الجداول الدائرية."
+      },
+      "context_length": {
+        "name": "طول السياق",
+        "tooltip": "طول نافذة السياق بالإطارات الحقيقية. يجب أن يكون 8*n + 1."
+      },
+      "context_overlap": {
+        "name": "تداخل السياق",
+        "tooltip": "تداخل نافذة السياق بالإطارات الحقيقية."
+      },
+      "context_schedule": {
+        "name": "جدولة السياق",
+        "tooltip": "خوارزمية جدولة تعتمد على الخطوات لنوافذ السياق."
+      },
+      "context_stride": {
+        "name": "خطوة السياق",
+        "tooltip": "خطوة نافذة السياق؛ تنطبق فقط على الجداول الموحدة."
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "ما إذا كان سيتم تطبيق خلط ضوضاء FreeNoise، يحسن دمج النوافذ."
+      },
+      "fuse_method": {
+        "name": "طريقة الدمج",
+        "tooltip": "طريقة دمج نوافذ السياق."
+      },
+      "model": {
+        "name": "النموذج",
+        "tooltip": "النموذج الذي سيتم تطبيق نوافذ السياق عليه أثناء التوليد."
+      },
+      "retain_first_frame": {
+        "name": "الاحتفاظ بالإطار الأول",
+        "tooltip": "الاحتفاظ بأول إطار latent في كل نافذة سياق (قد يساعد في الحفاظ على المرجع الأولي)."
+      },
+      "split_conds_to_windows": {
+        "name": "تقسيم الشروط للنوافذ",
+        "tooltip": "ما إذا كان سيتم تقسيم الشروط المتعددة (التي تم إنشاؤها بواسطة ConditionCombine) لكل نافذة بناءً على مؤشر المنطقة."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "النموذج مع تطبيق نوافذ السياق أثناء التوليد."
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "قص أدلة LTXV",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "تحميل ثلاثي الأبعاد (متقدم)",
+    "inputs": {
+      "height": {
+        "name": "الارتفاع"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "العرض"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "نموذج ثلاثي الأبعاد",
+        "tooltip": null
+      },
+      "1": {
+        "name": "معلومات النموذج ثلاثي الأبعاد",
+        "tooltip": null
+      },
+      "2": {
+        "name": "معلومات الكاميرا",
+        "tooltip": null
+      },
+      "3": {
+        "name": "العرض",
+        "tooltip": null
+      },
+      "4": {
+        "name": "الارتفاع",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "تحميل الصوت",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "قم بتمديد جيل Ray 3.2 السابق للأمام (استمر بعده) أو للخلف (مقدمة قبله). قم بتوصيل مخرج generation_id من عقدة Luma Ray 3.2 السابقة. الامتدادات دائماً مدتها ٥ ثوانٍ.",
+    "display_name": "Luma Ray 3.2 تمديد الفيديو",
+    "inputs": {
+      "control_after_generate": {
+        "name": "التحكم بعد التوليد"
+      },
+      "direction": {
+        "name": "الاتجاه",
+        "tooltip": "الأمام تعني الاستمرار بعد المقطع السابق؛ الخلف تعني الإضافة قبله."
+      },
+      "direction_loop": {
+        "name": "تكرار"
+      },
+      "prompt": {
+        "name": "الموجه النصي",
+        "tooltip": "موجه نصي للمحتوى الجديد."
+      },
+      "resolution": {
+        "name": "الدقة"
+      },
+      "seed": {
+        "name": "البذرة",
+        "tooltip": "البذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج غير حتمية بغض النظر عن البذرة."
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "generation_id لفيديو Ray 3.2 السابق الذي تريد تمديده. قم بتوصيل مخرج generation_id من عقدة Luma Ray 3.2 أخرى."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "إنشاء فيديو من إطار بداية و/أو نهاية باستخدام نموذج Ray 3.2 من Luma. عمليات التوليد المرتكزة على الصور دائماً مدتها ٥ ثوانٍ.",
+    "display_name": "Luma Ray 3.2 من صورة إلى فيديو",
+    "inputs": {
+      "control_after_generate": {
+        "name": "التحكم بعد التوليد"
+      },
+      "end_frame": {
+        "name": "إطار النهاية",
+        "tooltip": "الإطار الأخير للفيديو المُنتج."
+      },
+      "loop": {
+        "name": "تكرار",
+        "tooltip": "اجعل الفيديو يتكرر بسلاسة. غير متاح عند تعيين end_frame."
+      },
+      "prompt": {
+        "name": "الموجه النصي",
+        "tooltip": "موجه نصي لتوليد الفيديو."
+      },
+      "resolution": {
+        "name": "الدقة"
+      },
+      "seed": {
+        "name": "البذرة",
+        "tooltip": "البذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج غير حتمية بغض النظر عن البذرة."
+      },
+      "start_frame": {
+        "name": "إطار البداية",
+        "tooltip": "الإطار الأول للفيديو المُنتج."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "ثبت صورة إرشادية في موضع على خط زمن فيديو Ray 3.2 الناتج. قم بتوصيل هذه العقدة بمدخل 'keyframes' في عقدة Luma Ray 3.2 Keyframes to Video؛ يمكنك ربط عدة عقد معاً عبر مدخل 'keyframes' الاختياري أدناه.",
+    "display_name": "Luma Ray 3.2 إطار رئيسي",
+    "inputs": {
+      "image": {
+        "name": "الصورة",
+        "tooltip": "صورة إرشادية لوضعها في اللحظة المختارة من الفيديو الناتج."
+      },
+      "keyframes": {
+        "name": "الإطارات الرئيسية",
+        "tooltip": "إطارات رئيسية سابقة اختيارية لربطها مع هذه."
+      },
+      "position": {
+        "name": "الموضع",
+        "tooltip": "كيفية وضع هذه الصورة على خط زمن الفيديو الناتج."
+      },
+      "position_fraction": {
+        "name": "النسبة"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "الإطارات الرئيسية",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "إنشاء فيديو يقوم بعمل استيفاء بين سلسلة من صور الدليل، كل واحدة منها مرتبطة بموقع على الخط الزمني، باستخدام Luma Ray 3.2. قم ببناء التسلسل باستخدام عقد Luma Ray 3.2 Keyframe (على الأقل ٢).",
+    "display_name": "Luma Ray 3.2 تحويل الإطارات الرئيسية إلى فيديو",
+    "inputs": {
+      "control_after_generate": {
+        "name": "التحكم بعد الإنشاء"
+      },
+      "duration": {
+        "name": "المدة"
+      },
+      "keyframes": {
+        "name": "الإطارات الرئيسية",
+        "tooltip": "تسلسل الإطارات الرئيسية من عقد Luma Ray 3.2 Keyframe (على الأقل ٢)."
+      },
+      "prompt": {
+        "name": "الوصف النصي",
+        "tooltip": "الوصف النصي لإنشاء الفيديو."
+      },
+      "resolution": {
+        "name": "الدقة"
+      },
+      "seed": {
+        "name": "البذرة",
+        "tooltip": "البذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج غير حتمية بغض النظر عن البذرة."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "معرّف التوليد",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "إنشاء فيديو من وصف نصي باستخدام نموذج Luma Ray 3.2.",
+    "display_name": "Luma Ray 3.2 تحويل النص إلى فيديو",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "نسبة العرض إلى الارتفاع"
+      },
+      "control_after_generate": {
+        "name": "التحكم بعد الإنشاء"
+      },
+      "duration": {
+        "name": "المدة"
+      },
+      "loop": {
+        "name": "تكرار",
+        "tooltip": "اجعل الفيديو يتكرر بسلاسة. متوفر فقط لمدة ٥ ثوانٍ."
+      },
+      "prompt": {
+        "name": "الوصف النصي",
+        "tooltip": "الوصف النصي لإنشاء الفيديو."
+      },
+      "resolution": {
+        "name": "الدقة"
+      },
+      "seed": {
+        "name": "البذرة",
+        "tooltip": "البذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج غير حتمية بغض النظر عن البذرة."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "معرّف التوليد",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "إعادة إنتاج فيديو موجود بناءً على وصف نصي جديد باستخدام Luma Ray 3.2 (تغيير النمط، إعادة الإضاءة، إضافة أو إزالة عناصر) مع الحفاظ على الحركة الأصلية. الفيديو المصدر حتى ١٨ ثانية؛ الفيديو المعدل يحتفظ بطول المصدر.",
+    "display_name": "Luma Ray 3.2 تحرير الفيديو",
+    "inputs": {
+      "control_after_generate": {
+        "name": "التحكم بعد الإنشاء"
+      },
+      "prompt": {
+        "name": "الوصف النصي",
+        "tooltip": "يصف التعديل المطلوب."
+      },
+      "resolution": {
+        "name": "الدقة"
+      },
+      "seed": {
+        "name": "البذرة",
+        "tooltip": "البذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج غير حتمية بغض النظر عن البذرة."
+      },
+      "strength": {
+        "name": "القوة",
+        "tooltip": "مدى قوة الحفاظ على المصدر مقابل إعادة تخيله. 'تلقائي' يتيح لـ Ray 3.2 الاختيار؛ adhere_* يحافظ على الأصل أكثر، flex_* متوازن، reimagine_* يغير أكثر."
+      },
+      "video": {
+        "name": "الفيديو",
+        "tooltip": "فيديو المصدر للتحرير. حتى ١٨ ثانية."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "معرّف التوليد",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "تغيير نسبة العرض إلى الارتفاع لفيديو موجود، باستخدام Luma Ray 3.2 لملء المناطق الجديدة المكشوفة من اللوحة. الفيديو المصدر حتى ٣٠ ثانية. يتم احتساب التكلفة لكل ثانية من الناتج.",
+    "display_name": "إعادة تأطير الفيديو Luma Ray 3.2",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "نسبة العرض إلى الارتفاع"
+      },
+      "control_after_generate": {
+        "name": "التحكم بعد التوليد"
+      },
+      "prompt": {
+        "name": "موجه",
+        "tooltip": "يصف كيفية ملء المناطق الجديدة المكشوفة من اللوحة."
+      },
+      "resolution": {
+        "name": "الدقة"
+      },
+      "seed": {
+        "name": "البذرة",
+        "tooltip": "البذرة لتحديد ما إذا كان يجب إعادة تشغيل العقدة؛ النتائج غير حتمية بغض النظر عن البذرة."
+      },
+      "video": {
+        "name": "فيديو",
+        "tooltip": "فيديو المصدر لإعادة التأطير. حتى ٣٠ ثانية."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "معرّف التوليد",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "يحتوي على صورة ووزن لاستخدامها مع عقدة توليد صورة لومة.",
     "display_name": "مرجع لومة",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "واجهة المستخدم للصوت"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصوت",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "الصور"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصور"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "الصور"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصور",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "الجودة"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصور",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "بادئة اسم الملف"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصوت",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "الصيغة",
         "tooltip": "صيغة الملف التي سيتم حفظ الصوت بها."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصوت",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "الجودة"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصوت",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "الجودة"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصوت",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "الصور",
         "tooltip": "الصور التي سيتم حفظها."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصور"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "الصور",
         "tooltip": "الصور المراد حفظها."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصور",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "عينات"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "عينات"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "svg"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "الفيديو",
         "tooltip": "الفيديو الذي سيتم حفظه."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "فيديو",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "الصور",
         "tooltip": "يتم حفظ صور RGBA مع قناة ألفا الخاصة بها كشفافية (ترميز vp9 فقط)."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "الصور",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "النموذج",
         "tooltip": "النموذج المراد تطبيق نوافذ السياق عليه أثناء أخذ العينات."
+      },
+      "retain_first_frame": {
+        "name": "الاحتفاظ بالإطار الأول",
+        "tooltip": "الاحتفاظ بأول إطار I2V في كل نافذة سياق (قد يساعد في الحفاظ على المرجع الأولي)."
+      },
+      "split_conds_to_windows": {
+        "name": "تقسيم الشروط للنوافذ",
+        "tooltip": "ما إذا كان يجب تقسيم الشروط المتعددة (التي تم إنشاؤها بواسطة ConditionCombine) إلى كل نافذة بناءً على مؤشر المنطقة."
       }
     },
     "outputs": {
diff --git a/src/locales/en/main.json b/src/locales/en/main.json
index dafd14e45d..94f9ee19ca 100644
--- a/src/locales/en/main.json
+++ b/src/locales/en/main.json
@@ -387,6 +387,35 @@
     "collapseAll": "Collapse all",
     "expandAll": "Expand all"
   },
+  "hdrViewer": {
+    "title": "HDR Viewer",
+    "openInHdrViewer": "Open in HDR Viewer",
+    "hdrImage": "HDR image",
+    "failedToLoad": "Failed to load HDR image",
+    "exposure": "Exposure",
+    "normalizeExposure": "Auto exposure",
+    "channel": "Channel",
+    "channels": {
+      "rgb": "RGB",
+      "r": "R",
+      "g": "G",
+      "b": "B",
+      "a": "Alpha",
+      "luminance": "Luminance"
+    },
+    "sourceGamut": "Source gamut",
+    "dither": "Dither",
+    "clipWarnings": "Clip warnings",
+    "fitView": "Fit",
+    "histogram": "Histogram",
+    "resolution": "Resolution",
+    "min": "Min",
+    "max": "Max",
+    "mean": "Mean",
+    "stdDev": "Std dev",
+    "nan": "NaN",
+    "inf": "Inf"
+  },
   "manager": {
     "title": "Nodes Manager",
     "nodePackInfo": "Node Pack Info",
@@ -866,8 +895,8 @@
       "nodes": "Nodes",
       "models": "Models",
       "assets": "Assets",
-      "workflows": "Workflows",
-      "templates": "Templates",
+      "workflows": "Work\u00adflows",
+      "templates": "Tem\u00adplates",
       "console": "Console",
       "menu": "Menu",
       "imported": "Imported",
@@ -1859,6 +1888,7 @@
     "LORA_MODEL": "LORA_MODEL",
     "LOSS_MAP": "LOSS_MAP",
     "LUMA_CONCEPTS": "LUMA_CONCEPTS",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "LUMA_REF",
     "MASK": "MASK",
     "MESH": "MESH",
@@ -2112,6 +2142,21 @@
     "monotone_cubic": "Smooth",
     "linear": "Linear"
   },
+  "boundingBoxes": {
+    "clearAll": "Clear all",
+    "clickRegionToEdit": "Click a region to edit it.",
+    "typeObj": "obj",
+    "typeText": "text",
+    "textLabel": "Text",
+    "descLabel": "description",
+    "textPlaceholder": "text to render (verbatim)",
+    "descPlaceholder": "description of this region",
+    "colors": "color_palette"
+  },
+  "palette": {
+    "addColor": "Add a color",
+    "swatchTitle": "Click edit · drag reorder · right-click remove"
+  },
   "toastMessages": {
     "nothingToQueue": "Nothing to queue",
     "pleaseSelectOutputNodes": "Please select output nodes",
@@ -2328,7 +2373,8 @@
       "auth/network-request-failed": "Network error. Please check your connection and try again.",
       "auth/popup-closed-by-user": "Sign-in was cancelled. Please try again.",
       "auth/cancelled-popup-request": "Sign-in was cancelled. Please try again.",
-      "generic": "Something went wrong while signing you in. Please try again."
+      "generic": "Something went wrong while signing you in. Please try again.",
+      "signupBlocked": "We couldn't create your account right now. Please try again later. If this keeps happening, email support@comfy.org."
     },
     "deleteAccount": {
       "contactSupport": "To delete your account, please contact {email}"
@@ -2418,6 +2464,13 @@
     "model": "Model",
     "added": "Added",
     "accountInitialized": "Account initialized",
+    "eventTypes": {
+      "creditAdded": "Credits Added",
+      "accountCreated": "Account Created",
+      "apiUsage": "API Usage",
+      "gpuUsage": "GPU Usage",
+      "apiNodeUsage": "Partner Node Usage"
+    },
     "unified": {
       "message": "Credits have been unified",
       "tooltip": "We've unified payments across Comfy. Everything now runs on Comfy Credits:\n- Partner Nodes (formerly API nodes)\n- Cloud workflows\n\nYour existing Partner node balance has been converted into credits."
@@ -2529,13 +2582,17 @@
         "name": "Founder's Edition"
       },
       "standard": {
-        "name": "Standard"
+        "name": "Standard",
+        "feature1": "30 minute max workflow runtime",
+        "feature2": "Add more credits anytime"
       },
       "creator": {
-        "name": "Creator"
+        "name": "Creator",
+        "feature1": "Import your own models"
       },
       "pro": {
-        "name": "Pro"
+        "name": "Pro",
+        "feature1": "Longer workflow runtime (up to 1 hr)"
       }
     },
     "required": {
@@ -2563,10 +2620,52 @@
     "subscriptionRequiredMessage": "A subscription is required for members to run workflows on Cloud and invite members",
     "contactOwnerToSubscribe": "Contact the workspace owner to subscribe",
     "description": "Choose the best plan for you",
-    "descriptionWorkspace": "Choose the best plan for your workspace",
+    "descriptionWorkspace": "Choose a Plan",
     "haveQuestions": "Have questions or wondering about enterprise?",
     "contactUs": "Contact us",
     "viewEnterprise": "View enterprise",
+    "planScope": {
+      "personal": "For Personal",
+      "team": "For Teams"
+    },
+    "teamHeader": "For teams wanting to collaborate. Need more members? {learnMore} about enterprise.",
+    "teamHeaderLearnMore": "Learn more",
+    "personalHeader": "Personal plans are for individual use only. {action}",
+    "personalHeaderAction": "To add teammates, subscribe to the team plan.",
+    "whatsIncluded": "What's included:",
+    "everythingInPlus": "Everything in {plan}, plus:",
+    "monthlyCredits": "monthly credits",
+    "videoEstimate": "Generates ~{count} 5s videos*",
+    "saveYearly": "Save 20%",
+    "saveYearlyUpTo": "Save up to 20%",
+    "teamPlan": {
+      "name": "Team Plan",
+      "tagline": "Choose your own monthly credit subscription. Get a larger discount with a larger credit subscription.",
+      "detailsTitle": "Details",
+      "perkInviteMembers": "Invite team members",
+      "perkConcurrentRuns": "Members can run workflows concurrently",
+      "perkSharedPool": "Shared credit pool for all members",
+      "perkRolePermissions": "Role-based permissions",
+      "comingSoonLabel": "Coming soon:",
+      "perkProjectAssets": "Project & asset management",
+      "cta": "Subscribe to Team Yearly",
+      "ctaMonthly": "Subscribe to Team Monthly",
+      "changePlan": "Change plan",
+      "currentPlan": "Current plan",
+      "checkoutComingSoon": "Team plan checkout is coming soon."
+    },
+    "enterprise": {
+      "name": "Enterprise",
+      "needMoreMembers": "Need more members?",
+      "flexibility": "Looking for more flexibility or custom features?",
+      "reachOut": "Reach out to us and let's schedule a chat.",
+      "cta": "Learn more"
+    },
+    "pricingBlurb": "*Based on this template, {seeDetails}. Contact us for {questions} or {enterpriseDiscussions}. For more pricing details, {clickHere}.",
+    "pricingBlurbSeeDetails": "see details",
+    "pricingBlurbQuestions": "questions",
+    "pricingBlurbEnterprise": "enterprise discussions",
+    "pricingBlurbClickHere": "click here",
     "freeTier": {
       "title": "You're on the Free plan",
       "description": "Your free plan includes {credits} credits each month to try Comfy Cloud.",
@@ -2626,6 +2725,9 @@
       "starting": "Starting {date}",
       "ends": "Ends {date}",
       "eachMonthCreditsRefill": "Each month credits refill to",
+      "everyMonthStarting": "Every month starting {date}",
+      "creditsRefillTo": "Credits refill to",
+      "youllBeCharged": "You'll be charged",
       "perMember": "/ member",
       "showMoreFeatures": "Show more features",
       "hideFeatures": "Hide features",
@@ -2638,7 +2740,14 @@
       "privacyPolicy": "Privacy Policy",
       "addCreditCard": "Add credit card",
       "confirm": "Confirm",
+      "subscribeToPlan": "Subscribe to {plan}",
+      "switchToPlan": "Switch to {plan}",
       "backToAllPlans": "Back to all plans"
+    },
+    "success": {
+      "allSet": "You're all set",
+      "planUpdated": "Your plan has been successfully updated.",
+      "receiptEmailed": "A receipt has been emailed to you."
     }
   },
   "userSettings": {
@@ -2881,7 +2990,7 @@
     "share": "Share"
   },
   "shortcuts": {
-    "shortcuts": "Shortcuts",
+    "shortcuts": "Short\u00adcuts",
     "essentials": "Essential",
     "viewControls": "View Controls",
     "manageShortcuts": "Manage Shortcuts",
@@ -3121,6 +3230,7 @@
     "invalidFilename": "Invalid Filename",
     "invalidFilenameDetail": "The asset filename could not be determined. Please try again.",
     "failedToCreateNode": "Failed to create node. Please try again or check console for details.",
+    "failedToSetModelValue": "Node added, but its model could not be set automatically. Check the console for details.",
     "fileFormats": "File formats",
     "fileName": "File Name",
     "fileSize": "File Size",
@@ -3275,7 +3385,7 @@
       "error": "Error"
     },
     "selection": {
-      "selectedCount": "Assets Selected: {count}",
+      "selectedCount": "{count} selected",
       "multipleSelectedAssets": "Multiple assets selected",
       "deselectAll": "Deselect all",
       "downloadSelected": "Download",
diff --git a/src/locales/en/nodeDefs.json b/src/locales/en/nodeDefs.json
index bb660e4382..c957ea1bab 100644
--- a/src/locales/en/nodeDefs.json
+++ b/src/locales/en/nodeDefs.json
@@ -2138,7 +2138,7 @@
     }
   },
   "ComfySwitchNode": {
-    "display_name": "Switch",
+    "display_name": "If/Else Switch",
     "inputs": {
       "switch": {
         "name": "switch"
@@ -2445,7 +2445,7 @@
       },
       "context_schedule": {
         "name": "context_schedule",
-        "tooltip": "The stride of the context window."
+        "tooltip": "Step-dependent scheduling algorithm for context windows."
       },
       "context_stride": {
         "name": "context_stride",
@@ -2469,12 +2469,16 @@
       },
       "cond_retain_index_list": {
         "name": "cond_retain_index_list",
-        "tooltip": "List of latent indices to retain in the conditioning tensors for each window, for example setting this to '0' will use the initial start image for each window."
+        "tooltip": "List of latent indices to retain in the conditioning tensors for each window. For concat-style I2V models (e.g. Wan I2V, HunyuanVideo I2V, Cosmos I2V, SVD) the encoded start image lives in the c_concat conditioning channels; setting this to '0' will retain that start image content at sub-pos 0 of every window."
       },
       "split_conds_to_windows": {
         "name": "split_conds_to_windows",
         "tooltip": "Whether to split multiple conditionings (created by ConditionCombine) to each window based on region index."
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "List of latent indices to retain in the noise latent itself for each window. Use for workflows where reference content (e.g. a start image) lives directly in the noise latent rather than in separate conditioning channels (e.g. inplace-style I2V like LTXV, AnimateDiff). Independent of cond_retain_index_list."
+      },
       "causal_window_fix": {
         "name": "causal_window_fix",
         "tooltip": "Whether to add a causal fix frame to non-0-indexed context windows."
@@ -4541,7 +4545,7 @@
     }
   },
   "FrameInterpolate": {
-    "display_name": "Frame Interpolate",
+    "display_name": "Run Frame Interpolation Model",
     "inputs": {
       "interp_model": {
         "name": "interp_model"
@@ -8658,6 +8662,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "Load 3D (Advanced)",
+    "inputs": {
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      },
+      "height": {
+        "name": "height"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "Load Audio",
     "inputs": {
@@ -9264,6 +9307,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "display_name": "LTXV Context Windows",
+    "description": "Set context windows for LTXV-like models.",
+    "inputs": {
+      "model": {
+        "name": "model",
+        "tooltip": "The model to apply context windows to during sampling."
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "The length of the context window in real frames. Must be 8*n + 1."
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "The overlap of the context window in real frames."
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "Step-dependent scheduling algorithm for context windows."
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "The stride of the context window; only applicable to uniform schedules."
+      },
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "Whether to close the context window loop; only applicable to looped schedules."
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "The method to use to fuse the context windows."
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "Whether to apply FreeNoise noise shuffling, improves window blending."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "Retain the first latent frame in every context window (may help retain initial reference)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "Whether to split multiple conditionings (created by ConditionCombine) to each window based on region index."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "The model with context windows applied during sampling."
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXVCropGuides",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "display_name": "Luma Ray 3.2 Extend Video",
+    "description": "Extend a previous Ray 3.2 generation forward (continue after it) or backward (lead-in before it). Connect the generation_id output of a prior Luma Ray 3.2 node. Extensions are always 5 seconds.",
+    "inputs": {
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "generation_id of the prior Ray 3.2 video to extend. Connect the generation_id output of another Luma Ray 3.2 node."
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "Forward continues after the prior clip; backward is prepended before it."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Text prompt for the new content."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed to determine if node should re-run; results are nondeterministic regardless of seed."
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "direction_loop": {
+        "name": "loop"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "display_name": "Luma Ray 3.2 Image to Video",
+    "description": "Generate a video from a start and/or end frame using Luma's Ray 3.2 model. Image-anchored generations are always 5 seconds.",
+    "inputs": {
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Text prompt for the video generation."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "Make the video loop seamlessly. Not available when an end_frame is set."
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed to determine if node should re-run; results are nondeterministic regardless of seed."
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "First frame of the generated video."
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "Last frame of the generated video."
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "display_name": "Luma Ray 3.2 Keyframe",
+    "description": "Anchor a guide image to a position on the Ray 3.2 output video timeline. Connect this to the 'keyframes' input of the Luma Ray 3.2 Keyframes to Video node; chain several together via the optional 'keyframes' input below.",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "Guide image to place at the chosen moment of the output video."
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "How to place this image on the output video's timeline."
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Optional earlier keyframes to chain with this one."
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "display_name": "Luma Ray 3.2 Keyframes to Video",
+    "description": "Generate a video that interpolates through a sequence of guide images, each anchored to a position on the timeline, using Luma Ray 3.2. Build the sequence with Luma Ray 3.2 Keyframe nodes (at least 2).",
+    "inputs": {
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Text prompt for the video generation."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "duration": {
+        "name": "duration"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed to determine if node should re-run; results are nondeterministic regardless of seed."
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Keyframe sequence from Luma Ray 3.2 Keyframe nodes (at least 2)."
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "display_name": "Luma Ray 3.2 Text to Video",
+    "description": "Generate a video from a text prompt using Luma's Ray 3.2 model.",
+    "inputs": {
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Text prompt for the video generation."
+      },
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "duration": {
+        "name": "duration"
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "Make the video loop seamlessly. Only available with 5s duration."
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed to determine if node should re-run; results are nondeterministic regardless of seed."
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "display_name": "Luma Ray 3.2 Video Edit",
+    "description": "Re-render an existing video under a new prompt using Luma Ray 3.2 (restyle, relight, add or remove elements) while keeping the original motion. Source video up to 18 seconds; the edited video keeps the source's length.",
+    "inputs": {
+      "video": {
+        "name": "video",
+        "tooltip": "Source video to edit. Up to 18 seconds."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Describes the desired edit."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "strength": {
+        "name": "strength",
+        "tooltip": "How strongly to preserve vs. reimagine the source. 'auto' lets Ray 3.2 choose; adhere_* preserves the most, flex_* is balanced, reimagine_* changes the most."
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed to determine if node should re-run; results are nondeterministic regardless of seed."
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "display_name": "Luma Ray 3.2 Video Reframe",
+    "description": "Change the aspect ratio of an existing video, using Luma Ray 3.2 to fill the newly exposed canvas areas. Source video up to 30 seconds. Billed per second of output.",
+    "inputs": {
+      "video": {
+        "name": "video",
+        "tooltip": "Source video to reframe. Up to 30 seconds."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Describes how the newly exposed canvas areas should be filled."
+      },
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed to determine if node should re-run; results are nondeterministic regardless of seed."
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "display_name": "Luma Reference",
     "description": "Holds an image and weight for use with Luma Generate Image node.",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "audioUI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "images"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -14243,7 +14604,7 @@
     }
   },
   "PrimitiveString": {
-    "display_name": "Text String",
+    "display_name": "Text String (DEPRECATED)",
     "inputs": {
       "value": {
         "name": "value"
@@ -14256,7 +14617,7 @@
     }
   },
   "PrimitiveStringMultiline": {
-    "display_name": "Text String (Multiline)",
+    "display_name": "Input Text",
     "inputs": {
       "value": {
         "name": "value"
@@ -16629,6 +16990,12 @@
       "compress_level": {
         "name": "compress_level"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16652,10 +17019,16 @@
       "method": {
         "name": "method"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
-    "display_name": "Save Audio (FLAC) (Deprecated)",
+    "display_name": "Save Audio (FLAC) (DEPRECATED)",
     "inputs": {
       "audio": {
         "name": "audio"
@@ -16666,6 +17039,12 @@
       "audioUI": {
         "name": "audioUI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16687,10 +17066,16 @@
       "audioUI": {
         "name": "audioUI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
-    "display_name": "Save Audio (MP3) (Deprecated)",
+    "display_name": "Save Audio (MP3) (DEPRECATED)",
     "inputs": {
       "audio": {
         "name": "audio"
@@ -16704,10 +17089,16 @@
       "audioUI": {
         "name": "audioUI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
-    "display_name": "Save Audio (Opus) (Deprecated)",
+    "display_name": "Save Audio (Opus) (DEPRECATED)",
     "inputs": {
       "audio": {
         "name": "audio"
@@ -16721,6 +17112,12 @@
       "audioUI": {
         "name": "audioUI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -16750,6 +17147,11 @@
         "name": "filename_prefix",
         "tooltip": "The prefix for the file to save. This may include formatting information such as %date:yyyy-MM-dd% or %Empty Latent Image.width% to include values from nodes."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -16774,6 +17176,12 @@
       "format_input_color_space": {
         "name": "input_color_space"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -16841,6 +17249,11 @@
       "filename_prefix": {
         "name": "filename_prefix"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "samples"
+      }
     }
   },
   "SaveLoRA": {
@@ -16871,6 +17284,12 @@
         "name": "filename_prefix",
         "tooltip": "The prefix for the file to save. This may include formatting information such as %date:yyyy-MM-dd% or %Empty Latent Image.width% to include values from nodes."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -16915,6 +17334,12 @@
         "name": "codec",
         "tooltip": "The codec to use for the video."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "video",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -16937,6 +17362,12 @@
         "name": "crf",
         "tooltip": "Higher crf means lower quality with a smaller file size, lower crf means higher quality higher filesize."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SCAIL2ColoredMask": {
@@ -20679,7 +21110,7 @@
     }
   },
   "Video Slice": {
-    "display_name": "Video Slice",
+    "display_name": "Trim Video",
     "inputs": {
       "video": {
         "name": "video"
@@ -21940,8 +22371,8 @@
     }
   },
   "WanContextWindowsManual": {
-    "display_name": "WAN Context Windows (Manual)",
-    "description": "Manually set context windows for WAN-like models (dim=2).",
+    "display_name": "Wan Context Windows",
+    "description": "Set context windows for Wan-like models.",
     "inputs": {
       "model": {
         "name": "model",
@@ -21949,15 +22380,15 @@
       },
       "context_length": {
         "name": "context_length",
-        "tooltip": "The length of the context window."
+        "tooltip": "The length of the context window in real frames. Must be 4*n + 1."
       },
       "context_overlap": {
         "name": "context_overlap",
-        "tooltip": "The overlap of the context window."
+        "tooltip": "The overlap of the context window in real frames."
       },
       "context_schedule": {
         "name": "context_schedule",
-        "tooltip": "The stride of the context window."
+        "tooltip": "Step-dependent scheduling algorithm for context windows."
       },
       "context_stride": {
         "name": "context_stride",
@@ -21974,6 +22405,14 @@
       "freenoise": {
         "name": "freenoise",
         "tooltip": "Whether to apply FreeNoise noise shuffling, improves window blending."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "Retain the first I2V frame in every context window (may help retain initial reference)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "Whether to split multiple conditionings (created by ConditionCombine) to each window based on region index."
       }
     },
     "outputs": {
diff --git a/src/locales/es/main.json b/src/locales/es/main.json
index 7f9ffc01ae..963912b9ae 100644
--- a/src/locales/es/main.json
+++ b/src/locales/es/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "MODELO_LORA",
     "LOSS_MAP": "MAPA_PÉRDIDAS",
     "LUMA_CONCEPTS": "CONCEPTOS LUMA",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "REFERENCIA LUMA",
     "MASK": "MASK",
     "MESH": "MALLA",
@@ -3979,6 +3980,7 @@
     "fileTooLarge": "Archivo demasiado grande ({size} MB). El tamaño máximo soportado es {maxSize} MB",
     "fileUploadFailed": "Error al subir el archivo",
     "interrupted": "La ejecución ha sido interrumpida",
+    "invalidTemplateData": "No se pudo cargar la plantilla de nodo: datos no válidos",
     "legacyMaskEditorDeprecated": "El editor de máscaras heredado está obsoleto y se eliminará pronto.",
     "migrateToLitegraphReroute": "Los nodos de reroute se eliminarán en futuras versiones. Haz clic para migrar a reroute nativo de litegraph.",
     "missingModelVerificationFailed": "No se pudo verificar los modelos faltantes. Algunos modelos pueden no aparecer en la pestaña de Errores.",
diff --git a/src/locales/es/nodeDefs.json b/src/locales/es/nodeDefs.json
index 9b7b837745..52ca4a0e5b 100644
--- a/src/locales/es/nodeDefs.json
+++ b/src/locales/es/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "método_de_fusión",
         "tooltip": "El método a utilizar para fusionar las ventanas de contexto."
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "Lista de índices latentes que se conservarán en el propio espacio latente de ruido para cada ventana. Útil para flujos de trabajo donde el contenido de referencia (por ejemplo, una imagen inicial) reside directamente en el espacio latente de ruido en lugar de en canales de acondicionamiento separados (por ejemplo, I2V estilo inplace como LTXV, AnimateDiff). Independiente de cond_retain_index_list."
+      },
       "model": {
         "name": "modelo",
         "tooltip": "El modelo al que aplicar ventanas de contexto durante el muestreo."
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "Configura ventanas de contexto para modelos tipo LTXV.",
+    "display_name": "Ventanas de Contexto LTXV",
+    "inputs": {
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "Si se debe cerrar el bucle de la ventana de contexto; solo aplicable a programaciones en bucle."
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "La longitud de la ventana de contexto en fotogramas reales. Debe ser 8*n + 1."
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "La superposición de la ventana de contexto en fotogramas reales."
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "Algoritmo de programación dependiente del paso para ventanas de contexto."
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "El intervalo de la ventana de contexto; solo aplicable a programaciones uniformes."
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "Si se debe aplicar el barajado de ruido FreeNoise, mejora la mezcla entre ventanas."
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "El método a utilizar para fusionar las ventanas de contexto."
+      },
+      "model": {
+        "name": "model",
+        "tooltip": "El modelo al que se aplicarán las ventanas de contexto durante el muestreo."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "Conservar el primer fotograma latente en cada ventana de contexto (puede ayudar a mantener la referencia inicial)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "Si se deben dividir múltiples acondicionamientos (creados por ConditionCombine) en cada ventana según el índice de región."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "El modelo con ventanas de contexto aplicadas durante el muestreo."
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXVCropGuides",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "Cargar 3D (Avanzado)",
+    "inputs": {
+      "height": {
+        "name": "height"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "CargarAudio",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "Extiende una generación previa de Ray 3.2 hacia adelante (continúa después) o hacia atrás (introducción antes). Conecta la salida generation_id de un nodo Luma Ray 3.2 anterior. Las extensiones siempre duran 5 segundos.",
+    "display_name": "Luma Ray 3.2 Extender Video",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "Adelante continúa después del clip anterior; atrás se antepone antes de este."
+      },
+      "direction_loop": {
+        "name": "loop"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Prompt de texto para el nuevo contenido."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Semilla para determinar si el nodo debe ejecutarse de nuevo; los resultados son no deterministas independientemente de la semilla."
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "generation_id del video Ray 3.2 anterior a extender. Conecta la salida generation_id de otro nodo Luma Ray 3.2."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "Genera un video a partir de un fotograma inicial y/o final usando el modelo Ray 3.2 de Luma. Las generaciones ancladas a imagen siempre duran 5 segundos.",
+    "display_name": "Luma Ray 3.2 Imagen a Video",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "Último fotograma del video generado."
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "Haz que el video sea un bucle perfecto. No disponible cuando se establece un end_frame."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Prompt de texto para la generación del video."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Semilla para determinar si el nodo debe ejecutarse de nuevo; los resultados son no deterministas independientemente de la semilla."
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "Primer fotograma del video generado."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "Ancla una imagen guía a una posición en la línea de tiempo del video de salida de Ray 3.2. Conéctalo a la entrada 'keyframes' del nodo Luma Ray 3.2 Keyframes to Video; encadena varios juntos mediante la entrada opcional 'keyframes' a continuación.",
+    "display_name": "Luma Ray 3.2 Fotograma Clave",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "Imagen guía para colocar en el momento elegido del video de salida."
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Fotogramas clave anteriores opcionales para encadenar con este."
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "Cómo colocar esta imagen en la línea de tiempo del video de salida."
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "Genera un video que interpola a través de una secuencia de imágenes guía, cada una anclada a una posición en la línea de tiempo, usando Luma Ray 3.2. Construye la secuencia con nodos de fotograma clave de Luma Ray 3.2 (al menos 2).",
+    "display_name": "Luma Ray 3.2 Fotogramas clave a video",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "duration": {
+        "name": "duration"
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Secuencia de fotogramas clave de los nodos de fotograma clave de Luma Ray 3.2 (al menos 2)."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Texto de entrada para la generación del video."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Semilla para determinar si el nodo debe ejecutarse de nuevo; los resultados son no deterministas independientemente de la semilla."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "Genera un video a partir de un texto usando el modelo Ray 3.2 de Luma.",
+    "display_name": "Luma Ray 3.2 Texto a video",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "duration": {
+        "name": "duration"
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "Hacer que el video se repita sin cortes. Solo disponible con duración de 5s."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Texto de entrada para la generación del video."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Semilla para determinar si el nodo debe ejecutarse de nuevo; los resultados son no deterministas independientemente de la semilla."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "Vuelve a renderizar un video existente con un nuevo prompt usando Luma Ray 3.2 (restiliza, reilumina, agrega o elimina elementos) manteniendo el movimiento original. Video fuente de hasta 18 segundos; el video editado mantiene la duración del original.",
+    "display_name": "Luma Ray 3.2 Edición de video",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Describe la edición deseada."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Semilla para determinar si el nodo debe ejecutarse de nuevo; los resultados son no deterministas independientemente de la semilla."
+      },
+      "strength": {
+        "name": "strength",
+        "tooltip": "Qué tanto se debe preservar o reinventar el video fuente. 'auto' deja que Ray 3.2 decida; adhere_* preserva más, flex_* es equilibrado, reimagine_* cambia más."
+      },
+      "video": {
+        "name": "video",
+        "tooltip": "Video fuente a editar. Hasta 18 segundos."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "Cambia la relación de aspecto de un video existente, usando Luma Ray 3.2 para rellenar las áreas recién expuestas del lienzo. Video de origen de hasta 30 segundos. Facturación por segundo de salida.",
+    "display_name": "Luma Ray 3.2 Reencuadre de Video",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Describe cómo se deben rellenar las áreas recién expuestas del lienzo."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Semilla para determinar si el nodo debe ejecutarse de nuevo; los resultados son no deterministas independientemente de la semilla."
+      },
+      "video": {
+        "name": "video",
+        "tooltip": "Video de origen para reencuadrar. Hasta 30 segundos."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "Contiene una imagen y un peso para usar con el nodo Luma Generate Image.",
     "display_name": "Referencia Luma",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "interfaz_audio"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "imagenes"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "imágenes"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "calidad"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "prefijo_nombre_archivo"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "formato",
         "tooltip": "El formato de archivo en el que guardar el audio."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "calidad"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "calidad"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "imágenes",
         "tooltip": "Las imágenes a guardar."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "imágenes",
         "tooltip": "Las imágenes que se van a guardar."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "muestras"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "samples"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "svg"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "video",
         "tooltip": "El video que se va a guardar."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "video",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "imágenes",
         "tooltip": "Las imágenes RGBA se guardan con su canal alfa como transparencia (solo códec vp9)."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "modelo",
         "tooltip": "El modelo al que aplicar las ventanas de contexto durante el muestreo."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "Conservar el primer fotograma I2V en cada ventana de contexto (puede ayudar a mantener la referencia inicial)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "Si se deben dividir múltiples condicionamientos (creados por ConditionCombine) en cada ventana según el índice de región."
       }
     },
     "outputs": {
diff --git a/src/locales/fa/main.json b/src/locales/fa/main.json
index b8ef8c1933..4ae08cd36d 100644
--- a/src/locales/fa/main.json
+++ b/src/locales/fa/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "مدل lora",
     "LOSS_MAP": "نقشه خطا",
     "LUMA_CONCEPTS": "مفاهیم Luma",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "مرجع Luma",
     "MASK": "ماسک",
     "MESH": "مش",
@@ -3991,6 +3992,7 @@
     "fileTooLarge": "فایل بیش از حد بزرگ است ({size} مگابایت). حداکثر اندازه مجاز {maxSize} مگابایت است",
     "fileUploadFailed": "بارگذاری فایل انجام نشد",
     "interrupted": "اجرا متوقف شد",
+    "invalidTemplateData": "بارگذاری قالب نود ناموفق بود: داده نامعتبر",
     "legacyMaskEditorDeprecated": "ویرایشگر mask قدیمی منسوخ شده و به‌زودی حذف خواهد شد.",
     "migrateToLitegraphReroute": "nodeهای reroute در نسخه‌های آینده حذف خواهند شد. برای مهاجرت به reroute بومی litegraph کلیک کنید.",
     "missingModelVerificationFailed": "تأیید مدل‌های مفقود شده انجام نشد. برخی مدل‌ها ممکن است در برگه خطاها نمایش داده نشوند.",
diff --git a/src/locales/fa/nodeDefs.json b/src/locales/fa/nodeDefs.json
index 9c9f3b398c..5b43d4e1de 100644
--- a/src/locales/fa/nodeDefs.json
+++ b/src/locales/fa/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "روش ادغام",
         "tooltip": "روشی که برای ادغام پنجره‌های زمینه استفاده می‌شود."
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "فهرست اندیس‌های latent که باید در خود latent نویز برای هر پنجره حفظ شوند. برای workflowهایی که محتوای مرجع (مثلاً یک تصویر شروع) مستقیماً در latent نویز قرار دارد و نه در کانال‌های شرطی‌سازی جداگانه (مانند I2V به سبک inplace مثل LTXV، AnimateDiff) استفاده می‌شود. مستقل از cond_retain_index_list."
+      },
       "model": {
         "name": "مدل",
         "tooltip": "مدلی که پنجره‌های زمینه هنگام نمونه‌گیری بر آن اعمال می‌شود."
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "تنظیم پنجره‌های زمینه برای مدل‌های مشابه LTXV.",
+    "display_name": "پنجره‌های زمینه LTXV",
+    "inputs": {
+      "closed_loop": {
+        "name": "حلقه بسته",
+        "tooltip": "آیا حلقه پنجره زمینه بسته شود؛ فقط برای زمان‌بندی‌های حلقه‌ای قابل استفاده است."
+      },
+      "context_length": {
+        "name": "طول زمینه",
+        "tooltip": "طول پنجره زمینه بر حسب فریم واقعی. باید به صورت ۸*n + ۱ باشد."
+      },
+      "context_overlap": {
+        "name": "همپوشانی زمینه",
+        "tooltip": "میزان همپوشانی پنجره زمینه بر حسب فریم واقعی."
+      },
+      "context_schedule": {
+        "name": "زمان‌بندی زمینه",
+        "tooltip": "الگوریتم زمان‌بندی وابسته به گام برای پنجره‌های زمینه."
+      },
+      "context_stride": {
+        "name": "گام زمینه",
+        "tooltip": "گام پنجره زمینه؛ فقط برای زمان‌بندی‌های یکنواخت قابل استفاده است."
+      },
+      "freenoise": {
+        "name": "FreeNoise",
+        "tooltip": "آیا از شافل نویز FreeNoise استفاده شود؛ باعث بهبود ترکیب پنجره‌ها می‌شود."
+      },
+      "fuse_method": {
+        "name": "روش ادغام",
+        "tooltip": "روشی که برای ادغام پنجره‌های زمینه استفاده می‌شود."
+      },
+      "model": {
+        "name": "مدل",
+        "tooltip": "مدلی که پنجره‌های زمینه باید هنگام نمونه‌گیری روی آن اعمال شوند."
+      },
+      "retain_first_frame": {
+        "name": "حفظ اولین فریم",
+        "tooltip": "اولین فریم latent را در هر پنجره زمینه حفظ کن (ممکن است به حفظ مرجع اولیه کمک کند)."
+      },
+      "split_conds_to_windows": {
+        "name": "تقسیم شرط‌ها به پنجره‌ها",
+        "tooltip": "آیا شرط‌های متعدد (ایجاد شده توسط ConditionCombine) بر اساس اندیس ناحیه به هر پنجره اختصاص داده شوند."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "مدل با پنجره‌های زمینه اعمال‌شده هنگام نمونه‌گیری."
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXVCropGuides",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "بارگذاری ۳بعدی (پیشرفته)",
+    "inputs": {
+      "height": {
+        "name": "ارتفاع"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "عرض"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "مدل ۳بعدی",
+        "tooltip": null
+      },
+      "1": {
+        "name": "اطلاعات مدل ۳بعدی",
+        "tooltip": null
+      },
+      "2": {
+        "name": "اطلاعات دوربین",
+        "tooltip": null
+      },
+      "3": {
+        "name": "عرض",
+        "tooltip": null
+      },
+      "4": {
+        "name": "ارتفاع",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "بارگذاری صوت",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "یک تولید قبلی Ray 3.2 را به جلو (ادامه پس از آن) یا به عقب (شروع قبل از آن) گسترش دهید. خروجی generation_id یک نود Luma Ray 3.2 قبلی را متصل کنید. هر گسترش همیشه ۵ ثانیه است.",
+    "display_name": "Luma Ray 3.2 گسترش ویدیو",
+    "inputs": {
+      "control_after_generate": {
+        "name": "کنترل پس از تولید"
+      },
+      "direction": {
+        "name": "جهت",
+        "tooltip": "جلو به معنای ادامه پس از کلیپ قبلی است؛ عقب به معنای اضافه شدن قبل از آن است."
+      },
+      "direction_loop": {
+        "name": "حلقه"
+      },
+      "prompt": {
+        "name": "پرامپت",
+        "tooltip": "پرامپت متنی برای محتوای جدید."
+      },
+      "resolution": {
+        "name": "رزولوشن"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed برای تعیین اینکه node باید دوباره اجرا شود یا خیر؛ نتایج صرف‌نظر از seed غیرقطعی هستند."
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "generation_id ویدیوی Ray 3.2 قبلی برای گسترش. خروجی generation_id یک نود دیگر Luma Ray 3.2 را متصل کنید."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "تولید ویدیو از یک فریم ابتدایی و/یا انتهایی با استفاده از مدل Ray 3.2 لومـا. تولیدات مبتنی بر تصویر همیشه ۵ ثانیه هستند.",
+    "display_name": "Luma Ray 3.2 تصویر به ویدیو",
+    "inputs": {
+      "control_after_generate": {
+        "name": "کنترل پس از تولید"
+      },
+      "end_frame": {
+        "name": "فریم انتهایی",
+        "tooltip": "آخرین فریم ویدیوی تولید شده."
+      },
+      "loop": {
+        "name": "حلقه",
+        "tooltip": "ویدیو را به صورت یکپارچه حلقه‌ای کنید. زمانی که end_frame تنظیم شده باشد، در دسترس نیست."
+      },
+      "prompt": {
+        "name": "پرامپت",
+        "tooltip": "پرامپت متنی برای تولید ویدیو."
+      },
+      "resolution": {
+        "name": "رزولوشن"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed برای تعیین اینکه node باید دوباره اجرا شود یا خیر؛ نتایج صرف‌نظر از seed غیرقطعی هستند."
+      },
+      "start_frame": {
+        "name": "فریم ابتدایی",
+        "tooltip": "اولین فریم ویدیوی تولید شده."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "یک تصویر راهنما را در موقعیتی از تایم‌لاین ویدیوی خروجی Ray 3.2 قرار دهید. این node را به ورودی 'keyframes' نود Luma Ray 3.2 Keyframes to Video متصل کنید؛ چندین node را می‌توانید از طریق ورودی اختیاری 'keyframes' زیر به هم زنجیر کنید.",
+    "display_name": "Luma Ray 3.2 کی‌فریم",
+    "inputs": {
+      "image": {
+        "name": "تصویر",
+        "tooltip": "تصویر راهنما برای قرار دادن در لحظه انتخاب‌شده از ویدیوی خروجی."
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "کی‌فریم‌های قبلی اختیاری برای زنجیر شدن با این مورد."
+      },
+      "position": {
+        "name": "موقعیت",
+        "tooltip": "نحوه قرارگیری این تصویر در تایم‌لاین ویدیوی خروجی."
+      },
+      "position_fraction": {
+        "name": "کسری موقعیت"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "تولید یک ویدیو که از طریق دنباله‌ای از تصاویر راهنما، هر یک در موقعیتی روی خط زمان قرار دارند، با استفاده از Luma Ray 3.2 در آن میان‌یابی می‌شود. این دنباله را با نودهای کلیدفریم Luma Ray 3.2 (حداقل ۲ عدد) بسازید.",
+    "display_name": "Luma Ray 3.2 تبدیل کلیدفریم‌ها به ویدیو",
+    "inputs": {
+      "control_after_generate": {
+        "name": "کنترل پس از تولید"
+      },
+      "duration": {
+        "name": "مدت زمان"
+      },
+      "keyframes": {
+        "name": "کلیدفریم‌ها",
+        "tooltip": "دنباله کلیدفریم از نودهای کلیدفریم Luma Ray 3.2 (حداقل ۲ عدد)."
+      },
+      "prompt": {
+        "name": "پرامپت",
+        "tooltip": "پرامپت متنی برای تولید ویدیو."
+      },
+      "resolution": {
+        "name": "رزولوشن"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed برای تعیین اینکه آیا node باید دوباره اجرا شود؛ نتایج صرف‌نظر از seed غیرقطعی هستند."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "شناسه تولید",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "تولید ویدیو از یک پرامپت متنی با استفاده از مدل Ray 3.2 شرکت Luma.",
+    "display_name": "Luma Ray 3.2 متن به ویدیو",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "نسبت تصویر"
+      },
+      "control_after_generate": {
+        "name": "کنترل پس از تولید"
+      },
+      "duration": {
+        "name": "مدت زمان"
+      },
+      "loop": {
+        "name": "حلقه",
+        "tooltip": "ویدیو را به صورت بی‌وقفه تکرارپذیر کنید. فقط برای مدت زمان ۵ ثانیه در دسترس است."
+      },
+      "prompt": {
+        "name": "پرامپت",
+        "tooltip": "پرامپت متنی برای تولید ویدیو."
+      },
+      "resolution": {
+        "name": "رزولوشن"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed برای تعیین اینکه آیا node باید دوباره اجرا شود؛ نتایج صرف‌نظر از seed غیرقطعی هستند."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "شناسه تولید",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "بازپرداخت یک ویدیوی موجود با پرامپت جدید با استفاده از Luma Ray 3.2 (تغییر سبک، نورپردازی، افزودن یا حذف عناصر) در حالی که حرکت اصلی حفظ می‌شود. ویدیوی منبع تا ۱۸ ثانیه؛ ویدیوی ویرایش‌شده طول منبع را حفظ می‌کند.",
+    "display_name": "Luma Ray 3.2 ویرایش ویدیو",
+    "inputs": {
+      "control_after_generate": {
+        "name": "کنترل پس از تولید"
+      },
+      "prompt": {
+        "name": "پرامپت",
+        "tooltip": "توضیح ویرایش مورد نظر."
+      },
+      "resolution": {
+        "name": "رزولوشن"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed برای تعیین اینکه آیا node باید دوباره اجرا شود؛ نتایج صرف‌نظر از seed غیرقطعی هستند."
+      },
+      "strength": {
+        "name": "شدت",
+        "tooltip": "میزان حفظ یا بازآفرینی ویدیوی منبع. مقدار 'auto' به Ray 3.2 اجازه انتخاب می‌دهد؛ adhere_* بیشترین حفظ، flex_* متعادل، reimagine_* بیشترین تغییر را اعمال می‌کند."
+      },
+      "video": {
+        "name": "ویدیو",
+        "tooltip": "ویدیوی منبع برای ویرایش. تا ۱۸ ثانیه."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "شناسه تولید",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "نسبت تصویر یک ویدیوی موجود را تغییر دهید و با استفاده از Luma Ray ۳.۲ نواحی جدید بوم را پر کنید. ویدیوی منبع تا ۳۰ ثانیه. هزینه بر اساس هر ثانیه خروجی محاسبه می‌شود.",
+    "display_name": "تغییر قاب ویدیو با Luma Ray ۳.۲",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "نسبت تصویر"
+      },
+      "control_after_generate": {
+        "name": "کنترل پس از تولید"
+      },
+      "prompt": {
+        "name": "پرامپت",
+        "tooltip": "توضیح می‌دهد که نواحی جدید بوم چگونه باید پر شوند."
+      },
+      "resolution": {
+        "name": "رزولوشن"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "seed برای تعیین اینکه node باید دوباره اجرا شود یا خیر؛ نتایج صرف‌نظر از seed غیرقطعی هستند."
+      },
+      "video": {
+        "name": "ویدیو",
+        "tooltip": "ویدیوی منبع برای تغییر قاب. تا ۳۰ ثانیه."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "یک تصویر و وزن را برای استفاده در node تولید تصویر لاما نگه می‌دارد.",
     "display_name": "مرجع لاما",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "رابط کاربری صوت"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "صدا",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "تصاویر"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "تصاویر"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "images"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "تصاویر",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "quality"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "تصاویر",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "filename_prefix"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "صدا",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "format",
         "tooltip": "فرمت فایلی که صدا در آن ذخیره می‌شود."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "صدا",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "quality"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "صدا",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "quality"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "صدا",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "تصاویر",
         "tooltip": "تصاویری که باید ذخیره شوند."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "تصاویر"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "تصاویر",
         "tooltip": "تصاویری که باید ذخیره شوند."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "تصاویر",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "نمونه‌ها"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "نمونه‌ها"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "SVG"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "SVG",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "ویدیو",
         "tooltip": "ویدیویی که باید ذخیره شود."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "ویدیو",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "تصاویر",
         "tooltip": "تصاویر RGBA با کانال آلفا به صورت شفاف ذخیره می‌شوند (فقط کدک vp9)."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "تصاویر",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "مدل",
         "tooltip": "مدلی که پنجره‌های زمینه روی آن در هنگام نمونه‌گیری اعمال می‌شود."
+      },
+      "retain_first_frame": {
+        "name": "حفظ اولین فریم",
+        "tooltip": "اولین فریم I2V را در هر پنجره زمینه حفظ کن (ممکن است به حفظ مرجع اولیه کمک کند)."
+      },
+      "split_conds_to_windows": {
+        "name": "تقسیم شرایط به پنجره‌ها",
+        "tooltip": "آیا شرایط متعدد (ایجاد شده توسط ConditionCombine) بر اساس شاخص ناحیه به هر پنجره تقسیم شوند."
       }
     },
     "outputs": {
diff --git a/src/locales/fr/main.json b/src/locales/fr/main.json
index 3d6fd0bff9..06fd730629 100644
--- a/src/locales/fr/main.json
+++ b/src/locales/fr/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "MODÈLE_LORA",
     "LOSS_MAP": "CARTE_PERTES",
     "LUMA_CONCEPTS": "Concepts Luma",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "Référence Luma",
     "MASK": "MASQUE",
     "MESH": "MAILLAGE",
@@ -3979,6 +3980,7 @@
     "fileTooLarge": "Fichier trop volumineux ({size} Mo). La taille maximale prise en charge est de {maxSize} Mo",
     "fileUploadFailed": "Échec du téléchargement du fichier",
     "interrupted": "L'exécution a été interrompue",
+    "invalidTemplateData": "Échec du chargement du modèle de nœud : données invalides",
     "legacyMaskEditorDeprecated": "L’éditeur de masque hérité est obsolète et sera bientôt supprimé.",
     "migrateToLitegraphReroute": "Les nœuds de reroute seront supprimés dans les futures versions. Cliquez pour migrer vers le reroute natif de litegraph.",
     "missingModelVerificationFailed": "Échec de la vérification des modèles manquants. Certains modèles peuvent ne pas apparaître dans l’onglet Erreurs.",
diff --git a/src/locales/fr/nodeDefs.json b/src/locales/fr/nodeDefs.json
index 9a09d3ab04..a46a255335 100644
--- a/src/locales/fr/nodeDefs.json
+++ b/src/locales/fr/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "méthode_fusion",
         "tooltip": "La méthode à utiliser pour fusionner les fenêtres de contexte."
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "Liste des indices latents à conserver dans le latent de bruit lui-même pour chaque fenêtre. À utiliser pour les workflows où le contenu de référence (par exemple, une image de départ) se trouve directement dans le latent de bruit plutôt que dans des canaux de conditionnement séparés (par exemple, I2V de type inplace comme LTXV, AnimateDiff). Indépendant de cond_retain_index_list."
+      },
       "model": {
         "name": "modèle",
         "tooltip": "Le modèle auquel appliquer les fenêtres de contexte pendant l'échantillonnage."
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "Définir les fenêtres de contexte pour les modèles de type LTXV.",
+    "display_name": "Fenêtres de contexte LTXV",
+    "inputs": {
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "Détermine si la boucle de la fenêtre de contexte doit être fermée ; applicable uniquement aux planifications en boucle."
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "La longueur de la fenêtre de contexte en images réelles. Doit être 8*n + 1."
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "Le recouvrement de la fenêtre de contexte en images réelles."
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "Algorithme de planification dépendant de l'étape pour les fenêtres de contexte."
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "Le pas de la fenêtre de contexte ; applicable uniquement aux planifications uniformes."
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "Appliquer ou non le mélange de bruit FreeNoise, améliore la fusion des fenêtres."
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "La méthode à utiliser pour fusionner les fenêtres de contexte."
+      },
+      "model": {
+        "name": "model",
+        "tooltip": "Le modèle auquel appliquer les fenêtres de contexte pendant l'échantillonnage."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "Conserver la première frame latente dans chaque fenêtre de contexte (peut aider à garder la référence initiale)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "Séparer ou non les multiples conditionnements (créés par ConditionCombine) dans chaque fenêtre selon l'indice de région."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "Le modèle avec fenêtres de contexte appliquées pendant l'échantillonnage."
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXVCropGuides",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "Charger 3D (Avancé)",
+    "inputs": {
+      "height": {
+        "name": "height"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "ChargerAudio",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "Prolongez une génération Ray 3.2 précédente vers l’avant (continuer après) ou vers l’arrière (ajouter avant). Connectez la sortie generation_id d’un nœud Luma Ray 3.2 précédent. Les extensions durent toujours 5 secondes.",
+    "display_name": "Luma Ray 3.2 Extension Vidéo",
+    "inputs": {
+      "control_after_generate": {
+        "name": "contrôle après génération"
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "Avant continue après le clip précédent ; arrière est ajouté avant celui-ci."
+      },
+      "direction_loop": {
+        "name": "boucle"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Invite textuelle pour le nouveau contenu."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Graine pour déterminer si le nœud doit être relancé ; les résultats sont non déterministes quel que soit la graine."
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "generation_id de la vidéo Ray 3.2 précédente à prolonger. Connectez la sortie generation_id d’un autre nœud Luma Ray 3.2."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "Générez une vidéo à partir d’une image de début et/ou de fin en utilisant le modèle Ray 3.2 de Luma. Les générations ancrées sur une image durent toujours 5 secondes.",
+    "display_name": "Luma Ray 3.2 Image vers Vidéo",
+    "inputs": {
+      "control_after_generate": {
+        "name": "contrôle après génération"
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "Dernière image de la vidéo générée."
+      },
+      "loop": {
+        "name": "boucle",
+        "tooltip": "Rendez la vidéo en boucle parfaite. Non disponible si une end_frame est définie."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Invite textuelle pour la génération vidéo."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Graine pour déterminer si le nœud doit être relancé ; les résultats sont non déterministes quel que soit la graine."
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "Première image de la vidéo générée."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "Ancrez une image guide à une position sur la timeline de la vidéo générée par Ray 3.2. Connectez ce nœud à l’entrée 'keyframes' du nœud Luma Ray 3.2 Images Clés vers Vidéo ; enchaînez-en plusieurs via l’entrée optionnelle 'keyframes' ci-dessous.",
+    "display_name": "Luma Ray 3.2 Image Clé",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "Image guide à placer au moment choisi sur la vidéo générée."
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Images clés précédentes optionnelles à enchaîner avec celle-ci."
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "Comment placer cette image sur la timeline de la vidéo générée."
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "Générez une vidéo qui interpole une séquence d’images guides, chacune étant ancrée à une position sur la timeline, en utilisant Luma Ray 3.2. Construisez la séquence avec des nœuds d’images clés Luma Ray 3.2 (au moins 2).",
+    "display_name": "Luma Ray 3.2 : Images clés en vidéo",
+    "inputs": {
+      "control_after_generate": {
+        "name": "contrôle après génération"
+      },
+      "duration": {
+        "name": "durée"
+      },
+      "keyframes": {
+        "name": "images clés",
+        "tooltip": "Séquence d’images clés provenant des nœuds d’images clés Luma Ray 3.2 (au moins 2)."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Invite textuelle pour la génération de la vidéo."
+      },
+      "resolution": {
+        "name": "résolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Graine pour déterminer si le nœud doit être relancé ; les résultats restent non déterministes quel que soit le seed."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "identifiant_génération",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "Générez une vidéo à partir d’une invite textuelle en utilisant le modèle Ray 3.2 de Luma.",
+    "display_name": "Luma Ray 3.2 : Texte en vidéo",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "ratio d’aspect"
+      },
+      "control_after_generate": {
+        "name": "contrôle après génération"
+      },
+      "duration": {
+        "name": "durée"
+      },
+      "loop": {
+        "name": "boucle",
+        "tooltip": "Rend la vidéo en boucle parfaite. Disponible uniquement pour une durée de 5s."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Invite textuelle pour la génération de la vidéo."
+      },
+      "resolution": {
+        "name": "résolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Graine pour déterminer si le nœud doit être relancé ; les résultats restent non déterministes quel que soit le seed."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "identifiant_génération",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "Re-générez une vidéo existante avec une nouvelle invite en utilisant Luma Ray 3.2 (restyliser, rééclairer, ajouter ou supprimer des éléments) tout en conservant le mouvement original. Vidéo source jusqu’à 18 secondes ; la vidéo éditée conserve la durée de la source.",
+    "display_name": "Luma Ray 3.2 : Édition vidéo",
+    "inputs": {
+      "control_after_generate": {
+        "name": "contrôle après génération"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Décrit la modification souhaitée."
+      },
+      "resolution": {
+        "name": "résolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Graine pour déterminer si le nœud doit être relancé ; les résultats restent non déterministes quel que soit le seed."
+      },
+      "strength": {
+        "name": "intensité",
+        "tooltip": "Degré de préservation ou de réinvention de la source. 'auto' laisse Ray 3.2 choisir ; adhere_* préserve au maximum, flex_* est équilibré, reimagine_* modifie le plus."
+      },
+      "video": {
+        "name": "vidéo",
+        "tooltip": "Vidéo source à éditer. Jusqu’à 18 secondes."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "identifiant_génération",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "Modifiez le format d'image d'une vidéo existante, en utilisant Luma Ray 3.2 pour remplir les nouvelles zones exposées de la toile. Vidéo source jusqu'à 30 secondes. Facturation à la seconde de sortie.",
+    "display_name": "Luma Ray 3.2 Recadrage Vidéo",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "rapport d'aspect"
+      },
+      "control_after_generate": {
+        "name": "contrôle après génération"
+      },
+      "prompt": {
+        "name": "invite",
+        "tooltip": "Décrit comment les nouvelles zones exposées de la toile doivent être remplies."
+      },
+      "resolution": {
+        "name": "résolution"
+      },
+      "seed": {
+        "name": "graine",
+        "tooltip": "Graine pour déterminer si le nœud doit être relancé ; les résultats sont non déterministes quel que soit la graine."
+      },
+      "video": {
+        "name": "vidéo",
+        "tooltip": "Vidéo source à recadrer. Jusqu'à 30 secondes."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "identifiant_génération",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "Contient une image et un poids à utiliser avec le nœud Luma Générer Image.",
     "display_name": "Référence Luma",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "audioUI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "images"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "images"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "qualité"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "préfixe_du_nom_de_fichier"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "format",
         "tooltip": "Le format de fichier dans lequel enregistrer l’audio."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "qualité"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "qualité"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "images",
         "tooltip": "Les images à enregistrer."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "images",
         "tooltip": "Les images à enregistrer."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "échantillons"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "échantillons"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "svg"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "vidéo",
         "tooltip": "La vidéo à enregistrer."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "vidéo",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "images",
         "tooltip": "Les images RGBA sont enregistrées avec leur canal alpha comme transparence (codec vp9 uniquement)."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "modèle",
         "tooltip": "Le modèle auquel appliquer les fenêtres de contexte pendant l'échantillonnage."
+      },
+      "retain_first_frame": {
+        "name": "conserver_première_image",
+        "tooltip": "Conserver la première image I2V dans chaque fenêtre de contexte (peut aider à garder la référence initiale)."
+      },
+      "split_conds_to_windows": {
+        "name": "diviser_conditions_fenêtres",
+        "tooltip": "Indique s'il faut répartir plusieurs conditionnements (créés par ConditionCombine) dans chaque fenêtre selon l'index de région."
       }
     },
     "outputs": {
diff --git a/src/locales/ja/main.json b/src/locales/ja/main.json
index 5fe731059e..56a4889512 100644
--- a/src/locales/ja/main.json
+++ b/src/locales/ja/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "LoRAモデル",
     "LOSS_MAP": "損失マップ",
     "LUMA_CONCEPTS": "Lumaコンセプト",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "Luma参照",
     "MASK": "マスク",
     "MESH": "メッシュ",
@@ -3979,6 +3980,7 @@
     "fileTooLarge": "ファイルが大きすぎます（{size} MB）。サポートされている最大サイズは{maxSize} MBです",
     "fileUploadFailed": "ファイルのアップロードに失敗しました",
     "interrupted": "実行が中断されました",
+    "invalidTemplateData": "ノードテンプレートの読み込みに失敗しました：無効なデータです",
     "legacyMaskEditorDeprecated": "従来のマスクエディタは非推奨となり、まもなく削除されます。",
     "migrateToLitegraphReroute": "将来のバージョンではRerouteノードが削除されます。litegraph-native rerouteに移行するにはクリックしてください。",
     "missingModelVerificationFailed": "不足しているモデルの検証に失敗しました。一部のモデルはエラータブに表示されない場合があります。",
diff --git a/src/locales/ja/nodeDefs.json b/src/locales/ja/nodeDefs.json
index 8dcf0767e2..8236040782 100644
--- a/src/locales/ja/nodeDefs.json
+++ b/src/locales/ja/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "fuse_method",
         "tooltip": "コンテキストウィンドウを融合するために使用する方法。"
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "各ウィンドウごとにノイズlatent自体で保持するlatentインデックスのリスト。参照コンテンツ（例：開始画像）が個別のコンディショニングチャンネルではなくノイズlatent内に直接存在するワークフロー（例：inplaceスタイルのI2V、LTXVやAnimateDiffなど）で使用します。cond_retain_index_listとは独立しています。"
+      },
       "model": {
         "name": "モデル",
         "tooltip": "サンプリング中にコンテキストウィンドウを適用するモデル。"
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "LTXV系モデルのためのコンテキストウィンドウを設定します。",
+    "display_name": "LTXVコンテキストウィンドウ",
+    "inputs": {
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "コンテキストウィンドウループを閉じるかどうか。ループスケジュール時のみ有効です。"
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "コンテキストウィンドウの長さ（実フレーム数）。8*n+1である必要があります。"
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "コンテキストウィンドウの重なり（実フレーム数）。"
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "コンテキストウィンドウのステップ依存スケジューリングアルゴリズム。"
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "コンテキストウィンドウのストライド（間隔）。均一スケジュール時のみ有効です。"
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "FreeNoiseノイズシャッフルを適用するかどうか。ウィンドウのブレンドを改善します。"
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "コンテキストウィンドウを融合する方法。"
+      },
+      "model": {
+        "name": "model",
+        "tooltip": "サンプリング時にコンテキストウィンドウを適用するモデル。"
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "各コンテキストウィンドウで最初のlatentフレームを保持します（初期参照の維持に役立つ場合があります）。"
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "複数のコンディショニング（ConditionCombineで作成）を領域インデックスに基づいて各ウィンドウに分割するかどうか。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "サンプリング時にコンテキストウィンドウが適用されたモデル。"
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXVCropGuides",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "3D読み込み（詳細）",
+    "inputs": {
+      "height": {
+        "name": "height"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "音声を読み込む",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "以前に生成したRay 3.2のビデオを前方（後に続けて）または後方（前に追加して）拡張します。前のLuma Ray 3.2ノードのgeneration_id出力を接続してください。拡張は常に5秒です。",
+    "display_name": "Luma Ray 3.2 ビデオ拡張",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成後のコントロール"
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "前方は前のclipの後に続き、後方はその前に追加されます。"
+      },
+      "direction_loop": {
+        "name": "ループ"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "新しいコンテンツのテキストプロンプト。"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "ノードを再実行するかどうかを決定するシード。シードに関わらず結果は非決定的です。"
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "拡張したい前のRay 3.2ビデオのgeneration_idです。他のLuma Ray 3.2ノードのgeneration_id出力を接続してください。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "LumaのRay 3.2モデルを使って、開始フレームや終了フレームからビデオを生成します。画像を基準とした生成は常に5秒です。",
+    "display_name": "Luma Ray 3.2 画像からビデオへ",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成後のコントロール"
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "生成されるビデオの最後のフレーム。"
+      },
+      "loop": {
+        "name": "ループ",
+        "tooltip": "ビデオをシームレスにループさせます。end_frameが設定されている場合は利用できません。"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "ビデオ生成のためのテキストプロンプト。"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "ノードを再実行するかどうかを決定するシード。シードに関わらず結果は非決定的です。"
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "生成されるビデオの最初のフレーム。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "ガイド画像をRay 3.2出力ビデオのタイムライン上の位置に固定します。これをLuma Ray 3.2 Keyframes to Videoノードの「keyframes」入力に接続してください。下のオプションの「keyframes」入力で複数を連結できます。",
+    "display_name": "Luma Ray 3.2 キーフレーム",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "出力ビデオの指定したタイミングに配置するガイド画像。"
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "このキーフレームと連結するための前のキーフレーム（オプション）。"
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "この画像を出力ビデオのタイムライン上にどのように配置するか。"
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "Luma Ray 3.2 を使用して、タイムライン上の位置に固定されたガイド画像のシーケンスを補間しながらビデオを生成します。Luma Ray 3.2 キーフレームノード（最低2つ）でシーケンスを構築してください。",
+    "display_name": "Luma Ray 3.2 キーフレームからビデオへ",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成後のコントロール"
+      },
+      "duration": {
+        "name": "長さ"
+      },
+      "keyframes": {
+        "name": "キーフレーム",
+        "tooltip": "Luma Ray 3.2 キーフレームノード（最低2つ）からのキーフレームシーケンス。"
+      },
+      "prompt": {
+        "name": "プロンプト",
+        "tooltip": "ビデオ生成用のテキストプロンプト。"
+      },
+      "resolution": {
+        "name": "解像度"
+      },
+      "seed": {
+        "name": "シード",
+        "tooltip": "ノードを再実行するかどうかを決定するシード。シードに関わらず結果は非決定的です。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "Luma の Ray 3.2 モデルを使ってテキストプロンプトからビデオを生成します。",
+    "display_name": "Luma Ray 3.2 テキストからビデオへ",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "アスペクト比"
+      },
+      "control_after_generate": {
+        "name": "生成後のコントロール"
+      },
+      "duration": {
+        "name": "長さ"
+      },
+      "loop": {
+        "name": "ループ",
+        "tooltip": "ビデオをシームレスにループさせます。5秒の長さでのみ利用可能です。"
+      },
+      "prompt": {
+        "name": "プロンプト",
+        "tooltip": "ビデオ生成用のテキストプロンプト。"
+      },
+      "resolution": {
+        "name": "解像度"
+      },
+      "seed": {
+        "name": "シード",
+        "tooltip": "ノードを再実行するかどうかを決定するシード。シードに関わらず結果は非決定的です。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "Luma Ray 3.2 を使い、元の動きを維持しながら新しいプロンプトで既存のビデオを再レンダリングします（リスタイル、再照明、要素の追加や削除など）。元動画は最大18秒まで。編集後のビデオは元動画と同じ長さになります。",
+    "display_name": "Luma Ray 3.2 ビデオ編集",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成後のコントロール"
+      },
+      "prompt": {
+        "name": "プロンプト",
+        "tooltip": "希望する編集内容を記述してください。"
+      },
+      "resolution": {
+        "name": "解像度"
+      },
+      "seed": {
+        "name": "シード",
+        "tooltip": "ノードを再実行するかどうかを決定するシード。シードに関わらず結果は非決定的です。"
+      },
+      "strength": {
+        "name": "強度",
+        "tooltip": "元動画をどの程度維持するか。'auto'はRay 3.2が自動選択、adhere_*は最も維持、flex_*はバランス、reimagine_*は最も変更します。"
+      },
+      "video": {
+        "name": "ビデオ",
+        "tooltip": "編集する元動画。最大18秒まで。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "既存のビデオのアスペクト比を変更し、新たに露出したキャンバス領域をLuma Ray 3.2で埋めます。ソースビデオは最大30秒まで対応。出力秒数ごとに課金されます。",
+    "display_name": "Luma Ray 3.2 ビデオリフレーム",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "新たに露出したキャンバス領域をどのように埋めるかを説明します。"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "ノードを再実行するかどうかを決定するシード。シードに関わらず結果は非決定的です。"
+      },
+      "video": {
+        "name": "video",
+        "tooltip": "リフレームするソースビデオ。最大30秒まで。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "Luma Generate Imageノードで使用する画像と重みを保持します。",
     "display_name": "Luma Reference",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "audioUI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "画像"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "画像"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "品質"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "ファイル名_プレフィックス"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "format",
         "tooltip": "オーディオを保存するファイル形式。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "quality"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "quality"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "画像",
         "tooltip": "保存する画像。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "画像",
         "tooltip": "保存する画像。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "サンプル"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "samples"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "svg"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "ビデオ",
         "tooltip": "保存するビデオ。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "video",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "画像",
         "tooltip": "RGBA画像はアルファチャンネルを透明度として保存します（vp9コーデックのみ対応）。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "モデル",
         "tooltip": "サンプリング中にコンテキストウィンドウを適用するモデル。"
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "各コンテキストウィンドウで最初のI2Vフレームを保持します（初期リファレンスの維持に役立つ場合があります）。"
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "複数のコンディショニング（ConditionCombineで作成）を領域インデックスに基づいて各ウィンドウに分割するかどうか。"
       }
     },
     "outputs": {
diff --git a/src/locales/ko/main.json b/src/locales/ko/main.json
index 80ec92e0d9..f47cf6cedc 100644
--- a/src/locales/ko/main.json
+++ b/src/locales/ko/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "LORA_MODEL",
     "LOSS_MAP": "LOSS_MAP",
     "LUMA_CONCEPTS": "Luma 컨셉",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "Luma 참조",
     "MASK": "마스크",
     "MESH": "메시",
@@ -3979,6 +3980,7 @@
     "fileTooLarge": "파일이 너무 큽니다({size} MB). 최대 지원 크기는 {maxSize} MB입니다.",
     "fileUploadFailed": "파일 업로드에 실패했습니다",
     "interrupted": "실행이 중단되었습니다",
+    "invalidTemplateData": "노드 템플릿을 불러오지 못했습니다: 잘못된 데이터",
     "legacyMaskEditorDeprecated": "레거시 마스크 에디터는 더 이상 지원되지 않으며 곧 제거될 예정입니다.",
     "migrateToLitegraphReroute": "향후 버전에서는 Reroute 노드가 제거됩니다. LiteGraph 에서 자체 제공하는 경유점으로 변환하려면 클릭하세요.",
     "missingModelVerificationFailed": "누락된 모델 검증에 실패했습니다. 일부 모델이 오류 탭에 표시되지 않을 수 있습니다.",
diff --git a/src/locales/ko/nodeDefs.json b/src/locales/ko/nodeDefs.json
index 5922759d56..2ba98ab178 100644
--- a/src/locales/ko/nodeDefs.json
+++ b/src/locales/ko/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "fuse_method",
         "tooltip": "컨텍스트 윈도우를 융합하는 데 사용할 방법입니다."
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "각 윈도우마다 노이즈 latent 자체에서 유지할 latent 인덱스 목록입니다. 참조 콘텐츠(예: 시작 이미지)가 별도의 컨디셔닝 채널이 아닌 노이즈 latent에 직접 존재하는 워크플로우(예: inplace 스타일 I2V, LTXV, AnimateDiff 등)에 사용합니다. cond_retain_index_list와는 독립적입니다."
+      },
       "model": {
         "name": "model",
         "tooltip": "샘플링 중 컨텍스트 윈도우를 적용할 모델입니다."
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "LTXV 계열 모델을 위한 컨텍스트 윈도우를 설정합니다.",
+    "display_name": "LTXV 컨텍스트 윈도우",
+    "inputs": {
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "컨텍스트 윈도우 루프를 닫을지 여부입니다. 루프 스케줄에만 적용됩니다."
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "실제 프레임 단위의 컨텍스트 윈도우 길이입니다. 8*n + 1이어야 합니다."
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "실제 프레임 단위의 컨텍스트 윈도우 오버랩입니다."
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "컨텍스트 윈도우를 위한 스텝 기반 스케줄링 알고리즘입니다."
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "컨텍스트 윈도우의 스트라이드입니다. 균일 스케줄에만 적용됩니다."
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "FreeNoise 노이즈 셔플을 적용할지 여부입니다. 윈도우 블렌딩을 개선합니다."
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "컨텍스트 윈도우를 합치는 데 사용할 방법입니다."
+      },
+      "model": {
+        "name": "model",
+        "tooltip": "샘플링 중 컨텍스트 윈도우를 적용할 모델입니다."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "모든 컨텍스트 윈도우에서 첫 번째 latent 프레임을 유지합니다 (초기 참조 유지에 도움이 될 수 있음)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "ConditionCombine으로 생성된 여러 컨디셔닝을 영역 인덱스에 따라 각 윈도우로 분할할지 여부입니다."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "샘플링 중 컨텍스트 윈도우가 적용된 모델입니다."
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXV 가이드 자르기",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "3D 불러오기 (고급)",
+    "inputs": {
+      "height": {
+        "name": "height"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "오디오 로드",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "이전 Ray 3.2 생성 결과를 앞으로(이후 계속) 또는 뒤로(이전 앞부분 추가) 확장합니다. 이전 Luma Ray 3.2 노드의 generation_id 출력을 연결하세요. 확장 길이는 항상 5초입니다.",
+    "display_name": "Luma Ray 3.2 비디오 확장",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "Forward는 이전 clip 이후로 계속 진행하며, backward는 그 앞에 추가됩니다."
+      },
+      "direction_loop": {
+        "name": "loop"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "새로운 콘텐츠를 위한 텍스트 프롬프트입니다."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "노드를 다시 실행할지 결정하는 시드입니다. 시드와 관계없이 결과는 비결정적입니다."
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "확장할 이전 Ray 3.2 비디오의 generation_id입니다. 다른 Luma Ray 3.2 노드의 generation_id 출력을 연결하세요."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "Luma의 Ray 3.2 모델을 사용하여 시작 및/또는 종료 프레임에서 비디오를 생성합니다. 이미지 기반 생성은 항상 5초입니다.",
+    "display_name": "Luma Ray 3.2 이미지 → 비디오",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "생성된 비디오의 마지막 프레임입니다."
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "비디오가 자연스럽게 반복되도록 만듭니다. end_frame이 설정된 경우에는 사용할 수 없습니다."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "비디오 생성을 위한 텍스트 프롬프트입니다."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "노드를 다시 실행할지 결정하는 시드입니다. 시드와 관계없이 결과는 비결정적입니다."
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "생성된 비디오의 첫 프레임입니다."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "Ray 3.2 출력 비디오 타임라인의 위치에 가이드 이미지를 고정합니다. 이 노드를 Luma Ray 3.2 Keyframes to Video 노드의 'keyframes' 입력에 연결하세요. 아래의 선택적 'keyframes' 입력을 통해 여러 개를 연쇄할 수 있습니다.",
+    "display_name": "Luma Ray 3.2 키프레임",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "출력 비디오의 원하는 시점에 배치할 가이드 이미지입니다."
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "이전 키프레임을 이 키프레임과 연쇄할 때 선택적으로 사용합니다."
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "이 이미지를 출력 비디오 타임라인에 어떻게 배치할지 설정합니다."
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "Luma Ray 3.2를 사용하여 타임라인의 위치에 고정된 가이드 이미지 시퀀스를 보간하여 비디오를 생성합니다. Luma Ray 3.2 Keyframe 노드(최소 2개)로 시퀀스를 구성하세요.",
+    "display_name": "Luma Ray 3.2 키프레임에서 비디오로",
+    "inputs": {
+      "control_after_generate": {
+        "name": "생성 후 제어"
+      },
+      "duration": {
+        "name": "길이"
+      },
+      "keyframes": {
+        "name": "키프레임",
+        "tooltip": "Luma Ray 3.2 Keyframe 노드(최소 2개)에서 가져온 키프레임 시퀀스입니다."
+      },
+      "prompt": {
+        "name": "프롬프트",
+        "tooltip": "비디오 생성을 위한 텍스트 프롬프트입니다."
+      },
+      "resolution": {
+        "name": "해상도"
+      },
+      "seed": {
+        "name": "시드",
+        "tooltip": "노드를 다시 실행할지 결정하는 시드입니다. 시드와 관계없이 결과는 비결정적입니다."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "Luma의 Ray 3.2 모델을 사용하여 텍스트 프롬프트로부터 비디오를 생성합니다.",
+    "display_name": "Luma Ray 3.2 텍스트에서 비디오로",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "화면비"
+      },
+      "control_after_generate": {
+        "name": "생성 후 제어"
+      },
+      "duration": {
+        "name": "길이"
+      },
+      "loop": {
+        "name": "루프",
+        "tooltip": "비디오가 자연스럽게 반복되도록 만듭니다. 5초 길이에서만 사용 가능합니다."
+      },
+      "prompt": {
+        "name": "프롬프트",
+        "tooltip": "비디오 생성을 위한 텍스트 프롬프트입니다."
+      },
+      "resolution": {
+        "name": "해상도"
+      },
+      "seed": {
+        "name": "시드",
+        "tooltip": "노드를 다시 실행할지 결정하는 시드입니다. 시드와 관계없이 결과는 비결정적입니다."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "Luma Ray 3.2를 사용하여 기존 비디오를 새로운 프롬프트로 다시 렌더링합니다(스타일 변경, 조명 변경, 요소 추가/제거 등). 원본 모션은 유지됩니다. 소스 비디오는 최대 18초까지 지원하며, 편집된 비디오는 원본과 동일한 길이를 가집니다.",
+    "display_name": "Luma Ray 3.2 비디오 편집",
+    "inputs": {
+      "control_after_generate": {
+        "name": "생성 후 제어"
+      },
+      "prompt": {
+        "name": "프롬프트",
+        "tooltip": "원하는 편집 내용을 설명합니다."
+      },
+      "resolution": {
+        "name": "해상도"
+      },
+      "seed": {
+        "name": "시드",
+        "tooltip": "노드를 다시 실행할지 결정하는 시드입니다. 시드와 관계없이 결과는 비결정적입니다."
+      },
+      "strength": {
+        "name": "강도",
+        "tooltip": "원본을 얼마나 강하게 유지할지 또는 새롭게 재구성할지 설정합니다. 'auto'는 Ray 3.2가 자동으로 선택합니다. adhere_*는 가장 많이 보존, flex_*는 균형, reimagine_*는 가장 많이 변경합니다."
+      },
+      "video": {
+        "name": "비디오",
+        "tooltip": "편집할 소스 비디오입니다. 최대 18초."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "기존 비디오의 종횡비를 변경하고, Luma Ray 3.2를 사용하여 새로 노출된 캔버스 영역을 채웁니다. 소스 비디오는 최대 30초까지 지원됩니다. 출력 초당 과금됩니다.",
+    "display_name": "Luma Ray 3.2 비디오 리프레임",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "새로 노출된 캔버스 영역을 어떻게 채울지 설명합니다."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "노드가 다시 실행되어야 하는지 결정하는 시드입니다. 시드와 관계없이 결과는 비결정적입니다."
+      },
+      "video": {
+        "name": "video",
+        "tooltip": "리프레임할 소스 비디오입니다. 최대 30초."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "Luma 이미지 생성 노드에서 사용할 이미지와 가중치를 보관합니다.",
     "display_name": "Luma 이미지 참조",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "오디오UI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "이미지"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "이미지"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "품질"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "파일명 접두사"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "format",
         "tooltip": "오디오를 저장할 파일 형식입니다."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "품질"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "품질"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "이미지",
         "tooltip": "저장할 이미지입니다."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "images",
         "tooltip": "저장할 이미지입니다."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "잠재 데이터"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "samples"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "SVG"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "비디오",
         "tooltip": "저장할 비디오입니다."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "video",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "이미지",
         "tooltip": "RGBA 이미지는 알파 채널이 투명도로 저장됩니다(vp9 코덱만 지원)."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "모델",
         "tooltip": "샘플링 중 컨텍스트 창을 적용할 모델입니다."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "모든 컨텍스트 윈도우에서 첫 번째 I2V 프레임을 유지합니다(초기 참조를 유지하는 데 도움이 될 수 있습니다)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "여러 조건(ConditionCombine에서 생성됨)을 영역 인덱스에 따라 각 윈도우로 분할할지 여부입니다."
       }
     },
     "outputs": {
diff --git a/src/locales/pt-BR/main.json b/src/locales/pt-BR/main.json
index 0fdd5338a4..5841fec2f9 100644
--- a/src/locales/pt-BR/main.json
+++ b/src/locales/pt-BR/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "lora MODEL",
     "LOSS_MAP": "MAPA DE PERDA",
     "LUMA_CONCEPTS": "CONCEITOS LUMA",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "REFERÊNCIA LUMA",
     "MASK": "MÁSCARA",
     "MESH": "MALHA",
@@ -3991,6 +3992,7 @@
     "fileTooLarge": "Arquivo muito grande ({size} MB). O tamanho máximo suportado é {maxSize} MB",
     "fileUploadFailed": "Falha no upload do arquivo",
     "interrupted": "Execução interrompida",
+    "invalidTemplateData": "Falha ao carregar o modelo de nó: dados inválidos",
     "legacyMaskEditorDeprecated": "O editor de máscara legado está obsoleto e será removido em breve.",
     "migrateToLitegraphReroute": "Nós de redirecionamento serão removidos em versões futuras. Clique para migrar para o redirecionamento nativo do litegraph.",
     "missingModelVerificationFailed": "Falha ao verificar modelos ausentes. Alguns modelos podem não aparecer na aba de Erros.",
diff --git a/src/locales/pt-BR/nodeDefs.json b/src/locales/pt-BR/nodeDefs.json
index 2f2c601580..d23f612be9 100644
--- a/src/locales/pt-BR/nodeDefs.json
+++ b/src/locales/pt-BR/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "método_fusão",
         "tooltip": "O método a ser usado para fundir as janelas de contexto."
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "Lista de índices latentes a serem retidos no próprio latent de ruído para cada janela. Use para fluxos de trabalho onde o conteúdo de referência (por exemplo, uma imagem inicial) está diretamente no latent de ruído em vez de em canais de condicionamento separados (por exemplo, I2V estilo inplace como LTXV, AnimateDiff). Independente de cond_retain_index_list."
+      },
       "model": {
         "name": "modelo",
         "tooltip": "O modelo ao qual aplicar as janelas de contexto durante a amostragem."
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "Defina janelas de contexto para modelos do tipo LTXV.",
+    "display_name": "Janelas de Contexto LTXV",
+    "inputs": {
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "Se deve fechar o loop da janela de contexto; aplicável apenas para agendamentos em loop."
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "O comprimento da janela de contexto em quadros reais. Deve ser 8*n + 1."
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "A sobreposição da janela de contexto em quadros reais."
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "Algoritmo de agendamento dependente de etapa para janelas de contexto."
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "O passo da janela de contexto; aplicável apenas para agendamentos uniformes."
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "Se deve aplicar embaralhamento de ruído FreeNoise, melhora a mesclagem das janelas."
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "O método a ser usado para fundir as janelas de contexto."
+      },
+      "model": {
+        "name": "model",
+        "tooltip": "O modelo ao qual aplicar as janelas de contexto durante a amostragem."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "Reter o primeiro quadro latente em cada janela de contexto (pode ajudar a manter a referência inicial)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "Se deve dividir múltiplos condicionamentos (criados por ConditionCombine) para cada janela com base no índice da região."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "O modelo com janelas de contexto aplicadas durante a amostragem."
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXVCropGuides",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "Carregar 3D (Avançado)",
+    "inputs": {
+      "height": {
+        "name": "height"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "Carregar Áudio",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "Estenda uma geração anterior do Ray 3.2 para frente (continue após ela) ou para trás (introdução antes dela). Conecte a saída generation_id de um nó Luma Ray 3.2 anterior. As extensões são sempre de 5 segundos.",
+    "display_name": "Luma Ray 3.2 Estender Vídeo",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "Para frente continua após o clipe anterior; para trás é inserido antes dele."
+      },
+      "direction_loop": {
+        "name": "loop"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Prompt de texto para o novo conteúdo."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed para determinar se o nó deve ser executado novamente; os resultados são não determinísticos independentemente do seed."
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "generation_id do vídeo Ray 3.2 anterior a ser estendido. Conecte a saída generation_id de outro nó Luma Ray 3.2."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "Gere um vídeo a partir de um quadro inicial e/ou final usando o modelo Ray 3.2 da Luma. As gerações ancoradas em imagem têm sempre 5 segundos.",
+    "display_name": "Luma Ray 3.2 Imagem para Vídeo",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "Último quadro do vídeo gerado."
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "Faz o vídeo repetir em loop de forma contínua. Não disponível quando um end_frame está definido."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Prompt de texto para a geração do vídeo."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed para determinar se o nó deve ser executado novamente; os resultados são não determinísticos independentemente do seed."
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "Primeiro quadro do vídeo gerado."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "Ancore uma imagem guia a uma posição na linha do tempo do vídeo de saída do Ray 3.2. Conecte este nó à entrada 'keyframes' do nó Luma Ray 3.2 Keyframes to Video; encadeie vários juntos via a entrada opcional 'keyframes' abaixo.",
+    "display_name": "Luma Ray 3.2 Quadro-chave",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "Imagem guia para posicionar no momento escolhido do vídeo de saída."
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Quadros-chave anteriores opcionais para encadear com este."
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "Como posicionar esta imagem na linha do tempo do vídeo de saída."
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "Gere um vídeo que interpola por uma sequência de imagens-guia, cada uma ancorada a uma posição na linha do tempo, usando Luma Ray 3.2. Construa a sequência com nós de Keyframe do Luma Ray 3.2 (mínimo de 2).",
+    "display_name": "Luma Ray 3.2 Keyframes para Vídeo",
+    "inputs": {
+      "control_after_generate": {
+        "name": "controle após gerar"
+      },
+      "duration": {
+        "name": "duração"
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Sequência de keyframes dos nós de Keyframe do Luma Ray 3.2 (mínimo de 2)."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Prompt de texto para a geração do vídeo."
+      },
+      "resolution": {
+        "name": "resolução"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed para determinar se o nó deve ser executado novamente; os resultados são não determinísticos independentemente do seed."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "Gere um vídeo a partir de um prompt de texto usando o modelo Ray 3.2 da Luma.",
+    "display_name": "Luma Ray 3.2 Texto para Vídeo",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "proporção"
+      },
+      "control_after_generate": {
+        "name": "controle após gerar"
+      },
+      "duration": {
+        "name": "duração"
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "Fazer o vídeo em loop contínuo. Disponível apenas para duração de 5s."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Prompt de texto para a geração do vídeo."
+      },
+      "resolution": {
+        "name": "resolução"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed para determinar se o nó deve ser executado novamente; os resultados são não determinísticos independentemente do seed."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "Re-renderize um vídeo existente com um novo prompt usando Luma Ray 3.2 (restilize, relumine, adicione ou remova elementos) mantendo o movimento original. Vídeo de origem de até 18 segundos; o vídeo editado mantém o comprimento do original.",
+    "display_name": "Luma Ray 3.2 Edição de Vídeo",
+    "inputs": {
+      "control_after_generate": {
+        "name": "controle após gerar"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Descreve a edição desejada."
+      },
+      "resolution": {
+        "name": "resolução"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed para determinar se o nó deve ser executado novamente; os resultados são não determinísticos independentemente do seed."
+      },
+      "strength": {
+        "name": "força",
+        "tooltip": "Quão fortemente preservar ou reinventar o original. 'auto' deixa o Ray 3.2 escolher; adhere_* preserva mais, flex_* é equilibrado, reimagine_* muda mais."
+      },
+      "video": {
+        "name": "vídeo",
+        "tooltip": "Vídeo de origem para editar. Até 18 segundos."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "Altere a proporção de aspecto de um vídeo existente, usando Luma Ray 3.2 para preencher as novas áreas expostas do canvas. Vídeo de origem de até 30 segundos. Cobrança por segundo de saída.",
+    "display_name": "Luma Ray 3.2 Reenquadrar Vídeo",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "proporção"
+      },
+      "control_after_generate": {
+        "name": "controle após gerar"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Descreve como as novas áreas expostas do canvas devem ser preenchidas."
+      },
+      "resolution": {
+        "name": "resolução"
+      },
+      "seed": {
+        "name": "semente",
+        "tooltip": "Semente para determinar se o nó deve ser executado novamente; os resultados são não determinísticos independentemente da semente."
+      },
+      "video": {
+        "name": "vídeo",
+        "tooltip": "Vídeo de origem para reenquadrar. Até 30 segundos."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "id_geração",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "Armazena uma imagem e peso para uso com o nó Luma Gerar Imagem.",
     "display_name": "Luma Referência",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "audioUI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "áudio",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "imagens"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "imagens"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "imagens"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "imagens",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "qualidade"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "imagens",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "prefixo_do_arquivo"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "áudio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "format",
         "tooltip": "O formato de arquivo no qual salvar o áudio."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "áudio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "qualidade"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "áudio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "qualidade"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "áudio",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "imagens",
         "tooltip": "As imagens a serem salvas."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "imagens"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "imagens",
         "tooltip": "As imagens a serem salvas."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "imagens",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "amostras"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "amostras"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "svg"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "vídeo",
         "tooltip": "O vídeo a ser salvo."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "vídeo",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "imagens",
         "tooltip": "Imagens RGBA são salvas com seu canal alfa como transparência (apenas codec vp9)."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "imagens",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "modelo",
         "tooltip": "O modelo ao qual aplicar as janelas de contexto durante a amostragem."
+      },
+      "retain_first_frame": {
+        "name": "reter_primeiro_quadro",
+        "tooltip": "Reter o primeiro quadro I2V em cada janela de contexto (pode ajudar a manter a referência inicial)."
+      },
+      "split_conds_to_windows": {
+        "name": "dividir_condições_para_janelas",
+        "tooltip": "Se deve dividir múltiplas condicionantes (criadas por ConditionCombine) para cada janela com base no índice da região."
       }
     },
     "outputs": {
diff --git a/src/locales/ru/main.json b/src/locales/ru/main.json
index 90707cbf19..18fb128738 100644
--- a/src/locales/ru/main.json
+++ b/src/locales/ru/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "МОДЕЛЬ_LORA",
     "LOSS_MAP": "КАРТА_ПОТЕРЬ",
     "LUMA_CONCEPTS": "LUMA_CONCEPTS",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "LUMA_REF",
     "MASK": "МАСКА",
     "MESH": "СЕТКА",
@@ -3979,6 +3980,7 @@
     "fileTooLarge": "Файл слишком большой ({size} МБ). Максимально поддерживаемый размер — {maxSize} МБ",
     "fileUploadFailed": "Не удалось загрузить файл",
     "interrupted": "Выполнение было прервано",
+    "invalidTemplateData": "Не удалось загрузить шаблон узла: неверные данные",
     "legacyMaskEditorDeprecated": "Устаревший редактор масок будет скоро удалён.",
     "migrateToLitegraphReroute": "Узлы перенаправления будут удалены в будущих версиях. Нажмите, чтобы перейти на litegraph-native reroute.",
     "missingModelVerificationFailed": "Не удалось проверить отсутствующие модели. Некоторые модели могут не отображаться на вкладке Ошибки.",
diff --git a/src/locales/ru/nodeDefs.json b/src/locales/ru/nodeDefs.json
index e3c27f3569..f507990285 100644
--- a/src/locales/ru/nodeDefs.json
+++ b/src/locales/ru/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "метод_объединения",
         "tooltip": "Метод объединения контекстных окон."
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "Список индексов латентного пространства, которые нужно сохранить непосредственно в латентном шуме для каждого окна. Используется в рабочих процессах, где референсный контент (например, стартовое изображение) находится прямо в латентном шуме, а не в отдельных каналах кондиционирования (например, I2V в стиле inplace, как LTXV, AnimateDiff). Не зависит от cond_retain_index_list."
+      },
       "model": {
         "name": "модель",
         "tooltip": "Модель, к которой применяются контекстные окна во время сэмплирования."
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "Установить окна контекста для моделей, подобных LTXV.",
+    "display_name": "Окна контекста LTXV",
+    "inputs": {
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "Замыкать ли цикл окна контекста; применяется только к циклическим расписаниям."
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "Длина окна контекста в реальных кадрах. Должна быть 8*n + 1."
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "Перекрытие окна контекста в реальных кадрах."
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "Зависимый от шага алгоритм планирования окон контекста."
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "Шаг окна контекста; применяется только к равномерным расписаниям."
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "Применять ли перемешивание шума FreeNoise, улучшает смешивание окон."
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "Метод объединения окон контекста."
+      },
+      "model": {
+        "name": "model",
+        "tooltip": "Модель, к которой будут применяться окна контекста во время сэмплирования."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "Сохранять первый латентный кадр в каждом окне контекста (может помочь сохранить начальный референс)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "Разделять ли несколько кондиционирований (созданных ConditionCombine) по каждому окну на основе индекса региона."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "Модель с применёнными окнами контекста во время сэмплирования."
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXVCropGuides",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "Загрузить 3D (расширено)",
+    "inputs": {
+      "height": {
+        "name": "height"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "Загрузить аудио",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "Продлите ранее сгенерированное Ray 3.2 видео вперёд (продолжить после него) или назад (добавить перед ним). Подключите выход generation_id предыдущего узла Luma Ray 3.2. Продление всегда составляет 5 секунд.",
+    "display_name": "Luma Ray 3.2 Продлить видео",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "Вперёд — продолжить после предыдущего clip; назад — добавить перед ним."
+      },
+      "direction_loop": {
+        "name": "loop"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Текстовый запрос для нового контента."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed для определения необходимости повторного запуска узла; результат всегда недетерминированный, независимо от seed."
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "generation_id предыдущего Ray 3.2 видео для продления. Подключите выход generation_id другого узла Luma Ray 3.2."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "Создайте видео из начального и/или конечного кадра с помощью модели Ray 3.2 от Luma. Генерация с привязкой к изображению всегда длится 5 секунд.",
+    "display_name": "Luma Ray 3.2 Изображение в видео",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "Последний кадр сгенерированного видео."
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "Сделать видео бесшовным по циклу. Недоступно, если задан end_frame."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Текстовый запрос для генерации видео."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed для определения необходимости повторного запуска узла; результат всегда недетерминированный, независимо от seed."
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "Первый кадр сгенерированного видео."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "Закрепите направляющее изображение на определённой позиции временной шкалы выходного видео Ray 3.2. Подключите этот узел к входу 'keyframes' узла Luma Ray 3.2 Keyframes to Video; объединяйте несколько узлов через дополнительный вход 'keyframes' ниже.",
+    "display_name": "Luma Ray 3.2 Ключевой кадр",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "Направляющее изображение для размещения в выбранный момент выходного видео."
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Необязательные предыдущие ключевые кадры для объединения с этим."
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "Как разместить это изображение на временной шкале выходного видео."
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "Создайте видео, интерполируя последовательность направляющих изображений, каждое из которых привязано к определённой позиции на временной шкале, с помощью Luma Ray 3.2. Постройте последовательность с помощью узлов Luma Ray 3.2 Keyframe (не менее 2).",
+    "display_name": "Luma Ray 3.2: Ключевые кадры в видео",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "duration": {
+        "name": "duration"
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Последовательность ключевых кадров из узлов Luma Ray 3.2 Keyframe (не менее 2)."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Текстовый запрос для генерации видео."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Сид для определения необходимости повторного запуска узла; результат всегда недетерминирован, независимо от сида."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "Создайте видео по текстовому запросу с помощью модели Luma Ray 3.2.",
+    "display_name": "Luma Ray 3.2: Текст в видео",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "duration": {
+        "name": "duration"
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "Сделать видео бесшовно зацикленным. Доступно только для длительности 5 секунд."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Текстовый запрос для генерации видео."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Сид для определения необходимости повторного запуска узла; результат всегда недетерминирован, независимо от сида."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "Перегенерируйте существующее видео по новому запросу с помощью Luma Ray 3.2 (смена стиля, освещения, добавление или удаление элементов), сохраняя исходное движение. Исходное видео — до 18 секунд; длина отредактированного видео совпадает с исходным.",
+    "display_name": "Luma Ray 3.2: Редактирование видео",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Опишите желаемое изменение."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Сид для определения необходимости повторного запуска узла; результат всегда недетерминирован, независимо от сида."
+      },
+      "strength": {
+        "name": "strength",
+        "tooltip": "Степень сохранения или переосмысления исходника. 'auto' — выбор Ray 3.2; adhere_* — максимальное сохранение, flex_* — баланс, reimagine_* — максимальные изменения."
+      },
+      "video": {
+        "name": "video",
+        "tooltip": "Исходное видео для редактирования. До 18 секунд."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "Измените соотношение сторон существующего видео, используя Luma Ray 3.2 для заполнения новых областей холста. Исходное видео до 30 секунд. Оплата за каждую секунду результата.",
+    "display_name": "Luma Ray 3.2 Видео Переформатирование",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "соотношение сторон"
+      },
+      "control_after_generate": {
+        "name": "контроль после генерации"
+      },
+      "prompt": {
+        "name": "промпт",
+        "tooltip": "Опишите, как должны быть заполнены новые области холста."
+      },
+      "resolution": {
+        "name": "разрешение"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Seed для определения необходимости повторного запуска узла; результаты недетерминированы независимо от seed."
+      },
+      "video": {
+        "name": "видео",
+        "tooltip": "Исходное видео для изменения формата. До 30 секунд."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "Содержит изображение и вес для использования с узлом Luma Generate Image.",
     "display_name": "Luma Reference",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "audioUI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "аудио",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "изображения"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "изображения"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "изображения"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "изображения",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "качество"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "изображения",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "префикс_названия_файла"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "аудио",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "format",
         "tooltip": "Формат файла для сохранения аудио."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "аудио",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "качество"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "аудио",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "качество"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "аудио",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "изображения",
         "tooltip": "Изображения_для_сохранения."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "изображения"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "изображения",
         "tooltip": "Изображения для сохранения."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "изображения",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "образцы"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "samples"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "svg"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "видео",
         "tooltip": "Видео для сохранения."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "видео",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "изображения",
         "tooltip": "RGBA-изображения сохраняются с альфа-каналом как прозрачность (только кодек vp9)."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "изображения",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "модель",
         "tooltip": "Модель, к которой применяются контекстные окна во время сэмплирования."
+      },
+      "retain_first_frame": {
+        "name": "сохранить первый кадр",
+        "tooltip": "Сохранять первый кадр I2V в каждом контекстном окне (может помочь сохранить исходную ссылку)."
+      },
+      "split_conds_to_windows": {
+        "name": "разделить условия по окнам",
+        "tooltip": "Разделять ли несколько условий (созданных ConditionCombine) по каждому окну на основе индекса региона."
       }
     },
     "outputs": {
diff --git a/src/locales/tr/main.json b/src/locales/tr/main.json
index 4e30f41465..075d5ac01f 100644
--- a/src/locales/tr/main.json
+++ b/src/locales/tr/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "LORA_MODEL",
     "LOSS_MAP": "KAYIP_HARITASI",
     "LUMA_CONCEPTS": "LUMA_KAVRAMLARI",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "LUMA_REF",
     "MASK": "MASKE",
     "MESH": "MESH",
@@ -3979,6 +3980,7 @@
     "fileTooLarge": "Dosya çok büyük ({size} MB). Desteklenen maksimum boyut {maxSize} MB",
     "fileUploadFailed": "Dosya yükleme başarısız oldu",
     "interrupted": "Yürütme kesintiye uğradı",
+    "invalidTemplateData": "Düğüm şablonu yüklenemedi: geçersiz veri",
     "legacyMaskEditorDeprecated": "Klasik maske düzenleyici kullanımdan kaldırıldı ve yakında kaldırılacak.",
     "migrateToLitegraphReroute": "Yeniden yönlendirme düğümleri gelecekteki sürümlerde kaldırılacaktır. Litegraph yerel yeniden yönlendirmeye geçmek için tıklayın.",
     "missingModelVerificationFailed": "Eksik modeller doğrulanamadı. Bazı modeller Hatalar sekmesinde gösterilmeyebilir.",
diff --git a/src/locales/tr/nodeDefs.json b/src/locales/tr/nodeDefs.json
index b57ba4cf39..9ba481f13e 100644
--- a/src/locales/tr/nodeDefs.json
+++ b/src/locales/tr/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "birleştirme yöntemi",
         "tooltip": "Bağlam pencerelerini birleştirmek için kullanılacak yöntem."
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "Her pencere için gürültü latent'inde tutulacak latent indekslerinin listesi. Referans içeriğin (ör. başlangıç görseli) ayrı koşullandırma kanallarında değil, doğrudan gürültü latent'inde bulunduğu iş akışlarında kullanılır (ör. inplace tarzı I2V, LTXV, AnimateDiff gibi). cond_retain_index_list'ten bağımsızdır."
+      },
       "model": {
         "name": "model",
         "tooltip": "Örnekleme sırasında bağlam pencerelerinin uygulanacağı model."
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "LTXV benzeri modeller için bağlam pencerelerini ayarlayın.",
+    "display_name": "LTXV Bağlam Pencereleri",
+    "inputs": {
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "Bağlam penceresi döngüsünün kapatılıp kapatılmayacağı; yalnızca döngülü zamanlamalar için geçerlidir."
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "Bağlam penceresinin gerçek karelerdeki uzunluğu. 8*n + 1 olmalıdır."
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "Bağlam penceresinin gerçek karelerdeki örtüşme miktarı."
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "Bağlam pencereleri için adıma bağlı zamanlama algoritması."
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "Bağlam penceresinin adım aralığı; yalnızca uniform zamanlamalar için geçerlidir."
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "FreeNoise gürültü karıştırmasını uygulayıp uygulamama; pencere karışımını iyileştirir."
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "Bağlam pencerelerini birleştirmek için kullanılacak yöntem."
+      },
+      "model": {
+        "name": "model",
+        "tooltip": "Örnekleme sırasında bağlam pencereleri uygulanacak model."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "Her bağlam penceresinde ilk latent kareyi tut (ilk referansın korunmasına yardımcı olabilir)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "Birden fazla koşullandırmanın (ConditionCombine ile oluşturulan) pencere başına bölünüp bölünmeyeceği; bölge indeksine göre."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "Örnekleme sırasında bağlam pencereleri uygulanmış model."
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXVRehberleriKırp",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "3D Yükle (Gelişmiş)",
+    "inputs": {
+      "height": {
+        "name": "height"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "Ses Yükle",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "Önceki bir Ray 3.2 üretimini ileriye (sonrasına devam) veya geriye (öncesine giriş) doğru uzatın. Önceki bir Luma Ray 3.2 düğümünün generation_id çıktısını bağlayın. Uzatmalar her zaman 5 saniyedir.",
+    "display_name": "Luma Ray 3.2 Video Uzat",
+    "inputs": {
+      "control_after_generate": {
+        "name": "oluşturduktan sonra kontrol et"
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "İleri, önceki clip'ten sonra devam eder; geri, onun önüne eklenir."
+      },
+      "direction_loop": {
+        "name": "döngü"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Yeni içerik için metin istemi."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Düğümün tekrar çalıştırılıp çalıştırılmayacağını belirlemek için seed; seed ne olursa olsun sonuçlar deterministik değildir."
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "Uzatılacak önceki Ray 3.2 videonun generation_id'si. Başka bir Luma Ray 3.2 düğümünün generation_id çıktısını bağlayın."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "Luma'nın Ray 3.2 modeliyle bir başlangıç ve/veya bitiş karesi kullanarak video oluşturun. Görsele sabitlenen üretimler her zaman 5 saniyedir.",
+    "display_name": "Luma Ray 3.2 Görselden Videoya",
+    "inputs": {
+      "control_after_generate": {
+        "name": "oluşturduktan sonra kontrol et"
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "Oluşturulan videonun son karesi."
+      },
+      "loop": {
+        "name": "döngü",
+        "tooltip": "Videoyu kusursuz bir şekilde döngüye sokar. end_frame ayarlandığında kullanılamaz."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Video üretimi için metin istemi."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Düğümün tekrar çalıştırılıp çalıştırılmayacağını belirlemek için seed; seed ne olursa olsun sonuçlar deterministik değildir."
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "Oluşturulan videonun ilk karesi."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "Bir rehber görseli Ray 3.2 çıktı videosu zaman çizelgesinde bir konuma sabitleyin. Bunu Luma Ray 3.2 Ana Karelerden Videoya düğümünün 'keyframes' girişine bağlayın; aşağıdaki isteğe bağlı 'keyframes' girişiyle birkaçını zincirleyin.",
+    "display_name": "Luma Ray 3.2 Ana Kare",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "Çıktı videosunun seçilen anına yerleştirilecek rehber görsel."
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "Bununla zincirlenebilecek isteğe bağlı önceki ana kareler."
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "Bu görselin çıktı video zaman çizelgesinde nasıl yerleştirileceği."
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "Her biri zaman çizelgesinde bir konuma sabitlenmiş rehber görseller dizisi arasında geçiş yapan bir video oluşturun. Luma Ray 3.2 Anahtar Kare düğümleriyle (en az 2 adet) diziyi oluşturun.",
+    "display_name": "Luma Ray 3.2 Anahtar Karelerden Videoya",
+    "inputs": {
+      "control_after_generate": {
+        "name": "oluşturduktan sonra kontrol et"
+      },
+      "duration": {
+        "name": "süre"
+      },
+      "keyframes": {
+        "name": "anahtar kareler",
+        "tooltip": "Luma Ray 3.2 Anahtar Kare düğümlerinden anahtar kare dizisi (en az 2 adet)."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Video oluşturma için metin istemi."
+      },
+      "resolution": {
+        "name": "çözünürlük"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Düğümün tekrar çalıştırılıp çalıştırılmayacağını belirleyen seed; seed ne olursa olsun sonuçlar deterministik değildir."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "oluşturma_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "Luma'nın Ray 3.2 modeliyle bir metin isteminden video oluşturun.",
+    "display_name": "Luma Ray 3.2 Metinden Videoya",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "en-boy oranı"
+      },
+      "control_after_generate": {
+        "name": "oluşturduktan sonra kontrol et"
+      },
+      "duration": {
+        "name": "süre"
+      },
+      "loop": {
+        "name": "döngü",
+        "tooltip": "Videoyu kusursuz bir şekilde döngüye sok. Sadece 5 saniyelik sürede kullanılabilir."
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Video oluşturma için metin istemi."
+      },
+      "resolution": {
+        "name": "çözünürlük"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Düğümün tekrar çalıştırılıp çalıştırılmayacağını belirleyen seed; seed ne olursa olsun sonuçlar deterministik değildir."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "oluşturma_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "Mevcut bir videoyu yeni bir istemle Luma Ray 3.2 kullanarak yeniden oluşturun (yeniden stillendir, yeniden ışıklandır, öğe ekle veya çıkar) ve orijinal hareketi koruyun. Kaynak video en fazla 18 saniye olabilir; düzenlenen video kaynağın süresini korur.",
+    "display_name": "Luma Ray 3.2 Video Düzenle",
+    "inputs": {
+      "control_after_generate": {
+        "name": "oluşturduktan sonra kontrol et"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "İstenen düzenlemeyi tanımlar."
+      },
+      "resolution": {
+        "name": "çözünürlük"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Düğümün tekrar çalıştırılıp çalıştırılmayacağını belirleyen seed; seed ne olursa olsun sonuçlar deterministik değildir."
+      },
+      "strength": {
+        "name": "güç",
+        "tooltip": "Kaynağı ne kadar koruyacağı veya yeniden hayal edeceği. 'auto' Ray 3.2'nin seçmesine izin verir; adhere_* en çok korur, flex_* dengelidir, reimagine_* en çok değiştirir."
+      },
+      "video": {
+        "name": "video",
+        "tooltip": "Düzenlenecek kaynak video. En fazla 18 saniye."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "oluşturma_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "Mevcut bir videonun en-boy oranını değiştirin, yeni açığa çıkan tuval alanlarını doldurmak için Luma Ray 3.2 kullanılır. Kaynak video en fazla 30 saniye. Çıktı süresi başına ücretlendirilir.",
+    "display_name": "Luma Ray 3.2 Video Yeniden Çerçeveleme",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "Yeni açığa çıkan tuval alanlarının nasıl doldurulacağını açıklar."
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "Düğümün tekrar çalıştırılıp çalıştırılmayacağını belirleyen tohum; sonuçlar tohumdan bağımsız olarak deterministik değildir."
+      },
+      "video": {
+        "name": "video",
+        "tooltip": "Yeniden çerçevelenecek kaynak video. En fazla 30 saniye."
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "Luma Görüntü Oluştur düğümüyle kullanılmak üzere bir görüntü ve ağırlık tutar.",
     "display_name": "Luma Referansı",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "sesArayüzü"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "görüntüler"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "görüntüler"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "kalite"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "dosyaadı_öneki"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "format",
         "tooltip": "Sesin kaydedileceği dosya formatı."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "kalite"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "kalite"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "görüntüler",
         "tooltip": "Kaydedilecek görüntüler."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "görüntüler",
         "tooltip": "Kaydedilecek görüntüler."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "örnekler"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "samples"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "svg"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "video",
         "tooltip": "Kaydedilecek video."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "video",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "görüntüler",
         "tooltip": "RGBA görseller, alfa kanalıyla şeffaf olarak kaydedilir (yalnızca vp9 codec)."
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "model",
         "tooltip": "Örnekleme sırasında bağlam pencerelerinin uygulanacağı model."
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "Her bağlam penceresinde ilk I2V karesini koru (ilk referansın korunmasına yardımcı olabilir)."
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "Birden fazla koşullandırmanın (ConditionCombine tarafından oluşturulan) her pencereye bölge indeksine göre bölünüp bölünmeyeceği."
       }
     },
     "outputs": {
diff --git a/src/locales/zh-TW/main.json b/src/locales/zh-TW/main.json
index 33fc8558ab..8479b1d696 100644
--- a/src/locales/zh-TW/main.json
+++ b/src/locales/zh-TW/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "LoRA模型",
     "LOSS_MAP": "損失圖",
     "LUMA_CONCEPTS": "LUMA 概念",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "LUMA 參考",
     "MASK": "遮罩",
     "MESH": "網格",
@@ -3979,6 +3980,7 @@
     "fileTooLarge": "檔案過大（{size} MB）。最大支援大小為 {maxSize} MB",
     "fileUploadFailed": "檔案上傳失敗",
     "interrupted": "執行已被中斷",
+    "invalidTemplateData": "載入節點範本失敗：資料無效",
     "legacyMaskEditorDeprecated": "舊版遮罩編輯器即將淘汰並很快移除。",
     "migrateToLitegraphReroute": "重導節點將於未來版本移除。點擊以遷移至 litegraph 原生重導。",
     "missingModelVerificationFailed": "驗證缺少的模型失敗。部分模型可能不會顯示在錯誤標籤頁中。",
diff --git a/src/locales/zh-TW/nodeDefs.json b/src/locales/zh-TW/nodeDefs.json
index 309dcd18de..3d4984c45c 100644
--- a/src/locales/zh-TW/nodeDefs.json
+++ b/src/locales/zh-TW/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "融合方法",
         "tooltip": "用於融合上下文窗口的方法。"
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "每個視窗中要在 noise latent 本身中保留的 latent 索引列表。適用於參考內容（例如起始圖像）直接存在於 noise latent 中，而不是在單獨的 conditioning channel 中的工作流程（例如 inplace 風格的 I2V，如 LTXV、AnimateDiff）。與 cond_retain_index_list 無關。"
+      },
       "model": {
         "name": "模型",
         "tooltip": "在取樣期間應用上下文窗口的模型。"
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "為 LTXV 類型模型設定上下文視窗。",
+    "display_name": "LTXV 上下文視窗",
+    "inputs": {
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "是否閉合上下文視窗循環；僅適用於循環排程。"
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "上下文視窗的實際幀數長度。必須為 8*n + 1。"
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "上下文視窗的實際幀數重疊。"
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "上下文視窗的步驟依賴排程演算法。"
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "上下文視窗的步幅；僅適用於均勻排程。"
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "是否套用 FreeNoise 噪聲洗牌，可提升視窗融合效果。"
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "用於融合上下文視窗的方法。"
+      },
+      "model": {
+        "name": "model",
+        "tooltip": "在取樣時要套用上下文視窗的模型。"
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "在每個上下文視窗中保留第一個 latent 幀（有助於保留初始參考）。"
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "是否根據區域索引將多個 conditioning（由 ConditionCombine 建立）分配到各個視窗。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "在取樣時已套用上下文視窗的模型。"
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXV 裁剪引導",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "載入 3D（進階）",
+    "inputs": {
+      "height": {
+        "name": "height"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "載入音訊",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "將先前的 Ray 3.2 生成結果向前（接續之後）或向後（插入之前）延伸。請連接前一個 Luma Ray 3.2 節點的 generation_id 輸出。每次延伸皆為 5 秒。",
+    "display_name": "Luma Ray 3.2 延伸影片",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "Forward 代表接續前一個片段之後；backward 代表插入於其之前。"
+      },
+      "direction_loop": {
+        "name": "loop"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "新內容的文字提示。"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "決定節點是否重新執行的種子值；無論種子為何，結果皆為非決定性。"
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "要延伸的前一個 Ray 3.2 影片的 generation_id。請連接另一個 Luma Ray 3.2 節點的 generation_id 輸出。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "使用 Luma 的 Ray 3.2 模型，從起始和/或結束影格產生影片。以圖像為錨點的生成長度皆為 5 秒。",
+    "display_name": "Luma Ray 3.2 圖像轉影片",
+    "inputs": {
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "生成影片的最後一個影格。"
+      },
+      "loop": {
+        "name": "loop",
+        "tooltip": "讓影片無縫循環。若設定 end_frame 則無法使用。"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "影片生成的文字提示。"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "決定節點是否重新執行的種子值；無論種子為何，結果皆為非決定性。"
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "生成影片的第一個影格。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "將引導圖像錨定於 Ray 3.2 輸出影片時間軸上的特定位置。請將此節點連接至 Luma Ray 3.2 Keyframes to Video 節點的「keyframes」輸入；可透過下方的「keyframes」選填輸入串接多個關鍵影格。",
+    "display_name": "Luma Ray 3.2 關鍵影格",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "要放置於輸出影片指定時刻的引導圖像。"
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "可選的較早關鍵影格，與本影格串接。"
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "將此圖像放置於輸出影片時間軸上的方式。"
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "使用 Luma Ray 3.2，根據一系列導引圖像（每個圖像對應時間軸上的一個位置）進行插值，生成影片。請使用 Luma Ray 3.2 關鍵影格節點建立序列（至少 2 個）。",
+    "display_name": "Luma Ray 3.2 關鍵影格轉影片",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成後控制"
+      },
+      "duration": {
+        "name": "時長"
+      },
+      "keyframes": {
+        "name": "關鍵影格",
+        "tooltip": "來自 Luma Ray 3.2 關鍵影格節點的關鍵影格序列（至少 2 個）。"
+      },
+      "prompt": {
+        "name": "提示詞",
+        "tooltip": "用於影片生成的文字提示。"
+      },
+      "resolution": {
+        "name": "解析度"
+      },
+      "seed": {
+        "name": "種子",
+        "tooltip": "決定節點是否重新執行的種子；無論種子為何，結果皆為非確定性。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "使用 Luma 的 Ray 3.2 模型，根據文字提示生成影片。",
+    "display_name": "Luma Ray 3.2 文字轉影片",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "長寬比"
+      },
+      "control_after_generate": {
+        "name": "生成後控制"
+      },
+      "duration": {
+        "name": "時長"
+      },
+      "loop": {
+        "name": "循環",
+        "tooltip": "讓影片無縫循環。僅限 5 秒時長可用。"
+      },
+      "prompt": {
+        "name": "提示詞",
+        "tooltip": "用於影片生成的文字提示。"
+      },
+      "resolution": {
+        "name": "解析度"
+      },
+      "seed": {
+        "name": "種子",
+        "tooltip": "決定節點是否重新執行的種子；無論種子為何，結果皆為非確定性。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "使用 Luma Ray 3.2 以新提示詞重新渲染現有影片（可重新風格化、重新打光、增減元素），同時保留原始動作。來源影片最長 18 秒；編輯後影片長度與來源相同。",
+    "display_name": "Luma Ray 3.2 影片編輯",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成後控制"
+      },
+      "prompt": {
+        "name": "提示詞",
+        "tooltip": "描述想要的編輯效果。"
+      },
+      "resolution": {
+        "name": "解析度"
+      },
+      "seed": {
+        "name": "種子",
+        "tooltip": "決定節點是否重新執行的種子；無論種子為何，結果皆為非確定性。"
+      },
+      "strength": {
+        "name": "強度",
+        "tooltip": "保留原始內容與重新想像的程度。'auto' 由 Ray 3.2 自動選擇；adhere_* 最保留原始內容，flex_* 平衡，reimagine_* 變化最大。"
+      },
+      "video": {
+        "name": "影片",
+        "tooltip": "要編輯的來源影片。最長 18 秒。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "更改現有影片的長寬比，使用 Luma Ray 3.2 填補新顯露的畫布區域。來源影片最長 30 秒。依輸出秒數計費。",
+    "display_name": "Luma Ray 3.2 影片重構比例",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "描述新顯露畫布區域應如何填補。"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "決定是否重新執行節點的種子值；無論種子為何，結果皆為非確定性。"
+      },
+      "video": {
+        "name": "video",
+        "tooltip": "要重構比例的來源影片。最長 30 秒。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "保存一張圖片及其權重，供 Luma 生成圖片節點使用。",
     "display_name": "Luma 參考",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "音訊介面"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "圖片"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "images"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "品質"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "檔名前綴"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "format",
         "tooltip": "儲存音訊的檔案格式。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "quality"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "quality"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "影像",
         "tooltip": "要儲存的圖片。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "影像",
         "tooltip": "要儲存的影像。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "samples"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "samples"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "svg"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "video",
         "tooltip": "要儲存的影片。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "video",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "images",
         "tooltip": "RGBA 影像將以 alpha 通道作為透明度儲存（僅限 vp9 編解碼器）。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "模型",
         "tooltip": "在採樣期間應用上下文窗口的模型。"
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "在每個 context window 中保留第一個 I2V 畫格（有助於保留初始參考）。"
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "是否根據區域索引，將多個條件（由 ConditionCombine 建立）分配到各自的 window。"
       }
     },
     "outputs": {
diff --git a/src/locales/zh/main.json b/src/locales/zh/main.json
index 3d756c5cec..c955509d65 100644
--- a/src/locales/zh/main.json
+++ b/src/locales/zh/main.json
@@ -871,6 +871,7 @@
     "LORA_MODEL": "LORA模型",
     "LOSS_MAP": "损失图",
     "LUMA_CONCEPTS": "Luma 概念",
+    "LUMA_RAY32_KEYFRAME": "LUMA_RAY32_KEYFRAME",
     "LUMA_REF": "Luma 参考",
     "MASK": "遮罩",
     "MESH": "网格",
@@ -3991,6 +3992,7 @@
     "fileTooLarge": "文件过大（{size} MB）。最大支持大小为 {maxSize} MB",
     "fileUploadFailed": "文件上传失败",
     "interrupted": "执行已被中断",
+    "invalidTemplateData": "加载节点模板失败：数据无效",
     "legacyMaskEditorDeprecated": "旧版遮罩编辑器已弃用，即将删除。",
     "migrateToLitegraphReroute": "将来的版本中将删除重定向节点。点击以迁移到litegraph-native重定向。",
     "missingModelVerificationFailed": "验证缺失模型失败。部分模型可能不会在错误标签页中显示。",
diff --git a/src/locales/zh/nodeDefs.json b/src/locales/zh/nodeDefs.json
index 2d787d38bc..e976f33d72 100644
--- a/src/locales/zh/nodeDefs.json
+++ b/src/locales/zh/nodeDefs.json
@@ -2471,6 +2471,10 @@
         "name": "融合方法",
         "tooltip": "用于融合上下文窗口的方法。"
       },
+      "latent_retain_index_list": {
+        "name": "latent_retain_index_list",
+        "tooltip": "每个窗口中要在噪声latent本身中保留的latent索引列表。适用于参考内容（如起始图像）直接存在于噪声latent中，而不是单独的条件通道中的工作流（如inplace风格的I2V，例如LTXV、AnimateDiff）。与cond_retain_index_list无关。"
+      },
       "model": {
         "name": "模型",
         "tooltip": "在采样期间应用上下文窗口的模型。"
@@ -8324,6 +8328,57 @@
       }
     }
   },
+  "LTXVContextWindows": {
+    "description": "为类似LTXV的模型设置上下文窗口。",
+    "display_name": "LTXV上下文窗口",
+    "inputs": {
+      "closed_loop": {
+        "name": "closed_loop",
+        "tooltip": "是否闭合上下文窗口循环，仅适用于循环调度。"
+      },
+      "context_length": {
+        "name": "context_length",
+        "tooltip": "上下文窗口的实际帧长度。必须为8*n+1。"
+      },
+      "context_overlap": {
+        "name": "context_overlap",
+        "tooltip": "上下文窗口在实际帧中的重叠部分。"
+      },
+      "context_schedule": {
+        "name": "context_schedule",
+        "tooltip": "上下文窗口的步进调度算法。"
+      },
+      "context_stride": {
+        "name": "context_stride",
+        "tooltip": "上下文窗口的步幅，仅适用于均匀调度。"
+      },
+      "freenoise": {
+        "name": "freenoise",
+        "tooltip": "是否应用FreeNoise噪声洗牌，提升窗口融合效果。"
+      },
+      "fuse_method": {
+        "name": "fuse_method",
+        "tooltip": "用于融合上下文窗口的方法。"
+      },
+      "model": {
+        "name": "model",
+        "tooltip": "采样时应用上下文窗口的模型。"
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "在每个上下文窗口中保留第一个latent帧（有助于保留初始参考）。"
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "是否将多个条件（由ConditionCombine创建）根据区域索引分配到各个窗口。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": "采样时应用了上下文窗口的模型。"
+      }
+    }
+  },
   "LTXVCropGuides": {
     "display_name": "LTXV裁剪指导",
     "inputs": {
@@ -9084,6 +9139,45 @@
       }
     }
   },
+  "Load3DAdvanced": {
+    "display_name": "加载3D（高级）",
+    "inputs": {
+      "height": {
+        "name": "height"
+      },
+      "model_file": {
+        "name": "model_file"
+      },
+      "viewport_state": {
+        "name": "viewport_state"
+      },
+      "width": {
+        "name": "width"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "model_3d",
+        "tooltip": null
+      },
+      "1": {
+        "name": "model_3d_info",
+        "tooltip": null
+      },
+      "2": {
+        "name": "camera_info",
+        "tooltip": null
+      },
+      "3": {
+        "name": "width",
+        "tooltip": null
+      },
+      "4": {
+        "name": "height",
+        "tooltip": null
+      }
+    }
+  },
   "LoadAudio": {
     "display_name": "加载音频",
     "inputs": {
@@ -9747,6 +9841,262 @@
       }
     }
   },
+  "LumaRay32ExtendVideoNode": {
+    "description": "将之前的 Ray 3.2 生成结果向前（在其后继续）或向后（在其前引入）扩展。请连接前一个 Luma Ray 3.2 节点的 generation_id 输出。每次扩展均为 5 秒。",
+    "display_name": "Luma Ray 3.2 视频扩展",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成后控制"
+      },
+      "direction": {
+        "name": "direction",
+        "tooltip": "Forward 表示在前一个 clip 后继续；backward 表示在其前插入。"
+      },
+      "direction_loop": {
+        "name": "循环"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "新内容的文本提示。"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "用于决定节点是否重新运行的种子；无论种子如何，结果都是非确定性的。"
+      },
+      "source_generation_id": {
+        "name": "source_generation_id",
+        "tooltip": "要扩展的视频的 Ray 3.2 generation_id。请连接另一个 Luma Ray 3.2 节点的 generation_id 输出。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32ImageToVideoNode": {
+    "description": "使用 Luma 的 Ray 3.2 模型从起始帧和/或结束帧生成视频。基于图像锚点的生成时长均为 5 秒。",
+    "display_name": "Luma Ray 3.2 图像转视频",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成后控制"
+      },
+      "end_frame": {
+        "name": "end_frame",
+        "tooltip": "生成视频的最后一帧。"
+      },
+      "loop": {
+        "name": "循环",
+        "tooltip": "使视频无缝循环。当设置了 end_frame 时不可用。"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "视频生成的文本提示。"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "用于决定节点是否重新运行的种子；无论种子如何，结果都是非确定性的。"
+      },
+      "start_frame": {
+        "name": "start_frame",
+        "tooltip": "生成视频的第一帧。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframeNode": {
+    "description": "将引导图像锚定到 Ray 3.2 输出视频时间线上指定位置。请将此节点连接到 Luma Ray 3.2 关键帧转视频节点的 'keyframes' 输入；可通过下方可选的 'keyframes' 输入将多个关键帧串联。",
+    "display_name": "Luma Ray 3.2 关键帧",
+    "inputs": {
+      "image": {
+        "name": "image",
+        "tooltip": "要放置在输出视频指定时刻的引导图像。"
+      },
+      "keyframes": {
+        "name": "keyframes",
+        "tooltip": "可选的前置关键帧，用于与当前关键帧串联。"
+      },
+      "position": {
+        "name": "position",
+        "tooltip": "如何将该图像放置在输出视频的时间线上。"
+      },
+      "position_fraction": {
+        "name": "fraction"
+      }
+    },
+    "outputs": {
+      "0": {
+        "name": "keyframes",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32KeyframesToVideoNode": {
+    "description": "使用 Luma Ray 3.2，通过插值一系列锚定在时间轴上的引导图像，生成视频。请使用 Luma Ray 3.2 关键帧节点（至少 2 个）构建序列。",
+    "display_name": "Luma Ray 3.2 关键帧转视频",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成后控制"
+      },
+      "duration": {
+        "name": "时长"
+      },
+      "keyframes": {
+        "name": "关键帧",
+        "tooltip": "来自 Luma Ray 3.2 关键帧节点的关键帧序列（至少 2 个）。"
+      },
+      "prompt": {
+        "name": "提示词",
+        "tooltip": "用于视频生成的文本提示。"
+      },
+      "resolution": {
+        "name": "分辨率"
+      },
+      "seed": {
+        "name": "种子",
+        "tooltip": "用于决定节点是否重新运行的种子；无论种子如何，结果都是非确定性的。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32TextToVideoNode": {
+    "description": "使用 Luma 的 Ray 3.2 模型，根据文本提示生成视频。",
+    "display_name": "Luma Ray 3.2 文本转视频",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "宽高比"
+      },
+      "control_after_generate": {
+        "name": "生成后控制"
+      },
+      "duration": {
+        "name": "时长"
+      },
+      "loop": {
+        "name": "循环",
+        "tooltip": "使视频无缝循环。仅在 5 秒时长可用。"
+      },
+      "prompt": {
+        "name": "提示词",
+        "tooltip": "用于视频生成的文本提示。"
+      },
+      "resolution": {
+        "name": "分辨率"
+      },
+      "seed": {
+        "name": "种子",
+        "tooltip": "用于决定节点是否重新运行的种子；无论种子如何，结果都是非确定性的。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoEditNode": {
+    "description": "使用 Luma Ray 3.2 在新提示下重新渲染已有视频（可重绘风格、重新打光、添加或移除元素），同时保持原有运动。源视频最长 18 秒；编辑后的视频保持原长度。",
+    "display_name": "Luma Ray 3.2 视频编辑",
+    "inputs": {
+      "control_after_generate": {
+        "name": "生成后控制"
+      },
+      "prompt": {
+        "name": "提示词",
+        "tooltip": "描述期望的编辑效果。"
+      },
+      "resolution": {
+        "name": "分辨率"
+      },
+      "seed": {
+        "name": "种子",
+        "tooltip": "用于决定节点是否重新运行的种子；无论种子如何，结果都是非确定性的。"
+      },
+      "strength": {
+        "name": "强度",
+        "tooltip": "保留原视频与重新想象的程度。'auto' 由 Ray 3.2 自动选择；adher_* 保留最多，flex_* 平衡，reimagine_* 变化最大。"
+      },
+      "video": {
+        "name": "视频",
+        "tooltip": "要编辑的源视频。最长 18 秒。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
+  "LumaRay32VideoReframeNode": {
+    "description": "更改现有视频的宽高比，使用 Luma Ray 3.2 填充新暴露的画布区域。源视频最长 30 秒。按输出秒数计费。",
+    "display_name": "Luma Ray 3.2 视频重构",
+    "inputs": {
+      "aspect_ratio": {
+        "name": "aspect_ratio"
+      },
+      "control_after_generate": {
+        "name": "control after generate"
+      },
+      "prompt": {
+        "name": "prompt",
+        "tooltip": "描述如何填充新暴露的画布区域。"
+      },
+      "resolution": {
+        "name": "resolution"
+      },
+      "seed": {
+        "name": "seed",
+        "tooltip": "用于决定节点是否重新运行的种子；无论种子如何，结果都是非确定性的。"
+      },
+      "video": {
+        "name": "video",
+        "tooltip": "要重构的源视频。最长 30 秒。"
+      }
+    },
+    "outputs": {
+      "0": {
+        "tooltip": null
+      },
+      "1": {
+        "name": "generation_id",
+        "tooltip": null
+      }
+    }
+  },
   "LumaReferenceNode": {
     "description": "用于 Luma 生成图像节点，包含一张图片和权重。",
     "display_name": "Luma 参考",
@@ -14075,6 +14425,12 @@
       "audioUI": {
         "name": "音频UI"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "PreviewGaussianSplat": {
@@ -14130,6 +14486,11 @@
       "images": {
         "name": "图像"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "PreviewPointCloud": {
@@ -16925,6 +17286,12 @@
       "images": {
         "name": "图片"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAnimatedWEBP": {
@@ -16948,6 +17315,12 @@
       "quality": {
         "name": "质量"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveAudio": {
@@ -16962,6 +17335,12 @@
       "filename_prefix": {
         "name": "文件名前缀"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioAdvanced": {
@@ -16983,6 +17362,12 @@
         "name": "format",
         "tooltip": "保存音频的文件格式。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioMP3": {
@@ -17000,6 +17385,12 @@
       "quality": {
         "name": "质量"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveAudioOpus": {
@@ -17017,6 +17408,12 @@
       "quality": {
         "name": "质量"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "audio",
+        "tooltip": null
+      }
     }
   },
   "SaveGLB": {
@@ -17046,6 +17443,11 @@
         "name": "图片",
         "tooltip": "要保存的图像。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images"
+      }
     }
   },
   "SaveImageAdvanced": {
@@ -17070,6 +17472,12 @@
         "name": "图像",
         "tooltip": "要保存的图像。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "SaveImageDataSetToFolder": {
@@ -17137,6 +17545,11 @@
       "samples": {
         "name": "Latent"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "samples"
+      }
     }
   },
   "SaveLoRA": {
@@ -17167,6 +17580,12 @@
       "svg": {
         "name": "svg"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "svg",
+        "tooltip": null
+      }
     }
   },
   "SaveTrainingDataset": {
@@ -17211,6 +17630,12 @@
         "name": "视频",
         "tooltip": "要保存的视频。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "video",
+        "tooltip": null
+      }
     }
   },
   "SaveWEBM": {
@@ -17233,6 +17658,12 @@
         "name": "图像",
         "tooltip": "RGBA 图像将以 alpha 通道作为透明度保存（仅 vp9 编解码器支持）。"
       }
+    },
+    "outputs": {
+      "0": {
+        "name": "images",
+        "tooltip": null
+      }
     }
   },
   "ScaleROPE": {
@@ -21935,6 +22366,14 @@
       "model": {
         "name": "模型",
         "tooltip": "在采样过程中应用上下文窗口的模型。"
+      },
+      "retain_first_frame": {
+        "name": "retain_first_frame",
+        "tooltip": "在每个上下文窗口中保留第一个 I2V 帧（有助于保留初始参考）。"
+      },
+      "split_conds_to_windows": {
+        "name": "split_conds_to_windows",
+        "tooltip": "是否根据区域索引将多个条件（由 ConditionCombine 创建）拆分到每个窗口。"
       }
     },
     "outputs": {
diff --git a/src/platform/assets/components/AssetBrowserModal.vue b/src/platform/assets/components/AssetBrowserModal.vue
index 5dfdd28b38..85a79605f7 100644
--- a/src/platform/assets/components/AssetBrowserModal.vue
+++ b/src/platform/assets/components/AssetBrowserModal.vue
@@ -1,6 +1,7 @@
 <template>
   <BaseModalLayout
     v-model:right-panel-open="isRightPanelOpen"
+    data-testid="asset-browser-modal"
     data-component-id="AssetBrowserModal"
     class="size-full max-h-full max-w-full min-w-0"
     :content-title="displayTitle"
diff --git a/src/platform/assets/components/AssetCard.vue b/src/platform/assets/components/AssetCard.vue
index 9f1c96a158..82e76ed9ac 100644
--- a/src/platform/assets/components/AssetCard.vue
+++ b/src/platform/assets/components/AssetCard.vue
@@ -1,5 +1,6 @@
 <template>
   <div
+    data-testid="asset-card"
     data-component-id="AssetCard"
     :data-asset-id="asset.id"
     :aria-labelledby="titleId"
diff --git a/src/platform/assets/components/MediaAssetSelectionBar.stories.ts b/src/platform/assets/components/MediaAssetSelectionBar.stories.ts
new file mode 100644
index 0000000000..bab1471af7
--- /dev/null
+++ b/src/platform/assets/components/MediaAssetSelectionBar.stories.ts
@@ -0,0 +1,29 @@
+import type { Meta, StoryObj } from '@storybook/vue3-vite'
+
+import MediaAssetSelectionBar from './MediaAssetSelectionBar.vue'
+
+const meta: Meta<typeof MediaAssetSelectionBar> = {
+  title: 'Platform/Assets/MediaAssetSelectionBar',
+  component: MediaAssetSelectionBar,
+  decorators: [
+    () => ({
+      template:
+        '<div class="bg-base-background" style="position:relative;display:flex;flex-direction:column;justify-content:flex-end;height:480px;width:360px;"><story /></div>'
+    })
+  ]
+}
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+export const Default: Story = {
+  args: { count: 2, showDelete: true }
+}
+
+export const SingleSelection: Story = {
+  args: { count: 1, showDelete: true }
+}
+
+export const WithoutDelete: Story = {
+  args: { count: 3, showDelete: false }
+}
diff --git a/src/platform/assets/components/MediaAssetSelectionBar.test.ts b/src/platform/assets/components/MediaAssetSelectionBar.test.ts
new file mode 100644
index 0000000000..243ba92162
--- /dev/null
+++ b/src/platform/assets/components/MediaAssetSelectionBar.test.ts
@@ -0,0 +1,65 @@
+import { render, screen } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { describe, expect, it } from 'vitest'
+import { createI18n } from 'vue-i18n'
+
+import MediaAssetSelectionBar from '@/platform/assets/components/MediaAssetSelectionBar.vue'
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages: {
+    en: {
+      mediaAsset: {
+        selection: {
+          deselectAll: 'Deselect all',
+          downloadSelected: 'Download',
+          deleteSelected: 'Delete',
+          selectedCount: '{count} selected'
+        }
+      }
+    }
+  }
+})
+
+function renderBar(
+  props: { count: number; showDelete?: boolean } = { count: 2 }
+) {
+  return render(MediaAssetSelectionBar, {
+    props,
+    global: { plugins: [i18n], directives: { tooltip: {} } }
+  })
+}
+
+describe('MediaAssetSelectionBar', () => {
+  it('renders the selected count label', () => {
+    renderBar({ count: 3 })
+    expect(screen.getByText('3 selected')).toBeInTheDocument()
+  })
+
+  it('emits deselect when the close button is clicked', async () => {
+    const { emitted } = renderBar({ count: 2 })
+    await userEvent.click(screen.getByRole('button', { name: 'Deselect all' }))
+    expect(emitted().deselect).toHaveLength(1)
+  })
+
+  it('emits download when the download button is clicked', async () => {
+    const { emitted } = renderBar({ count: 2 })
+    await userEvent.click(screen.getByRole('button', { name: 'Download' }))
+    expect(emitted().download).toHaveLength(1)
+  })
+
+  it('emits delete when the delete button is clicked', async () => {
+    const { emitted } = renderBar({ count: 2 })
+    await userEvent.click(screen.getByRole('button', { name: 'Delete' }))
+    expect(emitted().delete).toHaveLength(1)
+  })
+
+  it('hides the delete button when showDelete is false', () => {
+    renderBar({ count: 2, showDelete: false })
+    expect(
+      screen.queryByRole('button', { name: 'Delete' })
+    ).not.toBeInTheDocument()
+    expect(screen.getByRole('button', { name: 'Download' })).toBeInTheDocument()
+  })
+})
diff --git a/src/platform/assets/components/MediaAssetSelectionBar.vue b/src/platform/assets/components/MediaAssetSelectionBar.vue
new file mode 100644
index 0000000000..bb8ce22a47
--- /dev/null
+++ b/src/platform/assets/components/MediaAssetSelectionBar.vue
@@ -0,0 +1,77 @@
+<template>
+  <div class="relative mx-2">
+    <div
+      data-testid="assets-selection-bar"
+      class="absolute bottom-6 left-1/2 z-40 flex w-full max-w-78 -translate-x-1/2 items-center gap-2 rounded-lg bg-base-foreground p-2 text-base-background shadow-interface"
+    >
+      <Button
+        v-tooltip.top="{
+          value: $t('mediaAsset.selection.deselectAll'),
+          showDelay: 300
+        }"
+        variant="inverted"
+        size="icon-lg"
+        type="button"
+        data-testid="assets-deselect-selected"
+        :aria-label="$t('mediaAsset.selection.deselectAll')"
+        class="rounded-lg hover:bg-base-background/10"
+        @click="emit('deselect')"
+      >
+        <i class="icon-[lucide--x] size-4" />
+      </Button>
+      <span class="pr-6 text-sm font-bold whitespace-nowrap tabular-nums">
+        {{ $t('mediaAsset.selection.selectedCount', { count }) }}
+      </span>
+      <div class="ml-auto flex shrink-0 items-center gap-1">
+        <Button
+          v-tooltip.top="{
+            value: $t('mediaAsset.selection.downloadSelected'),
+            showDelay: 300
+          }"
+          variant="inverted"
+          size="icon-lg"
+          type="button"
+          data-testid="assets-download-selected"
+          :aria-label="$t('mediaAsset.selection.downloadSelected')"
+          class="rounded-lg hover:bg-base-background/10"
+          @click="emit('download')"
+        >
+          <i class="icon-[lucide--download] size-4" />
+        </Button>
+        <template v-if="showDelete">
+          <span class="h-6 w-px bg-base-background/20" aria-hidden="true" />
+          <Button
+            v-tooltip.top="{
+              value: $t('mediaAsset.selection.deleteSelected'),
+              showDelay: 300
+            }"
+            variant="inverted"
+            size="icon-lg"
+            type="button"
+            data-testid="assets-delete-selected"
+            :aria-label="$t('mediaAsset.selection.deleteSelected')"
+            class="rounded-lg hover:bg-base-background/10"
+            @click="emit('delete')"
+          >
+            <i class="icon-[lucide--trash-2] size-4" />
+          </Button>
+        </template>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import Button from '@/components/ui/button/Button.vue'
+
+const { count, showDelete = true } = defineProps<{
+  count: number
+  showDelete?: boolean
+}>()
+
+const emit = defineEmits<{
+  deselect: []
+  download: []
+  delete: []
+}>()
+</script>
diff --git a/src/platform/assets/composables/useMediaAssetActions.test.ts b/src/platform/assets/composables/useMediaAssetActions.test.ts
index e4fa6c50d1..e4cb63274b 100644
--- a/src/platform/assets/composables/useMediaAssetActions.test.ts
+++ b/src/platform/assets/composables/useMediaAssetActions.test.ts
@@ -10,6 +10,7 @@ import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { MediaAssetKey } from '@/platform/assets/schemas/mediaAssetSchema'
 import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
 import type { AssetMeta } from '@/platform/assets/schemas/mediaAssetSchema'
+import type * as outputAssetUtilModule from '../utils/outputAssetUtil'
 import { useMediaAssetActions } from './useMediaAssetActions'
 
 // Use vi.hoisted to create a mutable reference for isCloud
@@ -145,6 +146,17 @@ vi.mock('../schemas/assetMetadataSchema', () => ({
   getOutputAssetMetadata: mockGetOutputAssetMetadata
 }))
 
+const mockResolveOutputAssetItems = vi.hoisted(() =>
+  vi.fn().mockResolvedValue([])
+)
+vi.mock('../utils/outputAssetUtil', async (importOriginal) => {
+  const actual = await importOriginal<typeof outputAssetUtilModule>()
+  return {
+    ...actual,
+    resolveOutputAssetItems: mockResolveOutputAssetItems
+  }
+})
+
 const mockDeleteAsset = vi.hoisted(() => vi.fn())
 const mockCreateAssetExport = vi.hoisted(() =>
   vi.fn().mockResolvedValue({ task_id: 'test-task-id', status: 'pending' })
@@ -283,6 +295,8 @@ describe('useMediaAssetActions', () => {
     mockGetOutputAssetMetadata.mockReset()
     mockGetOutputAssetMetadata.mockReturnValue(null)
     mockGetAssetType.mockReset()
+    mockResolveOutputAssetItems.mockReset()
+    mockResolveOutputAssetItems.mockResolvedValue([])
   })
 
   describe('addWorkflow', () => {
@@ -582,6 +596,236 @@ describe('useMediaAssetActions', () => {
     })
   })
 
+  describe('downloadAssets - OSS multi-output expansion', () => {
+    beforeEach(() => {
+      mockIsCloud.value = false
+      mockGetAssetType.mockReturnValue('output')
+      mockGetOutputAssetMetadata.mockImplementation(
+        (meta: Record<string, unknown> | undefined) =>
+          meta && 'jobId' in meta ? meta : null
+      )
+    })
+
+    function createOutputAsset(
+      id: string,
+      name: string,
+      jobId: string,
+      outputCount?: number,
+      previewUrl?: string
+    ): AssetItem {
+      return createMockAsset({
+        id,
+        name,
+        tags: ['output'],
+        preview_url: previewUrl ?? `https://example.com/${name}`,
+        user_metadata: { jobId, nodeId: '1', subfolder: '', outputCount }
+      })
+    }
+
+    it('expands a grouped asset into individual downloads', async () => {
+      const grouped = createOutputAsset(
+        'g1',
+        'cover.png',
+        'job1',
+        3,
+        'https://example.com/cover.png'
+      )
+      mockResolveOutputAssetItems.mockResolvedValueOnce([
+        createOutputAsset('g1-out1', 'out1.png', 'job1'),
+        createOutputAsset('g1-out2', 'out2.png', 'job1'),
+        createOutputAsset('g1-out3', 'out3.png', 'job1')
+      ])
+
+      const actions = useMediaAssetActions()
+      actions.downloadAssets([grouped])
+
+      await vi.waitFor(() => {
+        expect(mockDownloadFile).toHaveBeenCalledTimes(3)
+      })
+
+      expect(mockResolveOutputAssetItems).toHaveBeenCalledTimes(1)
+      expect(mockResolveOutputAssetItems).toHaveBeenCalledWith(
+        expect.objectContaining({ jobId: 'job1', outputCount: 3 }),
+        expect.objectContaining({ createdAt: expect.any(String) })
+      )
+      expect(mockDownloadFile).toHaveBeenNthCalledWith(
+        1,
+        'https://example.com/out1.png',
+        'out1.png'
+      )
+      expect(mockDownloadFile).toHaveBeenNthCalledWith(
+        2,
+        'https://example.com/out2.png',
+        'out2.png'
+      )
+      expect(mockDownloadFile).toHaveBeenNthCalledWith(
+        3,
+        'https://example.com/out3.png',
+        'out3.png'
+      )
+      expect(mockCreateAssetExport).not.toHaveBeenCalled()
+    })
+
+    it('mixes grouped and single-output assets in one selection', async () => {
+      const grouped = createOutputAsset('g1', 'cover.png', 'job1', 2)
+      const single = createOutputAsset('s1', 'solo.png', 'job2')
+
+      mockResolveOutputAssetItems.mockResolvedValueOnce([
+        createOutputAsset('g1-a', 'a.png', 'job1'),
+        createOutputAsset('g1-b', 'b.png', 'job1')
+      ])
+
+      const actions = useMediaAssetActions()
+      actions.downloadAssets([grouped, single])
+
+      await vi.waitFor(() => {
+        expect(mockDownloadFile).toHaveBeenCalledTimes(3)
+      })
+
+      expect(mockResolveOutputAssetItems).toHaveBeenCalledTimes(1)
+      const filenames = mockDownloadFile.mock.calls.map((call) => call[1])
+      expect(filenames).toEqual(['a.png', 'b.png', 'solo.png'])
+    })
+
+    it('falls back to the original asset when resolveOutputAssetItems returns empty', async () => {
+      const grouped = createOutputAsset(
+        'g1',
+        'cover.png',
+        'job1',
+        3,
+        'https://example.com/cover.png'
+      )
+      mockResolveOutputAssetItems.mockResolvedValueOnce([])
+
+      const actions = useMediaAssetActions()
+      actions.downloadAssets([grouped])
+
+      await vi.waitFor(() => {
+        expect(mockDownloadFile).toHaveBeenCalledTimes(1)
+      })
+      expect(mockDownloadFile).toHaveBeenCalledWith(
+        'https://example.com/cover.png',
+        'cover.png'
+      )
+    })
+
+    it('does not call resolveOutputAssetItems when no grouped assets are selected', () => {
+      const single1 = createOutputAsset(
+        's1',
+        'a.png',
+        'job1',
+        undefined,
+        'https://example.com/a.png'
+      )
+      const single2 = createOutputAsset(
+        's2',
+        'b.png',
+        'job2',
+        1,
+        'https://example.com/b.png'
+      )
+
+      const actions = useMediaAssetActions()
+      actions.downloadAssets([single1, single2])
+
+      expect(mockResolveOutputAssetItems).not.toHaveBeenCalled()
+      expect(mockDownloadFile).toHaveBeenCalledTimes(2)
+    })
+
+    it('deduplicates downloads when an expanded child is also selected alongside its parent', async () => {
+      const grouped = createOutputAsset('job1-cover', 'cover.png', 'job1', 3)
+      const child = createMockAsset({
+        id: 'job1-child-a',
+        name: 'out1.png',
+        tags: ['output'],
+        preview_url: 'https://example.com/out1.png',
+        user_metadata: { jobId: 'job1', nodeId: '1', subfolder: '' }
+      })
+
+      mockResolveOutputAssetItems.mockResolvedValueOnce([
+        createMockAsset({
+          id: 'job1-child-a',
+          name: 'out1.png',
+          tags: ['output'],
+          preview_url: 'https://example.com/out1.png',
+          user_metadata: { jobId: 'job1', nodeId: '1', subfolder: '' }
+        }),
+        createMockAsset({
+          id: 'job1-child-b',
+          name: 'out2.png',
+          tags: ['output'],
+          preview_url: 'https://example.com/out2.png',
+          user_metadata: { jobId: 'job1', nodeId: '1', subfolder: '' }
+        })
+      ])
+
+      const actions = useMediaAssetActions()
+      actions.downloadAssets([grouped, child])
+
+      await vi.waitFor(() => {
+        expect(mockDownloadFile).toHaveBeenCalledTimes(2)
+      })
+
+      const filenames = mockDownloadFile.mock.calls.map((call) => call[1])
+      expect(filenames).toEqual(['out1.png', 'out2.png'])
+    })
+
+    it('falls back to the preview download when resolveOutputAssetItems rejects', async () => {
+      const grouped = createOutputAsset(
+        'g1',
+        'cover.png',
+        'job1',
+        3,
+        'https://example.com/cover.png'
+      )
+      mockResolveOutputAssetItems.mockRejectedValueOnce(new Error('boom'))
+
+      const actions = useMediaAssetActions()
+      actions.downloadAssets([grouped])
+
+      await vi.waitFor(() => {
+        expect(mockDownloadFile).toHaveBeenCalledTimes(1)
+      })
+      expect(mockDownloadFile).toHaveBeenCalledWith(
+        'https://example.com/cover.png',
+        'cover.png'
+      )
+    })
+
+    it('still downloads resolvable assets when one grouped asset fails to expand', async () => {
+      const failingGrouped = createOutputAsset(
+        'g1',
+        'cover1.png',
+        'job1',
+        3,
+        'https://example.com/cover1.png'
+      )
+      const okGrouped = createOutputAsset('g2', 'cover2.png', 'job2', 2)
+
+      mockResolveOutputAssetItems.mockImplementation(
+        (metadata: { jobId: string }) => {
+          if (metadata.jobId === 'job1') {
+            return Promise.reject(new Error('job1 lookup failed'))
+          }
+          return Promise.resolve([
+            createOutputAsset('g2-a', 'out2a.png', 'job2'),
+            createOutputAsset('g2-b', 'out2b.png', 'job2')
+          ])
+        }
+      )
+
+      const actions = useMediaAssetActions()
+      actions.downloadAssets([failingGrouped, okGrouped])
+
+      await vi.waitFor(() => {
+        expect(mockDownloadFile).toHaveBeenCalledTimes(3)
+      })
+
+      const filenames = mockDownloadFile.mock.calls.map((call) => call[1])
+      expect(filenames).toEqual(['cover1.png', 'out2a.png', 'out2b.png'])
+    })
+  })
+
   describe('downloadAssets - cloud zip filters', () => {
     beforeEach(() => {
       mockIsCloud.value = true
diff --git a/src/platform/assets/composables/useMediaAssetActions.ts b/src/platform/assets/composables/useMediaAssetActions.ts
index b46e60e41f..eaa714fad0 100644
--- a/src/platform/assets/composables/useMediaAssetActions.ts
+++ b/src/platform/assets/composables/useMediaAssetActions.ts
@@ -27,7 +27,10 @@ import { getAssetUrl } from '../utils/assetUrlUtil'
 import { clearDeletedAssetWidgetValues } from '../utils/clearDeletedAssetWidgetValues'
 import { clearNodePreviewCacheForValues } from '../utils/clearNodePreviewCacheForValues'
 import { markDeletedAssetsAsMissingMedia } from '../utils/markDeletedAssetsAsMissingMedia'
-import { getAssetOutputCount } from '../utils/outputAssetUtil'
+import {
+  getAssetOutputCount,
+  resolveOutputAssetItems
+} from '../utils/outputAssetUtil'
 import { createAnnotatedPath } from '@/utils/createAnnotatedPath'
 import { detectNodeTypeFromFilename } from '@/utils/loaderNodeUtil'
 import { isResultItemType } from '@/utils/typeGuardUtil'
@@ -109,8 +112,9 @@ export function useMediaAssetActions() {
    * Download one or more assets.
    * In cloud mode, creates a ZIP export via the backend when called with
    * 2+ assets or with any asset whose job has `outputCount > 1`.
-   * Falls back to direct downloads in OSS mode and for single single-output
-   * assets. With no argument, uses the asset from `MediaAssetKey` context.
+   * In OSS mode, downloads each file directly, expanding grouped assets
+   * (`outputCount > 1`) into their individual outputs.
+   * With no argument, uses the asset from `MediaAssetKey` context.
    */
   const downloadAssets = (assets?: AssetItem[]) => {
     const targetAssets =
@@ -127,13 +131,13 @@ export function useMediaAssetActions() {
       return
     }
 
-    try {
-      targetAssets.forEach((asset) => {
-        const filename = getAssetDisplayName(asset)
-        const downloadUrl = asset.preview_url || getAssetUrl(asset)
-        downloadFile(downloadUrl, filename)
-      })
+    if (hasMultiOutputJobs) {
+      void downloadAssetsIndividually(targetAssets)
+      return
+    }
 
+    try {
+      targetAssets.forEach((asset) => downloadSingleAsset(asset))
       toast.add({
         severity: 'success',
         summary: t('g.success'),
@@ -150,6 +154,66 @@ export function useMediaAssetActions() {
     }
   }
 
+  function downloadSingleAsset(asset: AssetItem) {
+    const filename = getAssetDisplayName(asset)
+    const downloadUrl = asset.preview_url || getAssetUrl(asset)
+    downloadFile(downloadUrl, filename)
+  }
+
+  async function expandAssetForDownload(
+    asset: AssetItem
+  ): Promise<AssetItem[]> {
+    const metadata = getOutputAssetMetadata(asset.user_metadata)
+    if (
+      !metadata ||
+      typeof metadata.outputCount !== 'number' ||
+      metadata.outputCount <= 1
+    ) {
+      return [asset]
+    }
+
+    try {
+      const resolved = await resolveOutputAssetItems(metadata, {
+        createdAt: asset.created_at
+      })
+      return resolved.length > 0 ? resolved : [asset]
+    } catch (error) {
+      console.error('Failed to expand grouped asset for download:', error)
+      return [asset]
+    }
+  }
+
+  async function downloadAssetsIndividually(assets: AssetItem[]) {
+    try {
+      const expanded = await Promise.all(assets.map(expandAssetForDownload))
+      const seenAssetIds = new Set<string>()
+      const filesToDownload = expanded.flat().filter((asset) => {
+        if (seenAssetIds.has(asset.id)) return false
+        seenAssetIds.add(asset.id)
+        return true
+      })
+
+      filesToDownload.forEach((asset) => downloadSingleAsset(asset))
+
+      toast.add({
+        severity: 'success',
+        summary: t('g.success'),
+        detail: t(
+          'mediaAsset.selection.downloadsStarted',
+          filesToDownload.length
+        ),
+        life: 2000
+      })
+    } catch (error) {
+      console.error('Failed to download assets:', error)
+      toast.add({
+        severity: 'error',
+        summary: t('g.error'),
+        detail: t('g.failedToDownloadImage')
+      })
+    }
+  }
+
   async function downloadAssetsAsZip(assets: AssetItem[]) {
     const assetExportStore = useAssetExportStore()
 
diff --git a/src/platform/assets/mappings/modelNodeMappings.ts b/src/platform/assets/mappings/modelNodeMappings.ts
index 9182e55e23..1c03660c2a 100644
--- a/src/platform/assets/mappings/modelNodeMappings.ts
+++ b/src/platform/assets/mappings/modelNodeMappings.ts
@@ -6,7 +6,7 @@
  * input key where the model name is inserted.
  *
  * An empty key ('') means the node auto-loads models without a widget
- * selector (createModelNodeFromAsset skips widget assignment).
+ * selector, so no widget value is assigned when the node is added.
  *
  * Hierarchical fallback is handled by the store: "a/b/c" tries
  * "a/b/c" → "a/b" → "a", so registering a parent directory covers
diff --git a/src/platform/assets/utils/createAssetWidget.test.ts b/src/platform/assets/utils/createAssetWidget.test.ts
new file mode 100644
index 0000000000..7032d1a330
--- /dev/null
+++ b/src/platform/assets/utils/createAssetWidget.test.ts
@@ -0,0 +1,169 @@
+import { createTestingPinia } from '@pinia/testing'
+import { setActivePinia } from 'pinia'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type {
+  IBaseWidget,
+  IWidgetAssetOptions
+} from '@/lib/litegraph/src/types/widgets'
+import { useAssetBrowserDialog } from '@/platform/assets/composables/useAssetBrowserDialog'
+import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
+
+import { createAssetWidget } from './createAssetWidget'
+
+vi.mock('@/platform/assets/composables/useAssetBrowserDialog', () => {
+  const show = vi.fn()
+  const browse = vi.fn()
+  return {
+    useAssetBrowserDialog: () => ({ show, browse })
+  }
+})
+
+interface HostAssetWidget extends IBaseWidget<
+  string,
+  'asset',
+  IWidgetAssetOptions
+> {
+  node: LGraphNode
+}
+
+type OnWidgetChanged = NonNullable<LGraphNode['onWidgetChanged']>
+
+function checkpointAsset(name: string): AssetItem {
+  return {
+    id: `asset-${name}`,
+    name,
+    hash: 'checkpoint-hash',
+    mime_type: 'application/octet-stream',
+    tags: []
+  }
+}
+
+function createAssetWidgetNode() {
+  const node = new LGraphNode('TestNode')
+  const onWidgetChanged = vi.fn<OnWidgetChanged>()
+  node.onWidgetChanged = onWidgetChanged
+
+  return { node, onWidgetChanged }
+}
+
+function assertAssetOptions(
+  options: unknown
+): asserts options is IWidgetAssetOptions {
+  if (!options || typeof options !== 'object') {
+    throw new Error('Expected asset widget options')
+  }
+  if (!('openModal' in options) || typeof options.openModal !== 'function') {
+    throw new Error('Expected asset widget options')
+  }
+}
+
+function firstShowOptions() {
+  const showOptions = vi.mocked(useAssetBrowserDialog().show).mock.calls[0]?.[0]
+  if (!showOptions) {
+    throw new Error('Expected the asset browser dialog to open')
+  }
+  return showOptions
+}
+
+describe('createAssetWidget', () => {
+  let captureCanvasState: ReturnType<typeof vi.fn>
+
+  beforeEach(() => {
+    vi.resetAllMocks()
+    captureCanvasState = vi.fn()
+    setActivePinia(
+      createTestingPinia({
+        stubActions: false,
+        initialState: {
+          workflow: {
+            activeWorkflow: {
+              changeTracker: { captureCanvasState }
+            }
+          }
+        }
+      })
+    )
+  })
+
+  it('preserves regular asset widget change handling for the owning widget', async () => {
+    const { node, onWidgetChanged } = createAssetWidgetNode()
+    const widget = createAssetWidget({
+      node,
+      widgetName: 'ckpt_name',
+      nodeTypeForBrowser: 'CheckpointLoaderSimple',
+      inputNameForBrowser: 'ckpt_name',
+      defaultValue: 'fake_model.safetensors'
+    })
+
+    assertAssetOptions(widget.options)
+    await widget.options.openModal(widget)
+    const showOptions = firstShowOptions()
+
+    expect(showOptions).toMatchObject({
+      nodeType: 'CheckpointLoaderSimple',
+      inputName: 'ckpt_name',
+      currentValue: 'fake_model.safetensors'
+    })
+
+    showOptions.onAssetSelected?.(checkpointAsset('real_model.safetensors'))
+
+    expect(widget.value).toBe('real_model.safetensors')
+    expect(onWidgetChanged).toHaveBeenCalledWith(
+      'ckpt_name',
+      'real_model.safetensors',
+      'fake_model.safetensors',
+      widget
+    )
+    expect(captureCanvasState).toHaveBeenCalledOnce()
+  })
+
+  it('commits cloned asset modal selections through the promoted host widget', async () => {
+    const { node, onWidgetChanged: sourceOnWidgetChanged } =
+      createAssetWidgetNode()
+    const sourceWidget = createAssetWidget({
+      node,
+      widgetName: 'ckpt_name',
+      nodeTypeForBrowser: 'CheckpointLoaderSimple',
+      inputNameForBrowser: 'ckpt_name',
+      defaultValue: 'fake_model.safetensors'
+    })
+    assertAssetOptions(sourceWidget.options)
+    const hostCallback = vi.fn<NonNullable<IBaseWidget['callback']>>()
+    const hostNode = new LGraphNode('PromotedHostNode')
+    const hostOnWidgetChanged = vi.fn<OnWidgetChanged>()
+    hostNode.onWidgetChanged = hostOnWidgetChanged
+    const hostWidget: HostAssetWidget = {
+      type: 'asset',
+      name: 'host_ckpt_name',
+      value: 'fake_model.safetensors',
+      callback: hostCallback,
+      options: sourceWidget.options,
+      node: hostNode,
+      y: 0
+    }
+
+    await sourceWidget.options.openModal(hostWidget)
+    const showOptions = firstShowOptions()
+
+    expect(showOptions).toMatchObject({
+      nodeType: 'CheckpointLoaderSimple',
+      inputName: 'ckpt_name',
+      currentValue: 'fake_model.safetensors'
+    })
+
+    showOptions.onAssetSelected?.(checkpointAsset('real_model.safetensors'))
+
+    expect(sourceOnWidgetChanged).not.toHaveBeenCalled()
+    expect(hostWidget.value).toBe('real_model.safetensors')
+    expect(hostCallback).toHaveBeenCalledWith('real_model.safetensors')
+    expect(hostOnWidgetChanged).toHaveBeenCalledWith(
+      'host_ckpt_name',
+      'real_model.safetensors',
+      'fake_model.safetensors',
+      hostWidget
+    )
+    expect(captureCanvasState).toHaveBeenCalledOnce()
+  })
+})
diff --git a/src/platform/assets/utils/createAssetWidget.ts b/src/platform/assets/utils/createAssetWidget.ts
index 2adcc4585a..da220721b8 100644
--- a/src/platform/assets/utils/createAssetWidget.ts
+++ b/src/platform/assets/utils/createAssetWidget.ts
@@ -12,8 +12,11 @@ import {
   assetItemSchema
 } from '@/platform/assets/schemas/assetSchema'
 import { useToastStore } from '@/platform/updates/common/toastStore'
+import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
 import { getAssetFilename } from '@/platform/assets/utils/assetMetadataUtils'
 
+type WidgetWithNode = IBaseWidget & { node: LGraphNode }
+
 interface CreateAssetWidgetParams {
   /** The node to add the widget to */
   node: LGraphNode
@@ -25,34 +28,26 @@ interface CreateAssetWidgetParams {
   inputNameForBrowser?: string
   /** Default value for the widget */
   defaultValue?: string
-  /** Callback when widget value changes */
-  onValueChange?: (
-    widget: IBaseWidget,
-    newValue: string,
-    oldValue: unknown
-  ) => void
 }
 
-/**
- * Creates an asset widget that opens the Asset Browser dialog for model selection.
- * Used by both regular nodes (via useComboWidget) and PrimitiveNode.
- *
- * @param params - Configuration for the asset widget
- * @returns The created asset widget
- */
-export function createAssetWidget(
-  params: CreateAssetWidgetParams
-): IBaseWidget {
-  const {
-    node,
-    widgetName,
-    nodeTypeForBrowser,
-    inputNameForBrowser,
-    defaultValue,
-    onValueChange
-  } = params
+interface CreateAssetWidgetOptionsParams {
+  widgetName: string
+  nodeTypeForBrowser: string
+  inputNameForBrowser?: string
+}
 
-  const displayLabel = defaultValue ?? t('widgets.selectModel')
+function hasOwnerNode(widget: IBaseWidget): widget is WidgetWithNode {
+  return (
+    'node' in widget && typeof widget.node === 'object' && widget.node !== null
+  )
+}
+
+function createAssetWidgetOptions({
+  widgetName,
+  nodeTypeForBrowser,
+  inputNameForBrowser
+}: CreateAssetWidgetOptionsParams): IWidgetAssetOptions {
+  const inputName = inputNameForBrowser ?? widgetName
   const assetBrowserDialog = useAssetBrowserDialog()
 
   async function openModal(widget: IBaseWidget) {
@@ -60,8 +55,8 @@ export function createAssetWidget(
 
     await assetBrowserDialog.show({
       nodeType: nodeTypeForBrowser,
-      inputName: inputNameForBrowser ?? widgetName,
-      currentValue: widget.value as string,
+      inputName,
+      currentValue: String(widget.value ?? ''),
       onAssetSelected: (asset) => {
         const validatedAsset = assetItemSchema.safeParse(asset)
 
@@ -98,15 +93,44 @@ export function createAssetWidget(
 
         const oldValue = widget.value
         widget.value = validatedFilename.data
-        onValueChange?.(widget, validatedFilename.data, oldValue)
+        widget.callback?.(widget.value)
+        if (hasOwnerNode(widget)) {
+          widget.node.onWidgetChanged?.(
+            widget.name,
+            validatedFilename.data,
+            oldValue,
+            widget
+          )
+        }
+        if (oldValue !== validatedFilename.data) {
+          useWorkflowStore().activeWorkflow?.changeTracker?.captureCanvasState()
+        }
       }
     })
   }
 
-  const options: IWidgetAssetOptions = {
+  return {
     openModal,
     nodeType: nodeTypeForBrowser
   }
+}
 
+export function createAssetWidget(
+  params: CreateAssetWidgetParams
+): IBaseWidget {
+  const {
+    node,
+    widgetName,
+    nodeTypeForBrowser,
+    inputNameForBrowser,
+    defaultValue
+  } = params
+
+  const displayLabel = defaultValue ?? t('widgets.selectModel')
+  const options = createAssetWidgetOptions({
+    widgetName,
+    nodeTypeForBrowser,
+    inputNameForBrowser
+  })
   return node.addWidget('asset', widgetName, displayLabel, () => {}, options)
 }
diff --git a/src/platform/assets/utils/createModelNodeFromAsset.test.ts b/src/platform/assets/utils/createModelNodeFromAsset.test.ts
deleted file mode 100644
index 360bac07fd..0000000000
--- a/src/platform/assets/utils/createModelNodeFromAsset.test.ts
+++ /dev/null
@@ -1,439 +0,0 @@
-// oxlint-disable no-misused-spread
-import { beforeEach, describe, expect, it, vi } from 'vitest'
-import { markRaw } from 'vue'
-import type { Raw } from 'vue'
-
-import type { LGraphNode, Subgraph } from '@/lib/litegraph/src/litegraph'
-import { LiteGraph } from '@/lib/litegraph/src/litegraph'
-import type * as LitegraphModule from '@/lib/litegraph/src/litegraph'
-import type * as ModelToNodeStoreModule from '@/stores/modelToNodeStore'
-import type * as WorkflowStoreModule from '@/platform/workflow/management/stores/workflowStore'
-import type * as LitegraphServiceModule from '@/services/litegraphService'
-import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
-import { createModelNodeFromAsset } from '@/platform/assets/utils/createModelNodeFromAsset'
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
-import { app } from '@/scripts/app'
-import { useLitegraphService } from '@/services/litegraphService'
-import { useModelToNodeStore } from '@/stores/modelToNodeStore'
-
-// Mock dependencies
-vi.mock('@/scripts/api', () => ({
-  api: {
-    apiURL: vi.fn((path: string) => `http://localhost:8188${path}`)
-  }
-}))
-vi.mock('@/stores/modelToNodeStore', async (importOriginal) => {
-  const actual = await importOriginal<typeof ModelToNodeStoreModule>()
-  return {
-    ...actual,
-    useModelToNodeStore: vi.fn()
-  }
-})
-vi.mock(
-  '@/platform/workflow/management/stores/workflowStore',
-  async (importOriginal) => {
-    const actual = await importOriginal<typeof WorkflowStoreModule>()
-    return {
-      ...actual,
-      useWorkflowStore: vi.fn()
-    }
-  }
-)
-vi.mock('@/services/litegraphService', async (importOriginal) => {
-  const actual = await importOriginal<typeof LitegraphServiceModule>()
-  return {
-    ...actual,
-    useLitegraphService: vi.fn()
-  }
-})
-vi.mock('@/lib/litegraph/src/litegraph', async (importOriginal) => {
-  const actual = await importOriginal<typeof LitegraphModule>()
-  return {
-    ...actual,
-    LiteGraph: {
-      ...actual.LiteGraph,
-      createNode: vi.fn()
-    }
-  }
-})
-vi.mock('@/scripts/app', () => ({
-  app: {
-    canvas: {
-      graph: {
-        add: vi.fn()
-      }
-    }
-  }
-}))
-function createMockAsset(overrides: Partial<AssetItem> = {}): AssetItem {
-  return {
-    id: 'asset-123',
-    name: 'test-model.safetensors',
-    size: 1024,
-    created_at: '2025-10-01T00:00:00Z',
-    tags: ['models', 'checkpoints'],
-    user_metadata: {
-      filename: 'models/checkpoints/test-model.safetensors'
-    },
-    ...overrides
-  }
-}
-async function createMockNode(overrides?: {
-  widgetName?: string
-  widgetValue?: string
-  hasWidgets?: boolean
-}): Promise<LGraphNode> {
-  const {
-    widgetName = 'ckpt_name',
-    widgetValue = '',
-    hasWidgets = true
-  } = overrides || {}
-
-  const { LGraphNode: ActualLGraphNode } = await vi.importActual<
-    typeof LitegraphModule
-  >('@/lib/litegraph/src/litegraph')
-
-  if (!hasWidgets) {
-    return Object.create(ActualLGraphNode.prototype)
-  }
-
-  type Widget = NonNullable<LGraphNode['widgets']>[number]
-  const widget: Pick<Widget, 'name' | 'value' | 'type' | 'options' | 'y'> = {
-    name: widgetName,
-    value: widgetValue,
-    type: 'string',
-    options: {},
-    y: 0
-  }
-
-  return Object.create(ActualLGraphNode.prototype, {
-    widgets: { value: [widget], writable: true }
-  })
-}
-function createMockNodeProvider(
-  overrides: {
-    nodeDef?: { name: string; display_name: string }
-    key?: string
-  } = {}
-) {
-  return {
-    nodeDef: {
-      name: 'CheckpointLoaderSimple',
-      display_name: 'Load Checkpoint',
-      ...overrides.nodeDef
-    },
-    key: overrides.key ?? 'ckpt_name'
-  }
-}
-/**
- * Configures all mocked dependencies with sensible defaults.
- * Uses semantic parameters for clearer test intent.
- * For error paths or edge cases, pass null values or specific overrides.
- */
-async function setupMocks(
-  overrides: {
-    nodeProvider?: ReturnType<typeof createMockNodeProvider> | null
-    canvasCenter?: [number, number]
-    activeSubgraph?: Raw<Subgraph>
-    createdNode?: Awaited<ReturnType<typeof createMockNode>> | null
-  } = {}
-) {
-  const {
-    nodeProvider = createMockNodeProvider(),
-    canvasCenter = [100, 200],
-    activeSubgraph,
-    createdNode = await createMockNode()
-  } = overrides
-
-  vi.mocked(useModelToNodeStore).mockReturnValue({
-    ...useModelToNodeStore(),
-    getNodeProvider: vi.fn().mockReturnValue(nodeProvider)
-  })
-
-  vi.mocked(useLitegraphService).mockReturnValue({
-    ...useLitegraphService(),
-    getCanvasCenter: vi.fn().mockReturnValue(canvasCenter)
-  })
-
-  vi.mocked(useWorkflowStore).mockReturnValue({
-    ...useWorkflowStore(),
-    activeSubgraph,
-    isSubgraphActive: !!activeSubgraph
-  })
-  vi.mocked(LiteGraph.createNode).mockReturnValue(createdNode)
-}
-describe('createModelNodeFromAsset', () => {
-  beforeEach(() => {
-    vi.clearAllMocks()
-    vi.spyOn(console, 'warn').mockImplementation(() => {})
-  })
-  describe('when creating nodes from valid assets', () => {
-    it('should create the appropriate loader node for the asset category', async () => {
-      const asset = createMockAsset()
-      await setupMocks()
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(true)
-      if (result.success) {
-        expect(
-          vi.mocked(useModelToNodeStore)().getNodeProvider
-        ).toHaveBeenCalledWith('checkpoints')
-        expect(LiteGraph.createNode).toHaveBeenCalledWith(
-          'CheckpointLoaderSimple',
-          'Load Checkpoint',
-          { pos: [100, 200] }
-        )
-      }
-    })
-    it('should place node at canvas center by default', async () => {
-      const asset = createMockAsset()
-      await setupMocks({
-        canvasCenter: [150, 250]
-      })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(true)
-      expect(
-        vi.mocked(useLitegraphService)().getCanvasCenter
-      ).toHaveBeenCalled()
-      expect(LiteGraph.createNode).toHaveBeenCalledWith(
-        'CheckpointLoaderSimple',
-        'Load Checkpoint',
-        { pos: [150, 250] }
-      )
-    })
-    it('should place node at specified position when position is provided', async () => {
-      const asset = createMockAsset()
-      await setupMocks()
-      const result = createModelNodeFromAsset(asset, { position: [300, 400] })
-      expect(result.success).toBe(true)
-      expect(
-        vi.mocked(useLitegraphService)().getCanvasCenter
-      ).not.toHaveBeenCalled()
-      expect(LiteGraph.createNode).toHaveBeenCalledWith(
-        'CheckpointLoaderSimple',
-        'Load Checkpoint',
-        { pos: [300, 400] }
-      )
-    })
-    it('should populate the loader widget with the asset file path', async () => {
-      const asset = createMockAsset()
-      const mockNode = await createMockNode()
-      await setupMocks({ createdNode: mockNode })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(true)
-      expect(mockNode.widgets?.[0].value).toBe(
-        'models/checkpoints/test-model.safetensors'
-      )
-    })
-    it('should add node to root graph when no subgraph is active', async () => {
-      const asset = createMockAsset()
-      const mockNode = await createMockNode()
-      await setupMocks({ createdNode: mockNode })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(true)
-      expect(vi.mocked(app).canvas.graph!.add).toHaveBeenCalledWith(mockNode)
-    })
-    it('should fallback to asset.metadata.filename when user_metadata.filename missing', async () => {
-      const asset = createMockAsset({
-        user_metadata: {},
-        metadata: { filename: 'models/checkpoints/from-metadata.safetensors' }
-      })
-      const mockNode = await createMockNode()
-      await setupMocks({ createdNode: mockNode })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(true)
-      expect(mockNode.widgets?.[0].value).toBe(
-        'models/checkpoints/from-metadata.safetensors'
-      )
-    })
-    it('should fallback to asset.name when both filename sources missing', async () => {
-      const asset = createMockAsset({
-        user_metadata: {},
-        metadata: undefined
-      })
-      const mockNode = await createMockNode()
-      await setupMocks({ createdNode: mockNode })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(true)
-      expect(mockNode.widgets?.[0].value).toBe('test-model.safetensors')
-    })
-    it('should add node to active subgraph when present', async () => {
-      const asset = createMockAsset()
-      const mockNode = await createMockNode()
-      const { Subgraph } = await vi.importActual<typeof LitegraphModule>(
-        '@/lib/litegraph/src/litegraph'
-      )
-      const mockSubgraph = markRaw(
-        Object.create(Subgraph.prototype, {
-          add: { value: vi.fn() }
-        })
-      )
-      await setupMocks({
-        createdNode: mockNode,
-        activeSubgraph: mockSubgraph
-      })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(true)
-      expect(mockSubgraph.add).toHaveBeenCalledWith(mockNode)
-      expect(vi.mocked(app).canvas.graph!.add).not.toHaveBeenCalled()
-    })
-    it('should succeed when provider has empty key (auto-load nodes)', async () => {
-      const asset = createMockAsset({
-        tags: ['models', 'chatterbox/chatterbox_vc'],
-        user_metadata: { filename: 'chatterbox_vc_model.pt' }
-      })
-      const mockNode = await createMockNode({ hasWidgets: false })
-      const nodeProvider = createMockNodeProvider({
-        nodeDef: {
-          name: 'FL_ChatterboxVC',
-          display_name: 'FL Chatterbox VC'
-        },
-        key: ''
-      })
-      await setupMocks({ createdNode: mockNode, nodeProvider })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(true)
-      expect(vi.mocked(app).canvas.graph!.add).toHaveBeenCalledWith(mockNode)
-    })
-  })
-  describe('when asset data is incomplete or invalid', () => {
-    beforeEach(() => {
-      vi.spyOn(console, 'error').mockImplementation(() => {})
-    })
-    it.for([
-      {
-        case: 'missing user_metadata with no fallback',
-        overrides: { user_metadata: undefined, metadata: undefined, name: '' },
-        expectedCode: 'INVALID_ASSET' as const,
-        errorPattern: /Invalid filename.*expected non-empty string/
-      },
-      {
-        case: 'empty filename with no fallback',
-        overrides: {
-          user_metadata: { filename: '' },
-          metadata: undefined,
-          name: ''
-        },
-        expectedCode: 'INVALID_ASSET' as const,
-        errorPattern: /Invalid filename.*expected non-empty string/
-      }
-    ])(
-      'should fail when asset has $case',
-      ({ overrides, expectedCode, errorPattern }) => {
-        const asset = createMockAsset(overrides)
-        const result = createModelNodeFromAsset(asset)
-        expect(result.success).toBe(false)
-        if (!result.success) {
-          expect(result.error.code).toBe(expectedCode)
-          expect(result.error.message).toMatch(errorPattern)
-          expect(result.error.assetId).toBe('asset-123')
-        }
-      }
-    )
-    it.for([
-      {
-        case: 'no tags',
-        overrides: { tags: undefined },
-        expectedCode: 'INVALID_ASSET' as const,
-        errorMessage: 'Asset has no tags defined'
-      },
-      {
-        case: 'only excluded tags',
-        overrides: { tags: ['models', 'missing'] },
-        expectedCode: 'INVALID_ASSET' as const,
-        errorMessage: 'Asset has no valid category tag'
-      },
-      {
-        case: 'only the models tag',
-        overrides: { tags: ['models'] },
-        expectedCode: 'INVALID_ASSET' as const,
-        errorMessage: 'Asset has no valid category tag'
-      }
-    ])(
-      'should fail when asset has $case',
-      ({ overrides, expectedCode, errorMessage }) => {
-        const asset = createMockAsset(overrides)
-        const result = createModelNodeFromAsset(asset)
-        expect(result.success).toBe(false)
-        if (!result.success) {
-          expect(result.error.code).toBe(expectedCode)
-          expect(result.error.message).toBe(errorMessage)
-        }
-      }
-    )
-  })
-  describe('when system resources are unavailable', () => {
-    beforeEach(() => {
-      vi.spyOn(console, 'error').mockImplementation(() => {})
-    })
-    it('should fail when no provider registered for category', async () => {
-      const asset = createMockAsset()
-      await setupMocks({ nodeProvider: null })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(false)
-      if (!result.success) {
-        expect(result.error.code).toBe('NO_PROVIDER')
-        expect(result.error.message).toContain('checkpoints')
-        expect(result.error.details?.category).toBe('checkpoints')
-      }
-    })
-    it('should fail when node creation fails', async () => {
-      const asset = createMockAsset()
-      await setupMocks()
-      vi.mocked(LiteGraph.createNode).mockReturnValue(null)
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(false)
-      if (!result.success) {
-        expect(result.error.code).toBe('NODE_CREATION_FAILED')
-        expect(result.error.message).toContain('CheckpointLoaderSimple')
-      }
-    })
-    it('should fail when widget is missing from node', async () => {
-      const asset = createMockAsset()
-      const mockNode = await createMockNode({ widgetName: 'wrong_widget' })
-      await setupMocks({ createdNode: mockNode })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(false)
-      if (!result.success) {
-        expect(result.error.code).toBe('MISSING_WIDGET')
-        expect(result.error.message).toContain('ckpt_name')
-        expect(result.error.message).toContain('CheckpointLoaderSimple')
-        expect(result.error.details?.widgetName).toBe('ckpt_name')
-      }
-    })
-    it('should fail when node has no widgets array', async () => {
-      const asset = createMockAsset()
-      const mockNode = await createMockNode({ hasWidgets: false })
-      await setupMocks({ createdNode: mockNode })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(false)
-      if (!result.success) {
-        expect(result.error.code).toBe('MISSING_WIDGET')
-        expect(result.error.message).toContain('ckpt_name not found')
-      }
-    })
-    it('should not add node to graph when widget validation fails', async () => {
-      const asset = createMockAsset()
-      const mockNode = await createMockNode({ hasWidgets: false })
-      await setupMocks({ createdNode: mockNode })
-      createModelNodeFromAsset(asset)
-      expect(vi.mocked(app).canvas.graph!.add).not.toHaveBeenCalled()
-    })
-  })
-  describe('when graph is null', () => {
-    beforeEach(() => {
-      vi.spyOn(console, 'error').mockImplementation(() => {})
-      vi.mocked(app).canvas.graph = null
-    })
-    it('should fail when no graph is available', async () => {
-      const asset = createMockAsset()
-      const mockNode = await createMockNode()
-      await setupMocks({ createdNode: mockNode })
-      const result = createModelNodeFromAsset(asset)
-      expect(result.success).toBe(false)
-      if (!result.success) {
-        expect(result.error.code).toBe('NO_GRAPH')
-        expect(result.error.message).toBe('No active graph available')
-      }
-    })
-  })
-})
diff --git a/src/platform/assets/utils/createModelNodeFromAsset.ts b/src/platform/assets/utils/createModelNodeFromAsset.ts
deleted file mode 100644
index 1701d1e3d0..0000000000
--- a/src/platform/assets/utils/createModelNodeFromAsset.ts
+++ /dev/null
@@ -1,198 +0,0 @@
-import { LiteGraph } from '@/lib/litegraph/src/litegraph'
-import type { LGraphNode, Point } from '@/lib/litegraph/src/litegraph'
-import { assetItemSchema } from '@/platform/assets/schemas/assetSchema'
-import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
-import {
-  MISSING_TAG,
-  MODELS_TAG
-} from '@/platform/assets/services/assetService'
-import { getAssetFilename } from '@/platform/assets/utils/assetMetadataUtils'
-import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
-import { app } from '@/scripts/app'
-import { useLitegraphService } from '@/services/litegraphService'
-import { useModelToNodeStore } from '@/stores/modelToNodeStore'
-
-interface ModelNodeCreateOptions {
-  position?: Point
-}
-
-type NodeCreationErrorCode =
-  | 'INVALID_ASSET'
-  | 'NO_PROVIDER'
-  | 'NODE_CREATION_FAILED'
-  | 'MISSING_WIDGET'
-  | 'NO_GRAPH'
-
-interface NodeCreationError {
-  code: NodeCreationErrorCode
-  message: string
-  assetId: string
-  details?: Record<string, unknown>
-}
-
-type Result<T, E> = { success: true; value: T } | { success: false; error: E }
-
-/**
- * Creates a LiteGraph node from an asset item.
- *
- * **Boundary Function**: Bridges Vue reactive domain with LiteGraph canvas domain.
- *
- * @param asset - Asset item to create node from (Vue domain)
- * @param options - Optional position and configuration
- * @returns Result with LiteGraph node (Canvas domain) or error details
- *
- * @remarks
- * This function performs side effects on the canvas graph. Validation failures
- * return error results rather than throwing to allow graceful degradation in UI contexts.
- * Widget validation occurs before graph mutation to prevent orphaned nodes.
- */
-export function createModelNodeFromAsset(
-  asset: AssetItem,
-  options?: ModelNodeCreateOptions
-): Result<LGraphNode, NodeCreationError> {
-  const validatedAsset = assetItemSchema.safeParse(asset)
-
-  if (!validatedAsset.success) {
-    const errorMessage = validatedAsset.error.errors
-      .map((e) => `${e.path.join('.')}: ${e.message}`)
-      .join(', ')
-    console.error('Invalid asset item:', errorMessage)
-    return {
-      success: false,
-      error: {
-        code: 'INVALID_ASSET',
-        message: 'Asset schema validation failed',
-        assetId: asset.id,
-        details: { validationErrors: errorMessage }
-      }
-    }
-  }
-
-  const validAsset = validatedAsset.data
-
-  const filename = getAssetFilename(validAsset)
-  if (filename.length === 0) {
-    console.error(
-      `Asset ${validAsset.id} has invalid user_metadata.filename (expected non-empty string, got ${typeof filename})`
-    )
-    return {
-      success: false,
-      error: {
-        code: 'INVALID_ASSET',
-        message: `Invalid filename (expected non-empty string, got ${typeof filename})`,
-        assetId: validAsset.id
-      }
-    }
-  }
-
-  if (validAsset.tags.length === 0) {
-    console.error(
-      `Asset ${validAsset.id} has no tags defined (expected at least one category tag)`
-    )
-    return {
-      success: false,
-      error: {
-        code: 'INVALID_ASSET',
-        message: 'Asset has no tags defined',
-        assetId: validAsset.id
-      }
-    }
-  }
-
-  const category = validAsset.tags.find(
-    (tag) => tag !== MODELS_TAG && tag !== MISSING_TAG
-  )
-  if (!category) {
-    console.error(
-      `Asset ${validAsset.id} has no valid category tag. Available tags: ${validAsset.tags.join(', ')} (expected tag other than '${MODELS_TAG}' or '${MISSING_TAG}')`
-    )
-    return {
-      success: false,
-      error: {
-        code: 'INVALID_ASSET',
-        message: 'Asset has no valid category tag',
-        assetId: validAsset.id,
-        details: { availableTags: validAsset.tags }
-      }
-    }
-  }
-
-  const modelToNodeStore = useModelToNodeStore()
-  const provider = modelToNodeStore.getNodeProvider(category)
-  if (!provider) {
-    console.error(`No node provider registered for category: ${category}`)
-    return {
-      success: false,
-      error: {
-        code: 'NO_PROVIDER',
-        message: `No node provider registered for category: ${category}`,
-        assetId: validAsset.id,
-        details: { category }
-      }
-    }
-  }
-
-  const litegraphService = useLitegraphService()
-  const pos = options?.position ?? litegraphService.getCanvasCenter()
-
-  const node = LiteGraph.createNode(
-    provider.nodeDef.name,
-    provider.nodeDef.display_name,
-    { pos }
-  )
-
-  if (!node) {
-    console.error(`Failed to create node for type: ${provider.nodeDef.name}`)
-    return {
-      success: false,
-      error: {
-        code: 'NODE_CREATION_FAILED',
-        message: `Failed to create node for type: ${provider.nodeDef.name}`,
-        assetId: validAsset.id,
-        details: { nodeType: provider.nodeDef.name }
-      }
-    }
-  }
-
-  const workflowStore = useWorkflowStore()
-  const targetGraph = workflowStore.isSubgraphActive
-    ? workflowStore.activeSubgraph
-    : app.canvas.graph
-
-  if (!targetGraph) {
-    console.error('No active graph available')
-    return {
-      success: false,
-      error: {
-        code: 'NO_GRAPH',
-        message: 'No active graph available',
-        assetId: validAsset.id
-      }
-    }
-  }
-
-  // Set widget value if provider specifies a key (some nodes auto-load models without a widget)
-  if (provider.key) {
-    const widget = node.widgets?.find((w) => w.name === provider.key)
-    if (!widget) {
-      console.error(
-        `Widget ${provider.key} not found on node ${provider.nodeDef.name}`
-      )
-      return {
-        success: false,
-        error: {
-          code: 'MISSING_WIDGET',
-          message: `Widget ${provider.key} not found on node ${provider.nodeDef.name}`,
-          assetId: validAsset.id,
-          details: { widgetName: provider.key, nodeType: provider.nodeDef.name }
-        }
-      }
-    }
-    widget.value = filename
-  }
-
-  // Add the node to the graph
-  targetGraph.add(node)
-
-  return { success: true, value: node }
-}
diff --git a/src/platform/assets/utils/resolveModelNodeFromAsset.test.ts b/src/platform/assets/utils/resolveModelNodeFromAsset.test.ts
new file mode 100644
index 0000000000..fd849d1986
--- /dev/null
+++ b/src/platform/assets/utils/resolveModelNodeFromAsset.test.ts
@@ -0,0 +1,208 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+
+import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
+import { resolveModelNodeFromAsset } from '@/platform/assets/utils/resolveModelNodeFromAsset'
+
+const mockGetNodeProvider = vi.hoisted(() => vi.fn())
+
+vi.mock('@/stores/modelToNodeStore', () => ({
+  useModelToNodeStore: () => ({ getNodeProvider: mockGetNodeProvider })
+}))
+
+function createMockAsset(overrides: Partial<AssetItem> = {}): AssetItem {
+  return {
+    id: 'asset-123',
+    name: 'test-model.safetensors',
+    size: 1024,
+    created_at: '2025-10-01T00:00:00Z',
+    tags: ['models', 'checkpoints'],
+    user_metadata: {
+      filename: 'models/checkpoints/test-model.safetensors'
+    },
+    ...overrides
+  }
+}
+
+function createMockNodeProvider(
+  overrides: {
+    nodeDef?: { name: string; display_name: string }
+    key?: string
+  } = {}
+) {
+  return {
+    nodeDef: {
+      name: 'CheckpointLoaderSimple',
+      display_name: 'Load Checkpoint',
+      ...overrides.nodeDef
+    },
+    key: overrides.key ?? 'ckpt_name'
+  }
+}
+
+function mockProvider(
+  provider: ReturnType<typeof createMockNodeProvider> | null
+) {
+  mockGetNodeProvider.mockReturnValue(provider)
+}
+
+describe('resolveModelNodeFromAsset', () => {
+  beforeEach(() => {
+    vi.clearAllMocks()
+    vi.spyOn(console, 'error').mockImplementation(() => {})
+  })
+
+  describe('valid assets', () => {
+    it('resolves the provider for the asset category and the filename', () => {
+      mockProvider(createMockNodeProvider())
+      const result = resolveModelNodeFromAsset(createMockAsset())
+
+      expect(result.success).toBe(true)
+      if (result.success) {
+        expect(mockGetNodeProvider).toHaveBeenCalledWith('checkpoints')
+        expect(result.value.provider.nodeDef.name).toBe(
+          'CheckpointLoaderSimple'
+        )
+        expect(result.value.filename).toBe(
+          'models/checkpoints/test-model.safetensors'
+        )
+      }
+    })
+
+    it('falls back to metadata.filename when user_metadata.filename missing', () => {
+      mockProvider(createMockNodeProvider())
+      const result = resolveModelNodeFromAsset(
+        createMockAsset({
+          user_metadata: {},
+          metadata: { filename: 'models/checkpoints/from-metadata.safetensors' }
+        })
+      )
+
+      expect(result.success).toBe(true)
+      if (result.success) {
+        expect(result.value.filename).toBe(
+          'models/checkpoints/from-metadata.safetensors'
+        )
+      }
+    })
+
+    it('falls back to asset.name when both filename sources missing', () => {
+      mockProvider(createMockNodeProvider())
+      const result = resolveModelNodeFromAsset(
+        createMockAsset({ user_metadata: {}, metadata: undefined })
+      )
+
+      expect(result.success).toBe(true)
+      if (result.success) {
+        expect(result.value.filename).toBe('test-model.safetensors')
+      }
+    })
+
+    it('resolves a provider with an empty key (auto-load nodes)', () => {
+      mockProvider(
+        createMockNodeProvider({
+          nodeDef: {
+            name: 'FL_ChatterboxVC',
+            display_name: 'FL Chatterbox VC'
+          },
+          key: ''
+        })
+      )
+      const result = resolveModelNodeFromAsset(
+        createMockAsset({
+          tags: ['models', 'chatterbox/chatterbox_vc'],
+          user_metadata: { filename: 'chatterbox_vc_model.pt' }
+        })
+      )
+
+      expect(result.success).toBe(true)
+      if (result.success) {
+        expect(result.value.provider.key).toBe('')
+        expect(result.value.filename).toBe('chatterbox_vc_model.pt')
+      }
+    })
+  })
+
+  describe('invalid assets', () => {
+    it('fails when the asset does not match the schema', () => {
+      const invalid = {
+        id: 'asset-123',
+        tags: ['models', 'checkpoints']
+      } as unknown as AssetItem
+
+      const result = resolveModelNodeFromAsset(invalid)
+
+      expect(result.success).toBe(false)
+      if (!result.success) {
+        expect(result.error.code).toBe('INVALID_ASSET')
+        expect(result.error.message).toBe('Asset schema validation failed')
+        expect(result.error.assetId).toBe('asset-123')
+        expect(result.error.details?.validationErrors).toBeTruthy()
+      }
+    })
+
+    it.for([
+      {
+        case: 'missing user_metadata with no fallback',
+        overrides: {
+          user_metadata: undefined,
+          metadata: undefined,
+          name: ''
+        },
+        errorPattern: /Invalid filename.*expected non-empty string/
+      },
+      {
+        case: 'empty filename with no fallback',
+        overrides: {
+          user_metadata: { filename: '' },
+          metadata: undefined,
+          name: ''
+        },
+        errorPattern: /Invalid filename.*expected non-empty string/
+      }
+    ])('fails when asset has $case', ({ overrides, errorPattern }) => {
+      const result = resolveModelNodeFromAsset(createMockAsset(overrides))
+      expect(result.success).toBe(false)
+      if (!result.success) {
+        expect(result.error.code).toBe('INVALID_ASSET')
+        expect(result.error.message).toMatch(errorPattern)
+        expect(result.error.assetId).toBe('asset-123')
+      }
+    })
+
+    it.for([
+      {
+        case: 'no tags',
+        overrides: { tags: undefined },
+        message: 'Asset has no tags defined'
+      },
+      {
+        case: 'only excluded tags',
+        overrides: { tags: ['models', 'missing'] },
+        message: 'Asset has no valid category tag'
+      },
+      {
+        case: 'only the models tag',
+        overrides: { tags: ['models'] },
+        message: 'Asset has no valid category tag'
+      }
+    ])('fails when asset has $case', ({ overrides, message }) => {
+      const result = resolveModelNodeFromAsset(createMockAsset(overrides))
+      expect(result.success).toBe(false)
+      if (!result.success) {
+        expect(result.error.code).toBe('INVALID_ASSET')
+        expect(result.error.message).toBe(message)
+      }
+    })
+
+    it('fails when no provider is registered for the category', () => {
+      mockProvider(null)
+      const result = resolveModelNodeFromAsset(createMockAsset())
+      expect(result.success).toBe(false)
+      if (!result.success) {
+        expect(result.error.code).toBe('NO_PROVIDER')
+        expect(result.error.message).toContain('checkpoints')
+        expect(result.error.details?.category).toBe('checkpoints')
+      }
+    })
+  })
+})
diff --git a/src/platform/assets/utils/resolveModelNodeFromAsset.ts b/src/platform/assets/utils/resolveModelNodeFromAsset.ts
new file mode 100644
index 0000000000..ee836bbf04
--- /dev/null
+++ b/src/platform/assets/utils/resolveModelNodeFromAsset.ts
@@ -0,0 +1,117 @@
+import { assetItemSchema } from '@/platform/assets/schemas/assetSchema'
+import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
+import {
+  MISSING_TAG,
+  MODELS_TAG
+} from '@/platform/assets/services/assetService'
+import { getAssetFilename } from '@/platform/assets/utils/assetMetadataUtils'
+import { useModelToNodeStore } from '@/stores/modelToNodeStore'
+import type { ModelNodeProvider } from '@/stores/modelToNodeStore'
+
+type ResolveErrorCode = 'INVALID_ASSET' | 'NO_PROVIDER'
+
+export interface ResolveModelNodeError {
+  code: ResolveErrorCode
+  message: string
+  assetId: string
+  details?: Record<string, unknown>
+}
+
+export interface ResolvedModelNode {
+  provider: ModelNodeProvider
+  filename: string
+}
+
+type Result<T, E> = { success: true; value: T } | { success: false; error: E }
+
+/**
+ * Resolves an asset item to the node provider and filename needed to add a
+ * model loader node. Validation failures return error results rather than
+ * throwing, so callers can degrade gracefully in UI contexts.
+ */
+export function resolveModelNodeFromAsset(
+  asset: AssetItem
+): Result<ResolvedModelNode, ResolveModelNodeError> {
+  const validatedAsset = assetItemSchema.safeParse(asset)
+
+  if (!validatedAsset.success) {
+    const errorMessage = validatedAsset.error.errors
+      .map((e) => `${e.path.join('.')}: ${e.message}`)
+      .join(', ')
+    console.error('Invalid asset item:', errorMessage)
+    return {
+      success: false,
+      error: {
+        code: 'INVALID_ASSET',
+        message: 'Asset schema validation failed',
+        assetId: typeof asset?.id === 'string' ? asset.id : 'unknown',
+        details: { validationErrors: errorMessage }
+      }
+    }
+  }
+
+  const validAsset = validatedAsset.data
+
+  const filename = getAssetFilename(validAsset)
+  if (filename.length === 0) {
+    console.error(
+      `Asset ${validAsset.id} has invalid user_metadata.filename (expected non-empty string, got ${typeof filename})`
+    )
+    return {
+      success: false,
+      error: {
+        code: 'INVALID_ASSET',
+        message: `Invalid filename (expected non-empty string, got ${typeof filename})`,
+        assetId: validAsset.id
+      }
+    }
+  }
+
+  if (validAsset.tags.length === 0) {
+    console.error(
+      `Asset ${validAsset.id} has no tags defined (expected at least one category tag)`
+    )
+    return {
+      success: false,
+      error: {
+        code: 'INVALID_ASSET',
+        message: 'Asset has no tags defined',
+        assetId: validAsset.id
+      }
+    }
+  }
+
+  const category = validAsset.tags.find(
+    (tag) => tag !== MODELS_TAG && tag !== MISSING_TAG
+  )
+  if (!category) {
+    console.error(
+      `Asset ${validAsset.id} has no valid category tag. Available tags: ${validAsset.tags.join(', ')} (expected tag other than '${MODELS_TAG}' or '${MISSING_TAG}')`
+    )
+    return {
+      success: false,
+      error: {
+        code: 'INVALID_ASSET',
+        message: 'Asset has no valid category tag',
+        assetId: validAsset.id,
+        details: { availableTags: validAsset.tags }
+      }
+    }
+  }
+
+  const provider = useModelToNodeStore().getNodeProvider(category)
+  if (!provider) {
+    console.error(`No node provider registered for category: ${category}`)
+    return {
+      success: false,
+      error: {
+        code: 'NO_PROVIDER',
+        message: `No node provider registered for category: ${category}`,
+        assetId: validAsset.id,
+        details: { category }
+      }
+    }
+  }
+
+  return { success: true, value: { provider, filename } }
+}
diff --git a/src/platform/cloud/onboarding/CloudSignupView.vue b/src/platform/cloud/onboarding/CloudSignupView.vue
index add8400e73..de5ecb4754 100644
--- a/src/platform/cloud/onboarding/CloudSignupView.vue
+++ b/src/platform/cloud/onboarding/CloudSignupView.vue
@@ -135,7 +135,6 @@ import Button from '@/components/ui/button/Button.vue'
 import { useAuthActions } from '@/composables/auth/useAuthActions'
 import { useFreeTierOnboarding } from '@/platform/cloud/onboarding/composables/useFreeTierOnboarding'
 import { usePostAuthRedirect } from '@/platform/cloud/onboarding/composables/usePostAuthRedirect'
-import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import type { SignUpData } from '@/schemas/signInSchema'
 import { isInChina } from '@/utils/networkUtil'
@@ -188,9 +187,7 @@ const signUpWithEmail = async (values: SignUpData) => {
 }
 
 onMounted(async () => {
-  if (isCloud) {
-    telemetry?.trackSignupOpened()
-  }
+  telemetry?.trackSignupOpened()
 
   userIsInChina.value = await isInChina()
 })
diff --git a/src/platform/cloud/onboarding/CloudSurveyView.vue b/src/platform/cloud/onboarding/CloudSurveyView.vue
index 56b50f33d3..27203f1635 100644
--- a/src/platform/cloud/onboarding/CloudSurveyView.vue
+++ b/src/platform/cloud/onboarding/CloudSurveyView.vue
@@ -18,7 +18,6 @@ import {
   getSurveyCompletedStatus,
   submitSurvey
 } from '@/platform/cloud/onboarding/auth'
-import { isCloud } from '@/platform/distribution/types'
 import { remoteConfig } from '@/platform/remoteConfig/remoteConfig'
 import { useTelemetry } from '@/platform/telemetry'
 
@@ -46,9 +45,7 @@ onMounted(async () => {
       await router.replace({ name: 'cloud-user-check' })
       return
     }
-    if (isCloud) {
-      useTelemetry()?.trackSurvey('opened')
-    }
+    useTelemetry()?.trackSurvey('opened')
   } catch (error) {
     console.error('Failed to check survey status:', error)
   }
@@ -62,9 +59,7 @@ const onSubmitSurvey = async (payload: Record<string, unknown>) => {
   isSubmitting.value = true
   try {
     await submitSurvey(payload)
-    if (isCloud) {
-      useTelemetry()?.trackSurvey('submitted', payload)
-    }
+    useTelemetry()?.trackSurvey('submitted', payload)
     await router.push({ name: 'cloud-user-check' })
   } finally {
     isSubmitting.value = false
diff --git a/src/platform/cloud/subscription/components/SubscribeButton.vue b/src/platform/cloud/subscription/components/SubscribeButton.vue
index cea2883021..2f488bcf4e 100644
--- a/src/platform/cloud/subscription/components/SubscribeButton.vue
+++ b/src/platform/cloud/subscription/components/SubscribeButton.vue
@@ -53,11 +53,9 @@ watch(
 )
 
 const handleSubscribe = () => {
-  if (isCloud) {
-    useTelemetry()?.trackSubscription('subscribe_clicked', {
-      current_tier: subscriptionTier.value?.toLowerCase()
-    })
-  }
+  useTelemetry()?.trackSubscription('subscribe_clicked', {
+    current_tier: subscriptionTier.value?.toLowerCase()
+  })
   isAwaitingStripeSubscription.value = true
   showSubscriptionDialog()
 }
diff --git a/src/platform/cloud/subscription/composables/useBillingPlans.ts b/src/platform/cloud/subscription/composables/useBillingPlans.ts
index 7751dc8711..8a7c02dbca 100644
--- a/src/platform/cloud/subscription/composables/useBillingPlans.ts
+++ b/src/platform/cloud/subscription/composables/useBillingPlans.ts
@@ -1,10 +1,14 @@
 import { computed, ref } from 'vue'
 
-import type { Plan } from '@/platform/workspace/api/workspaceApi'
+import type {
+  Plan,
+  TeamCreditStops
+} from '@/platform/workspace/api/workspaceApi'
 import { workspaceApi } from '@/platform/workspace/api/workspaceApi'
 
 const plans = ref<Plan[]>([])
 const currentPlanSlug = ref<string | null>(null)
+const teamCreditStops = ref<TeamCreditStops | null>(null)
 const isLoading = ref(false)
 const error = ref<string | null>(null)
 
@@ -19,6 +23,7 @@ export function useBillingPlans() {
       const response = await workspaceApi.getBillingPlans()
       plans.value = response.plans
       currentPlanSlug.value = response.current_plan_slug ?? null
+      teamCreditStops.value = response.team_credit_stops ?? null
     } catch (err) {
       error.value = err instanceof Error ? err.message : 'Failed to fetch plans'
       console.error('[useBillingPlans] Failed to fetch plans:', err)
@@ -48,6 +53,7 @@ export function useBillingPlans() {
   return {
     plans,
     currentPlanSlug,
+    teamCreditStops,
     isLoading,
     error,
     monthlyPlans,
diff --git a/src/platform/cloud/subscription/composables/useSubscription.ts b/src/platform/cloud/subscription/composables/useSubscription.ts
index eccd32c488..349712b9c5 100644
--- a/src/platform/cloud/subscription/composables/useSubscription.ts
+++ b/src/platform/cloud/subscription/composables/useSubscription.ts
@@ -237,12 +237,10 @@ function useSubscriptionInternal() {
   const showSubscriptionDialog = (options?: {
     reason?: SubscriptionDialogReason
   }) => {
-    if (isCloud) {
-      useTelemetry()?.trackSubscription('modal_opened', {
-        current_tier: subscriptionTier.value?.toLowerCase(),
-        reason: options?.reason
-      })
-    }
+    useTelemetry()?.trackSubscription('modal_opened', {
+      current_tier: subscriptionTier.value?.toLowerCase(),
+      reason: options?.reason
+    })
 
     void showSubscriptionRequiredDialog(options)
   }
diff --git a/src/platform/cloud/subscription/composables/useSubscriptionActions.test.ts b/src/platform/cloud/subscription/composables/useSubscriptionActions.test.ts
index c9fccfa0e2..64f79b81f1 100644
--- a/src/platform/cloud/subscription/composables/useSubscriptionActions.test.ts
+++ b/src/platform/cloud/subscription/composables/useSubscriptionActions.test.ts
@@ -38,6 +38,19 @@ vi.mock('@/stores/commandStore', () => ({
   })
 }))
 
+// useTelemetry() returns null in OSS, a dispatcher in cloud — toggle via mockIsCloud.
+const { mockIsCloud, mockTrackHelpResourceClicked } = vi.hoisted(() => ({
+  mockIsCloud: { value: true },
+  mockTrackHelpResourceClicked: vi.fn()
+}))
+
+vi.mock('@/platform/telemetry', () => ({
+  useTelemetry: () =>
+    mockIsCloud.value
+      ? { trackHelpResourceClicked: mockTrackHelpResourceClicked }
+      : null
+}))
+
 // Mock window.open
 const mockOpen = vi.fn()
 Object.defineProperty(window, 'open', {
@@ -48,6 +61,7 @@ Object.defineProperty(window, 'open', {
 describe('useSubscriptionActions', () => {
   beforeEach(() => {
     vi.clearAllMocks()
+    mockIsCloud.value = true
   })
 
   describe('handleAddApiCredits', () => {
@@ -73,6 +87,27 @@ describe('useSubscriptionActions', () => {
       expect(isLoadingSupport.value).toBe(false)
     })
 
+    it('tracks help-resource telemetry when messaging support in cloud', async () => {
+      const { handleMessageSupport } = useSubscriptionActions()
+
+      await handleMessageSupport()
+
+      expect(mockTrackHelpResourceClicked).toHaveBeenCalledWith({
+        resource_type: 'help_feedback',
+        is_external: true,
+        source: 'subscription'
+      })
+    })
+
+    it('does not fire telemetry when messaging support in OSS builds', async () => {
+      mockIsCloud.value = false
+      const { handleMessageSupport } = useSubscriptionActions()
+
+      await handleMessageSupport()
+
+      expect(mockTrackHelpResourceClicked).not.toHaveBeenCalled()
+    })
+
     it('should handle errors gracefully', async () => {
       mockExecute.mockRejectedValueOnce(new Error('Command failed'))
       const { handleMessageSupport, isLoadingSupport } =
diff --git a/src/platform/cloud/subscription/composables/useSubscriptionActions.ts b/src/platform/cloud/subscription/composables/useSubscriptionActions.ts
index 7fb262bec0..00b7796c07 100644
--- a/src/platform/cloud/subscription/composables/useSubscriptionActions.ts
+++ b/src/platform/cloud/subscription/composables/useSubscriptionActions.ts
@@ -2,7 +2,6 @@ import { onMounted, ref } from 'vue'
 
 import { useBillingContext } from '@/composables/billing/useBillingContext'
 import { useAuthActions } from '@/composables/auth/useAuthActions'
-import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import { useDialogService } from '@/services/dialogService'
 import { useCommandStore } from '@/stores/commandStore'
@@ -30,13 +29,11 @@ export function useSubscriptionActions() {
   const handleMessageSupport = async () => {
     try {
       isLoadingSupport.value = true
-      if (isCloud) {
-        telemetry?.trackHelpResourceClicked({
-          resource_type: 'help_feedback',
-          is_external: true,
-          source: 'subscription'
-        })
-      }
+      telemetry?.trackHelpResourceClicked({
+        resource_type: 'help_feedback',
+        is_external: true,
+        source: 'subscription'
+      })
       await commandStore.execute('Comfy.ContactSupport')
     } catch (error) {
       console.error('[useSubscriptionActions] Error contacting support:', error)
diff --git a/src/platform/cloud/subscription/composables/useSubscriptionDialog.test.ts b/src/platform/cloud/subscription/composables/useSubscriptionDialog.test.ts
index 27ba4697f9..b1e8f860b3 100644
--- a/src/platform/cloud/subscription/composables/useSubscriptionDialog.test.ts
+++ b/src/platform/cloud/subscription/composables/useSubscriptionDialog.test.ts
@@ -9,6 +9,8 @@ const mockIsInPersonalWorkspace = vi.hoisted(() => ({ value: true }))
 const mockIsFreeTier = vi.hoisted(() => ({ value: false }))
 const mockTeamWorkspacesEnabled = vi.hoisted(() => ({ value: false }))
 const mockIsCloud = vi.hoisted(() => ({ value: true }))
+const mockIsLegacyTeamPlan = vi.hoisted(() => ({ value: false }))
+const mockCanManageSubscription = vi.hoisted(() => ({ value: true }))
 
 vi.mock('vue', async (importOriginal) => {
   const actual = await importOriginal()
@@ -61,6 +63,22 @@ vi.mock('@/platform/workspace/stores/teamWorkspaceStore', () => ({
   })
 }))
 
+vi.mock('@/composables/billing/useBillingContext', () => ({
+  useBillingContext: () => ({
+    isLegacyTeamPlan: mockIsLegacyTeamPlan
+  })
+}))
+
+vi.mock('@/platform/workspace/composables/useWorkspaceUI', () => ({
+  useWorkspaceUI: () => ({
+    permissions: {
+      get value() {
+        return { canManageSubscription: mockCanManageSubscription.value }
+      }
+    }
+  })
+}))
+
 describe('useSubscriptionDialog', () => {
   beforeEach(() => {
     vi.clearAllMocks()
@@ -68,6 +86,8 @@ describe('useSubscriptionDialog', () => {
     mockIsInPersonalWorkspace.value = true
     mockIsFreeTier.value = false
     mockTeamWorkspacesEnabled.value = false
+    mockIsLegacyTeamPlan.value = false
+    mockCanManageSubscription.value = true
 
     try {
       sessionStorage.clear()
@@ -94,6 +114,82 @@ describe('useSubscriptionDialog', () => {
 
       expect(mockShowLayoutDialog).toHaveBeenCalled()
     })
+
+    it('uses the unified table (no onChooseTeam) when team workspaces are enabled', () => {
+      mockTeamWorkspacesEnabled.value = true
+      // Unified table is workspace-type-agnostic (Jun-5 model): same path for
+      // a personal-plan or team-plan workspace.
+      mockIsInPersonalWorkspace.value = true
+      const { showPricingTable } = useSubscriptionDialog()
+
+      showPricingTable()
+
+      expect(mockShowLayoutDialog).toHaveBeenCalledTimes(1)
+      const props = mockShowLayoutDialog.mock.calls[0][0].props
+      expect(props).not.toHaveProperty('onChooseTeam')
+    })
+
+    it('defaults to the personal tab in a personal workspace', () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsInPersonalWorkspace.value = true
+      const { showPricingTable } = useSubscriptionDialog()
+
+      showPricingTable()
+
+      const props = mockShowLayoutDialog.mock.calls[0][0].props
+      expect(props.initialPlanMode).toBe('personal')
+    })
+
+    it('opens the team tab when planMode is forced from a personal workspace', () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsInPersonalWorkspace.value = true
+      const { showPricingTable } = useSubscriptionDialog()
+
+      showPricingTable({ planMode: 'team' })
+
+      const props = mockShowLayoutDialog.mock.calls[0][0].props
+      expect(props.initialPlanMode).toBe('team')
+    })
+
+    it('uses the legacy table (with onChooseTeam) when team workspaces are disabled', () => {
+      mockTeamWorkspacesEnabled.value = false
+      const { showPricingTable } = useSubscriptionDialog()
+
+      showPricingTable()
+
+      const props = mockShowLayoutDialog.mock.calls[0][0].props
+      expect(props).toHaveProperty('onChooseTeam')
+    })
+
+    it('routes an existing per-member (legacy) team subscriber to the old team table', () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsInPersonalWorkspace.value = false
+      mockIsLegacyTeamPlan.value = true
+      const { showPricingTable } = useSubscriptionDialog()
+
+      showPricingTable()
+
+      expect(mockShowLayoutDialog).toHaveBeenCalledTimes(1)
+      const props = mockShowLayoutDialog.mock.calls[0][0].props
+      // The legacy team dialog takes onClose + reason and none of the unified
+      // props. `reason` separates it from the read-only member dialog (onClose
+      // only); the absent initialPlanMode separates it from the unified table.
+      expect(props).toHaveProperty('reason')
+      expect(props).not.toHaveProperty('initialPlanMode')
+      expect(props).not.toHaveProperty('onChooseTeam')
+    })
+
+    it('keeps a non-legacy (credit-slider) team subscriber on the unified table', () => {
+      mockTeamWorkspacesEnabled.value = true
+      mockIsInPersonalWorkspace.value = false
+      mockIsLegacyTeamPlan.value = false
+      const { showPricingTable } = useSubscriptionDialog()
+
+      showPricingTable()
+
+      const props = mockShowLayoutDialog.mock.calls[0][0].props
+      expect(props.initialPlanMode).toBe('team')
+    })
   })
 
   describe('startTeamWorkspaceUpgradeFlow', () => {
diff --git a/src/platform/cloud/subscription/composables/useSubscriptionDialog.ts b/src/platform/cloud/subscription/composables/useSubscriptionDialog.ts
index 6762bf2fa5..c228bf196c 100644
--- a/src/platform/cloud/subscription/composables/useSubscriptionDialog.ts
+++ b/src/platform/cloud/subscription/composables/useSubscriptionDialog.ts
@@ -1,6 +1,7 @@
 import { defineAsyncComponent } from 'vue'
 import { useDialogService } from '@/services/dialogService'
 import { useDialogStore } from '@/stores/dialogStore'
+import { useBillingContext } from '@/composables/billing/useBillingContext'
 import { useFeatureFlags } from '@/composables/useFeatureFlags'
 import { useSubscription } from '@/platform/cloud/subscription/composables/useSubscription'
 import { isCloud } from '@/platform/distribution/types'
@@ -16,6 +17,16 @@ export type SubscriptionDialogReason =
   | 'out_of_credits'
   | 'top_up_blocked'
 
+export interface SubscriptionDialogOptions {
+  reason?: SubscriptionDialogReason
+  /**
+   * Forces the unified pricing dialog to open on a specific plan tab,
+   * overriding the workspace-derived default (e.g. an "Upgrade to Team" CTA
+   * always lands on the team tab even from a personal workspace).
+   */
+  planMode?: 'personal' | 'team'
+}
+
 export const useSubscriptionDialog = () => {
   const { flags } = useFeatureFlags()
   const dialogService = useDialogService()
@@ -29,7 +40,7 @@ export const useSubscriptionDialog = () => {
     dialogStore.closeDialog({ key: FREE_TIER_DIALOG_KEY })
   }
 
-  function showPricingTable(options?: { reason?: SubscriptionDialogReason }) {
+  function showPricingTable(options?: SubscriptionDialogOptions) {
     if (!isCloud) return
 
     // Members can't manage the workspace subscription, so a blocked run shows a
@@ -57,47 +68,100 @@ export const useSubscriptionDialog = () => {
       return
     }
 
-    const useWorkspaceVariant =
-      flags.teamWorkspacesEnabled && !workspaceStore.isInPersonalWorkspace
-
-    const component = useWorkspaceVariant
-      ? defineAsyncComponent(
-          () =>
-            import('@/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue')
-        )
-      : defineAsyncComponent(
-          () =>
-            import('@/platform/cloud/subscription/components/SubscriptionRequiredDialogContent.vue')
-        )
-
-    const personalProps = {
-      onClose: hide,
-      reason: options?.reason,
-      onChooseTeam: () => startTeamWorkspaceUpgradeFlow()
+    // Shared dialog shell styling for both variants.
+    const dialogComponentProps = {
+      style: 'width: min(1328px, 95vw); max-height: 958px;',
+      pt: {
+        root: {
+          class: 'rounded-2xl bg-transparent h-full'
+        },
+        content: {
+          class:
+            '!p-0 rounded-2xl border border-border-default bg-secondary-background shadow-[0_25px_80px_rgba(5,6,12,0.45)] h-full'
+        }
+      }
     }
-    const workspaceProps = {
-      onClose: hide,
-      reason: options?.reason
+
+    // Jun-5 model: a single unified pricing table (personal/team plan toggle on
+    // one workspace) when team workspaces are enabled. Replaces the old
+    // personal-vs-team workspace fork. Flag-off keeps the legacy table.
+    if (flags.teamWorkspacesEnabled) {
+      // Existing per-member (legacy) team subscribers keep the old tier-based
+      // team table; the unified credit-slider table is for everyone else.
+      // Resolved lazily (not at composable setup): these three composables form
+      // an import cycle (useBillingContext -> useWorkspaceBilling ->
+      // useSubscriptionDialog), so a setup-time read would deref the shared
+      // context before its state is constructed.
+      const { isLegacyTeamPlan } = useBillingContext()
+      if (isLegacyTeamPlan.value) {
+        dialogService.showLayoutDialog({
+          key: DIALOG_KEY,
+          component: defineAsyncComponent(
+            () =>
+              import('@/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue')
+          ),
+          props: {
+            onClose: hide,
+            reason: options?.reason
+          },
+          // The legacy table hosts a PrimeVue Popover teleported to body; Reka
+          // modal mode traps focus and disables body pointer-events, making it
+          // unclickable. The unified table has no such overlay.
+          dialogComponentProps: { ...dialogComponentProps, modal: false }
+        })
+        return
+      }
+
+      dialogService.showLayoutDialog({
+        key: DIALOG_KEY,
+        component: defineAsyncComponent(
+          () =>
+            import('@/platform/workspace/components/SubscriptionRequiredDialogContentUnified.vue')
+        ),
+        props: {
+          onClose: hide,
+          reason: options?.reason,
+          // A team workspace lands on the For Teams tab; personal on For
+          // Personal. An explicit caller (e.g. an "Upgrade to Team" CTA) can
+          // override via options.planMode.
+          initialPlanMode:
+            options?.planMode ??
+            (workspaceStore.isInPersonalWorkspace ? 'personal' : 'team')
+        },
+        dialogComponentProps: {
+          // The dialog hugs its content so each step sizes itself: the pricing
+          // table stays wide/fixed (cards fill it, DES QA 2026-06-13) while the
+          // compact confirm/success steps shrink instead of floating in the big
+          // pricing modal. Sizes are set on the content root per checkoutStep.
+          style: 'max-width: 95vw; max-height: 90vh;',
+          pt: {
+            root: { class: 'rounded-2xl bg-transparent' },
+            content: {
+              class:
+                '!p-0 rounded-2xl border border-border-default bg-secondary-background shadow-[0_25px_80px_rgba(5,6,12,0.45)]'
+            }
+          }
+        }
+      })
+      return
     }
 
     dialogService.showLayoutDialog({
       key: DIALOG_KEY,
-      component,
-      props: useWorkspaceVariant ? workspaceProps : personalProps,
-      dialogComponentProps: {
-        renderer: 'reka',
-        size: 'full',
-        // The pricing tables host a PrimeVue Popover teleported to body.
-        // Reka's modal mode traps focus and disables body pointer-events,
-        // making the popover unclickable. Mirrors Settings/Manager.
-        modal: false,
-        contentClass:
-          'w-[min(1328px,95vw)] max-w-[min(1328px,95vw)] sm:max-w-[min(1328px,95vw)] h-full max-h-[958px] overflow-hidden rounded-2xl border-border-default bg-base-background/60 shadow-[0_25px_80px_rgba(5,6,12,0.45)] backdrop-blur-md'
-      }
+      component: defineAsyncComponent(
+        () =>
+          import('@/platform/cloud/subscription/components/SubscriptionRequiredDialogContent.vue')
+      ),
+      props: {
+        onClose: hide,
+        reason: options?.reason,
+        onChooseTeam: () => startTeamWorkspaceUpgradeFlow()
+      },
+      dialogComponentProps
     })
   }
 
-  function show(options?: { reason?: SubscriptionDialogReason }) {
+  function show(options?: SubscriptionDialogOptions) {
     if (isFreeTier.value && workspaceStore.isInPersonalWorkspace) {
       const component = defineAsyncComponent(
         () =>
diff --git a/src/platform/cloud/subscription/constants/teamPlanCreditStops.ts b/src/platform/cloud/subscription/constants/teamPlanCreditStops.ts
index f40b994676..03f5a808a2 100644
--- a/src/platform/cloud/subscription/constants/teamPlanCreditStops.ts
+++ b/src/platform/cloud/subscription/constants/teamPlanCreditStops.ts
@@ -6,14 +6,25 @@ export interface CreditStop {
   /**
    * Yearly-commitment discount applied to `usd`, as a whole-number percent.
    * Threshold-based per the pricing decision (Slack — Alex Tov, 2026-05-08):
-   * yearly tiers are 0 / 5 / 10 / 15 / 20% with nothing in between (monthly is
-   * halved, but still being iterated). Only the $700 → 10% tier is
-   * design-confirmed (DES-197 shows "Save 10% ($70)"); the rest follow the
-   * agreed 0/5/10/15/20 sequence and should be re-confirmed with design/BE.
+   * yearly tiers are 0 / 5 / 10 / 15 / 20% with nothing in between.
+   * Monthly halves these (0 / 2.5 / 5 / 7.5 / 10%) — confirmed in PRD: GA Team
+   * Billing ("for monthly the discount is halved"). `CreditSlider` derives the
+   * monthly value from this field via its `cycle` prop, so only the yearly
+   * tiers are stored here.
    */
   discountPercentYearly: number
 }
 
+/** A selected slider stop, as emitted by the pricing table's team column. */
+export interface TeamPlanSelection {
+  /** Pre-discount monthly price in USD (the struck-through list price). */
+  usd: number
+  /** Monthly credit grant at this stop. */
+  credits: number
+  /** Cycle-adjusted discounted monthly price in USD — what the user actually pays. */
+  discountedUsd: number
+}
+
 /**
  * Team-plan credit-subscription slider stops.
  *
@@ -37,3 +48,22 @@ export const TEAM_PLAN_CREDIT_STOPS: readonly CreditStop[] = [
 
 /** Default stop per DES-197: index 2 = $700 / 147,700 credits. */
 export const DEFAULT_TEAM_PLAN_STOP_INDEX = 2
+
+/**
+ * Discounted monthly price for a stop's list `usd`, applying the billing-cycle
+ * discount (yearly = full `discountPercentYearly`; monthly halves it). Shared by
+ * the slider display and the checkout confirm step so the two never drift.
+ * Falls back to the list price when `usd` is not a known stop.
+ */
+export function getDiscountedMonthlyUsd(
+  usd: number,
+  cycle: 'monthly' | 'yearly'
+): number {
+  const stop = TEAM_PLAN_CREDIT_STOPS.find((s) => s.usd === usd)
+  if (!stop) return usd
+  const percent =
+    cycle === 'monthly'
+      ? stop.discountPercentYearly / 2
+      : stop.discountPercentYearly
+  return Math.round(usd * (1 - percent / 100))
+}
diff --git a/src/platform/missingMedia/missingMediaStore.test.ts b/src/platform/missingMedia/missingMediaStore.test.ts
index 262ebae48c..66142c800d 100644
--- a/src/platform/missingMedia/missingMediaStore.test.ts
+++ b/src/platform/missingMedia/missingMediaStore.test.ts
@@ -1,5 +1,6 @@
 import { createPinia, setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
+
 import { useMissingMediaStore } from './missingMediaStore'
 import type { MissingMediaCandidate } from './types'
 
@@ -96,14 +97,6 @@ describe('useMissingMediaStore', () => {
     expect(store.missingMediaNodeIds.has('2')).toBe(true)
   })
 
-  it('hasMissingMediaOnNode checks node presence', () => {
-    const store = useMissingMediaStore()
-    store.setMissingMedia([makeCandidate('42', 'photo.png')])
-
-    expect(store.hasMissingMediaOnNode('42')).toBe(true)
-    expect(store.hasMissingMediaOnNode('99')).toBe(false)
-  })
-
   it('removeMissingMediaByWidget removes matching node+widget entry', () => {
     const store = useMissingMediaStore()
     store.setMissingMedia([
diff --git a/src/platform/missingMedia/missingMediaStore.ts b/src/platform/missingMedia/missingMediaStore.ts
index 6c865bb7ad..67fef98b3d 100644
--- a/src/platform/missingMedia/missingMediaStore.ts
+++ b/src/platform/missingMedia/missingMediaStore.ts
@@ -68,10 +68,6 @@ export const useMissingMediaStore = defineStore('missingMedia', () => {
     missingMediaCandidates.value = media.length ? media : null
   }
 
-  function hasMissingMediaOnNode(nodeLocatorId: string): boolean {
-    return missingMediaNodeIds.value.has(nodeLocatorId)
-  }
-
   function isContainerWithMissingMedia(node: LGraphNode): boolean {
     return activeMissingMediaGraphIds.value.has(String(node.id))
   }
@@ -157,7 +153,6 @@ export const useMissingMediaStore = defineStore('missingMedia', () => {
     clearMissingMedia,
     createVerificationAbortController,
 
-    hasMissingMediaOnNode,
     isContainerWithMissingMedia
   }
 })
diff --git a/src/platform/missingModel/__fixtures__/activeSubgraphUnmatchedModel.json b/src/platform/missingModel/__fixtures__/activeSubgraphUnmatchedModel.json
deleted file mode 100644
index 6be16a28d6..0000000000
--- a/src/platform/missingModel/__fixtures__/activeSubgraphUnmatchedModel.json
+++ /dev/null
@@ -1,83 +0,0 @@
-{
-  "last_node_id": 2,
-  "last_link_id": 0,
-  "nodes": [
-    {
-      "id": 1,
-      "type": "KSampler",
-      "pos": [0, 0],
-      "size": [100, 100],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "properties": {},
-      "widgets_values": [0, "randomize", 20]
-    },
-    {
-      "id": 2,
-      "type": "subgraph-x",
-      "pos": [300, 0],
-      "size": [100, 100],
-      "flags": {},
-      "order": 0,
-      "mode": 0,
-      "properties": {},
-      "widgets_values": []
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {},
-  "version": 0.4,
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "subgraph-x",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 1,
-          "lastLinkId": 0,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "x",
-        "nodes": [
-          {
-            "id": 1,
-            "type": "CheckpointLoaderSimple",
-            "pos": [0, 0],
-            "size": [100, 100],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "properties": {
-              "models": [
-                {
-                  "name": "rare_model.safetensors",
-                  "directory": "checkpoints"
-                }
-              ]
-            },
-            "widgets_values": ["some_other_model.safetensors"]
-          }
-        ],
-        "links": [],
-        "inputNode": { "id": -10, "bounding": [0, 0, 0, 0] },
-        "outputNode": { "id": -20, "bounding": [0, 0, 0, 0] },
-        "inputs": [],
-        "outputs": [],
-        "widgets": []
-      }
-    ]
-  },
-  "models": [
-    {
-      "name": "rare_model.safetensors",
-      "url": "https://example.com/rare",
-      "directory": "checkpoints"
-    }
-  ]
-}
diff --git a/src/platform/missingModel/__fixtures__/bypassedSubgraphUnmatchedModel.json b/src/platform/missingModel/__fixtures__/bypassedSubgraphUnmatchedModel.json
deleted file mode 100644
index 959b1034ee..0000000000
--- a/src/platform/missingModel/__fixtures__/bypassedSubgraphUnmatchedModel.json
+++ /dev/null
@@ -1,83 +0,0 @@
-{
-  "last_node_id": 2,
-  "last_link_id": 0,
-  "nodes": [
-    {
-      "id": 1,
-      "type": "KSampler",
-      "pos": [0, 0],
-      "size": [100, 100],
-      "flags": {},
-      "order": 1,
-      "mode": 0,
-      "properties": {},
-      "widgets_values": [0, "randomize", 20]
-    },
-    {
-      "id": 2,
-      "type": "subgraph-x",
-      "pos": [300, 0],
-      "size": [100, 100],
-      "flags": {},
-      "order": 0,
-      "mode": 4,
-      "properties": {},
-      "widgets_values": []
-    }
-  ],
-  "links": [],
-  "groups": [],
-  "config": {},
-  "extra": {},
-  "version": 0.4,
-  "definitions": {
-    "subgraphs": [
-      {
-        "id": "subgraph-x",
-        "version": 1,
-        "state": {
-          "lastGroupId": 0,
-          "lastNodeId": 1,
-          "lastLinkId": 0,
-          "lastRerouteId": 0
-        },
-        "revision": 0,
-        "config": {},
-        "name": "x",
-        "nodes": [
-          {
-            "id": 1,
-            "type": "CheckpointLoaderSimple",
-            "pos": [0, 0],
-            "size": [100, 100],
-            "flags": {},
-            "order": 0,
-            "mode": 0,
-            "properties": {
-              "models": [
-                {
-                  "name": "rare_model.safetensors",
-                  "directory": "checkpoints"
-                }
-              ]
-            },
-            "widgets_values": ["some_other_model.safetensors"]
-          }
-        ],
-        "links": [],
-        "inputNode": { "id": -10, "bounding": [0, 0, 0, 0] },
-        "outputNode": { "id": -20, "bounding": [0, 0, 0, 0] },
-        "inputs": [],
-        "outputs": [],
-        "widgets": []
-      }
-    ]
-  },
-  "models": [
-    {
-      "name": "rare_model.safetensors",
-      "url": "https://example.com/rare",
-      "directory": "checkpoints"
-    }
-  ]
-}
diff --git a/src/platform/missingModel/missingModelPipeline.test.ts b/src/platform/missingModel/missingModelPipeline.test.ts
index b6c1b1cda3..4b18041727 100644
--- a/src/platform/missingModel/missingModelPipeline.test.ts
+++ b/src/platform/missingModel/missingModelPipeline.test.ts
@@ -34,10 +34,6 @@ const { mockHandles } = vi.hoisted(() => {
       executionErrorStore: {
         surfaceMissingModels: vi.fn()
       },
-      modelStore: {
-        loadModelFolders: vi.fn(),
-        getLoadedModelFolder: vi.fn()
-      },
       modelToNodeStore: {
         getCategoryForNodeType: vi.fn()
       },
@@ -49,14 +45,9 @@ const { mockHandles } = vi.hoisted(() => {
         ): MissingModelCandidate[] => []
       ),
       enrichWithEmbeddedMetadata: vi.fn(
-        async (
+        (
           _candidates: readonly MissingModelCandidate[],
-          _graphData: ComfyWorkflowJSON,
-          _checkModelInstalled: (
-            name: string,
-            directory: string
-          ) => Promise<boolean>,
-          _isAssetSupported?: (nodeType: string, widgetName: string) => boolean
+          _graphData: ComfyWorkflowJSON
         ) => state.enrichedCandidates
       ),
       verifyAssetSupportedCandidates: vi.fn(
@@ -104,10 +95,6 @@ vi.mock('@/stores/executionErrorStore', () => ({
   useExecutionErrorStore: () => mockHandles.executionErrorStore
 }))
 
-vi.mock('@/stores/modelStore', () => ({
-  useModelStore: () => mockHandles.modelStore
-}))
-
 vi.mock('@/stores/modelToNodeStore', () => ({
   useModelToNodeStore: () => mockHandles.modelToNodeStore
 }))
@@ -121,16 +108,8 @@ vi.mock('@/platform/missingModel/missingModelScan', () => ({
     mockHandles.scanAllModelCandidates(graph, isAssetSupported, getDirectory),
   enrichWithEmbeddedMetadata: (
     candidates: readonly MissingModelCandidate[],
-    graphData: ComfyWorkflowJSON,
-    checkModelInstalled: (name: string, directory: string) => Promise<boolean>,
-    isAssetSupported?: (nodeType: string, widgetName: string) => boolean
-  ) =>
-    mockHandles.enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      checkModelInstalled,
-      isAssetSupported
-    ),
+    graphData: ComfyWorkflowJSON
+  ) => mockHandles.enrichWithEmbeddedMetadata(candidates, graphData),
   verifyAssetSupportedCandidates: (
     candidates: readonly MissingModelCandidate[],
     signal: AbortSignal
@@ -186,8 +165,6 @@ describe('missingModelPipeline', () => {
     mockHandles.missingModelStore.createVerificationAbortController.mockImplementation(
       () => new AbortController()
     )
-    mockHandles.modelStore.loadModelFolders.mockResolvedValue(undefined)
-    mockHandles.modelStore.getLoadedModelFolder.mockResolvedValue(undefined)
     mockHandles.modelToNodeStore.getCategoryForNodeType.mockReturnValue(
       undefined
     )
@@ -253,9 +230,7 @@ describe('missingModelPipeline', () => {
 
       expect(mockHandles.enrichWithEmbeddedMetadata).toHaveBeenCalledWith(
         expect.any(Array),
-        expect.objectContaining({ models: activeModels }),
-        expect.any(Function),
-        undefined
+        expect.objectContaining({ models: activeModels })
       )
       expect(
         mockHandles.executionErrorStore.surfaceMissingModels
@@ -305,9 +280,7 @@ describe('missingModelPipeline', () => {
               hash_type: 'sha256'
             }
           ]
-        }),
-        expect.any(Function),
-        undefined
+        })
       )
       expect(
         mockHandles.executionErrorStore.surfaceMissingModels
@@ -325,9 +298,7 @@ describe('missingModelPipeline', () => {
 
       expect(mockHandles.enrichWithEmbeddedMetadata).toHaveBeenCalledWith(
         expect.any(Array),
-        graphData,
-        expect.any(Function),
-        undefined
+        graphData
       )
     })
 
diff --git a/src/platform/missingModel/missingModelPipeline.ts b/src/platform/missingModel/missingModelPipeline.ts
index 8ccb71018e..864a198b5a 100644
--- a/src/platform/missingModel/missingModelPipeline.ts
+++ b/src/platform/missingModel/missingModelPipeline.ts
@@ -15,7 +15,6 @@ import type { ComfyWorkflow } from '@/platform/workflow/management/stores/comfyW
 import type { ModelFile } from '@/platform/workflow/validation/schemas/workflowSchema'
 import { api } from '@/scripts/api'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
-import { useModelStore } from '@/stores/modelStore'
 import { useModelToNodeStore } from '@/stores/modelToNodeStore'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import type { MissingNodeType } from '@/types/comfy'
@@ -121,20 +120,7 @@ export async function runMissingModelPipeline({
     getDirectory
   )
 
-  const modelStore = useModelStore()
-  await modelStore.loadModelFolders()
-  const enrichedAll = await enrichWithEmbeddedMetadata(
-    candidates,
-    graphData,
-    async (name, directory) => {
-      const folder = await modelStore.getLoadedModelFolder(directory)
-      const models = folder?.models
-      return !!(
-        models && Object.values(models).some((m) => m.file_name === name)
-      )
-    },
-    isCloud ? isAssetBrowserWidget : undefined
-  )
+  const enrichedAll = enrichWithEmbeddedMetadata(candidates, graphData)
 
   // Drop candidates whose enclosing subgraph is muted/bypassed. Per-node
   // scans only checked each node's own mode; the cascade from an
diff --git a/src/platform/missingModel/missingModelScan.test.ts b/src/platform/missingModel/missingModelScan.test.ts
index 879ba8de89..bfe2b1ceb1 100644
--- a/src/platform/missingModel/missingModelScan.test.ts
+++ b/src/platform/missingModel/missingModelScan.test.ts
@@ -15,8 +15,6 @@ import {
   verifyAssetSupportedCandidates,
   MODEL_FILE_EXTENSIONS
 } from '@/platform/missingModel/missingModelScan'
-import activeSubgraphUnmatchedModel from '@/platform/missingModel/__fixtures__/activeSubgraphUnmatchedModel.json' with { type: 'json' }
-import bypassedSubgraphUnmatchedModel from '@/platform/missingModel/__fixtures__/bypassedSubgraphUnmatchedModel.json' with { type: 'json' }
 import type { MissingModelCandidate } from '@/platform/missingModel/types'
 import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/workflowSchema'
 
@@ -671,11 +669,8 @@ function makeCandidate(
   }
 }
 
-const alwaysMissing = async () => false
-const alwaysInstalled = async () => true
-
 describe('enrichWithEmbeddedMetadata', () => {
-  it('enriches existing candidate with url and directory from embedded metadata', async () => {
+  it('enriches existing candidate with url and directory from embedded metadata', () => {
     const candidates = [makeCandidate('model_a.safetensors')]
     const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
@@ -709,18 +704,14 @@ describe('enrichWithEmbeddedMetadata', () => {
       ]
     })
 
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing
-    )
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
     expect(result[0].url).toBe('https://example.com/model_a')
     expect(result[0].directory).toBe('checkpoints')
     expect(result[0].hash).toBe('abc123')
   })
 
-  it('does not overwrite existing fields on candidate', async () => {
+  it('does not overwrite existing fields on candidate', () => {
     const candidates = [
       makeCandidate('model_a.safetensors', {
         directory: 'existing_dir',
@@ -757,18 +748,13 @@ describe('enrichWithEmbeddedMetadata', () => {
       ]
     })
 
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing
-    )
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
-    // ??= should not overwrite existing values
     expect(result[0].url).toBe('https://existing.com')
     expect(result[0].directory).toBe('existing_dir')
   })
 
-  it('does not mutate the original candidates array', async () => {
+  it('does not mutate the original candidates array', () => {
     const candidates = [makeCandidate('model_a.safetensors')]
     const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
@@ -801,12 +787,12 @@ describe('enrichWithEmbeddedMetadata', () => {
     })
 
     const originalUrl = candidates[0].url
-    await enrichWithEmbeddedMetadata(candidates, graphData, alwaysMissing)
+    enrichWithEmbeddedMetadata(candidates, graphData)
 
     expect(candidates[0].url).toBe(originalUrl)
   })
 
-  it('adds new candidate for embedded model not found by COMBO scan', async () => {
+  it('does not add a candidate for embedded metadata without a live candidate', () => {
     const candidates: MissingModelCandidate[] = []
     const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
@@ -838,18 +824,12 @@ describe('enrichWithEmbeddedMetadata', () => {
       ]
     })
 
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing
-    )
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
-    expect(result).toHaveLength(1)
-    expect(result[0].name).toBe('model_a.safetensors')
-    expect(result[0].isMissing).toBe(true)
+    expect(result).toHaveLength(0)
   })
 
-  it('does not add candidate when model is already installed', async () => {
+  it('does not add a candidate from root metadata without live references', () => {
     const candidates: MissingModelCandidate[] = []
     const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 0,
@@ -869,117 +849,12 @@ describe('enrichWithEmbeddedMetadata', () => {
       ]
     })
 
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysInstalled
-    )
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
     expect(result).toHaveLength(0)
   })
 
-  it('skips embedded models from muted nodes', async () => {
-    const candidates: MissingModelCandidate[] = []
-    const graphData = fromPartial<ComfyWorkflowJSON>({
-      last_node_id: 1,
-      last_link_id: 0,
-      nodes: [
-        {
-          id: 1,
-          type: 'CheckpointLoaderSimple',
-          pos: [0, 0],
-          size: [100, 100],
-          flags: {},
-          order: 0,
-          mode: 2, // NEVER (muted)
-          properties: {},
-          widgets_values: { ckpt_name: 'model.safetensors' }
-        }
-      ],
-      links: [],
-      groups: [],
-      config: {},
-      extra: {},
-      version: 0.4,
-      models: [
-        {
-          name: 'model.safetensors',
-          url: 'https://example.com/model',
-          directory: 'checkpoints'
-        }
-      ]
-    })
-
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing
-    )
-
-    expect(result).toHaveLength(0)
-  })
-
-  it('drops workflow-level model entries when only referencing nodes are bypassed (other active nodes present)', async () => {
-    // Regression: a previous `hasActiveNodes` check kept workflow-level
-    // models in a mixed graph if ANY active node existed, even when every
-    // node that actually referenced the model was bypassed. The correct
-    // check drops unmatched workflow-level entries since candidates are
-    // derived from active-node widgets.
-    const candidates: MissingModelCandidate[] = []
-    const graphData = fromPartial<ComfyWorkflowJSON>({
-      last_node_id: 2,
-      last_link_id: 0,
-      nodes: [
-        {
-          id: 1,
-          type: 'CheckpointLoaderSimple',
-          pos: [0, 0],
-          size: [100, 100],
-          flags: {},
-          order: 0,
-          mode: 4, // BYPASS — only node referencing the model
-          properties: {},
-          widgets_values: { ckpt_name: 'model.safetensors' }
-        },
-        {
-          id: 2,
-          type: 'KSampler',
-          pos: [200, 0],
-          size: [100, 100],
-          flags: {},
-          order: 1,
-          mode: 0, // ALWAYS — unrelated active node
-          properties: {},
-          widgets_values: {}
-        }
-      ],
-      links: [],
-      groups: [],
-      config: {},
-      extra: {},
-      version: 0.4,
-      models: [
-        {
-          name: 'model.safetensors',
-          url: 'https://example.com/model',
-          directory: 'checkpoints'
-        }
-      ]
-    })
-
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing
-    )
-
-    expect(result).toHaveLength(0)
-  })
-
-  it('keeps unmatched node-sourced entries in a mixed graph', async () => {
-    // A node-sourced unmatched entry (sourceNodeType !== '') must survive
-    // the workflow-level filter. This ensures the simplification does not
-    // over-filter legitimate per-node missing models.
+  it('enriches existing candidates from node-sourced metadata', () => {
     const candidates = [
       makeCandidate('node_model.safetensors', { nodeId: '1' })
     ]
@@ -1015,18 +890,14 @@ describe('enrichWithEmbeddedMetadata', () => {
       models: []
     })
 
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing
-    )
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
     expect(result).toHaveLength(1)
-    expect(result[0].name).toBe('node_model.safetensors')
+    expect(result[0].url).toBe('https://example.com/node_model')
   })
 
-  it('skips embedded models from bypassed nodes', async () => {
-    const candidates: MissingModelCandidate[] = []
+  it('does not enrich from muted node metadata', () => {
+    const candidates = [makeCandidate('model.safetensors')]
     const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
@@ -1038,8 +909,16 @@ describe('enrichWithEmbeddedMetadata', () => {
           size: [100, 100],
           flags: {},
           order: 0,
-          mode: 4, // BYPASS
-          properties: {},
+          mode: 2,
+          properties: {
+            models: [
+              {
+                name: 'model.safetensors',
+                url: 'https://example.com/model',
+                directory: 'checkpoints'
+              }
+            ]
+          },
           widgets_values: { ckpt_name: 'model.safetensors' }
         }
       ],
@@ -1048,58 +927,152 @@ describe('enrichWithEmbeddedMetadata', () => {
       config: {},
       extra: {},
       version: 0.4,
-      models: [
-        {
-          name: 'model.safetensors',
-          url: 'https://example.com/model',
-          directory: 'checkpoints'
-        }
-      ]
+      models: []
     })
 
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing
-    )
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
-    expect(result).toHaveLength(0)
+    expect(result[0].url).toBeUndefined()
   })
 
-  it('drops workflow-level entries when only reference is in a bypassed subgraph interior', async () => {
-    // Interior properties.models references the workflow-level model
-    // but its widget value does not — forcing the workflow-level entry
-    // down the unmatched path where isModelReferencedByActiveNode
-    // decides. Previously the helper ignored the bypassed container.
-    const result = await enrichWithEmbeddedMetadata(
-      [],
-      fromAny<ComfyWorkflowJSON, unknown>(bypassedSubgraphUnmatchedModel),
-      alwaysMissing
-    )
+  it('does not enrich from bypassed node metadata', () => {
+    const candidates = [makeCandidate('model.safetensors')]
+    const graphData = fromPartial<ComfyWorkflowJSON>({
+      last_node_id: 1,
+      last_link_id: 0,
+      nodes: [
+        {
+          id: 1,
+          type: 'CheckpointLoaderSimple',
+          pos: [0, 0],
+          size: [100, 100],
+          flags: {},
+          order: 0,
+          mode: 4,
+          properties: {
+            models: [
+              {
+                name: 'model.safetensors',
+                url: 'https://example.com/model',
+                directory: 'checkpoints'
+              }
+            ]
+          },
+          widgets_values: { ckpt_name: 'model.safetensors' }
+        }
+      ],
+      links: [],
+      groups: [],
+      config: {},
+      extra: {},
+      version: 0.4,
+      models: []
+    })
 
-    expect(result).toHaveLength(0)
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
+
+    expect(result[0].url).toBeUndefined()
   })
 
-  it('keeps workflow-level entries when reference is in an active subgraph interior', async () => {
-    // Positive control for the bypassed case above: identical fixture
-    // with container mode=0 must still surface the unmatched workflow-
-    // level model. Guards against a regression where the ancestor gate
-    // drops every workflow-level entry regardless of context.
-    const result = await enrichWithEmbeddedMetadata(
-      [],
-      fromAny<ComfyWorkflowJSON, unknown>(activeSubgraphUnmatchedModel),
-      alwaysMissing
-    )
+  it.for([
+    { state: 'muted', ancestorMode: 2 },
+    { state: 'bypassed', ancestorMode: 4 }
+  ])(
+    'does not enrich from metadata inside a $state ancestor subgraph',
+    ({ ancestorMode }) => {
+      const candidates = [
+        makeCandidate('shared_model.safetensors', {
+          directory: 'checkpoints'
+        })
+      ]
+      const graphData = fromPartial<ComfyWorkflowJSON>({
+        last_node_id: 2,
+        last_link_id: 0,
+        nodes: [
+          {
+            id: 1,
+            type: 'CheckpointLoaderSimple',
+            pos: [0, 0],
+            size: [100, 100],
+            flags: {},
+            order: 0,
+            mode: 0,
+            properties: {},
+            widgets_values: { ckpt_name: 'shared_model.safetensors' }
+          },
+          {
+            id: 2,
+            type: 'InactiveSubgraph',
+            pos: [200, 0],
+            size: [100, 100],
+            flags: {},
+            order: 1,
+            mode: ancestorMode,
+            properties: {},
+            widgets_values: {}
+          }
+        ],
+        links: [],
+        groups: [],
+        config: {},
+        extra: {},
+        version: 0.4,
+        models: [],
+        definitions: {
+          subgraphs: [
+            {
+              id: 'InactiveSubgraph',
+              name: 'InactiveSubgraph',
+              nodes: [
+                {
+                  id: 10,
+                  type: 'CheckpointLoaderSimple',
+                  pos: [0, 0],
+                  size: [100, 100],
+                  flags: {},
+                  order: 0,
+                  mode: 0,
+                  properties: {
+                    models: [
+                      {
+                        name: 'shared_model.safetensors',
+                        url: 'https://example.com/inactive-branch',
+                        directory: 'checkpoints',
+                        hash: 'inactive-hash',
+                        hash_type: 'sha256'
+                      }
+                    ]
+                  },
+                  widgets_values: {
+                    ckpt_name: 'shared_model.safetensors'
+                  }
+                }
+              ],
+              links: [],
+              groups: [],
+              config: {},
+              extra: {},
+              inputNode: {},
+              outputNode: {}
+            }
+          ]
+        }
+      })
 
-    expect(result).toHaveLength(1)
-    expect(result[0].name).toBe('rare_model.safetensors')
-  })
+      const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
-  it('drops workflow-level entries when interior reference is under a different directory', async () => {
-    // Same name, different directory: the interior's properties.models
-    // entry is not the same asset as the workflow-level entry, so the
-    // fallback helper must not treat it as a reference that keeps the
-    // workflow-level model alive.
+      expect(result[0].url).toBeUndefined()
+      expect(result[0].hash).toBeUndefined()
+      expect(result[0].hashType).toBeUndefined()
+    }
+  )
+
+  it('does not enrich candidates from different-directory metadata', () => {
+    const candidates = [
+      makeCandidate('collide_model.safetensors', {
+        directory: 'checkpoints'
+      })
+    ]
     const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
@@ -1132,43 +1105,19 @@ describe('enrichWithEmbeddedMetadata', () => {
         {
           name: 'collide_model.safetensors',
           url: 'https://example.com/collide',
-          directory: 'checkpoints'
+          directory: 'loras'
         }
       ]
     })
 
-    const result = await enrichWithEmbeddedMetadata(
-      [],
-      graphData,
-      alwaysMissing
-    )
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
-    expect(result).toHaveLength(0)
+    expect(result[0].url).toBeUndefined()
   })
 })
 
 describe('OSS missing model detection (non-Cloud path)', () => {
-  it('scanAllModelCandidates returns empty array when not called (simulating isCloud === false guard)', () => {
-    // In the app, when isCloud is false, scanAllModelCandidates is not called
-    // and an empty array is used instead. This test verifies the OSS path
-    // starts with an empty candidates list.
-    const isCloud = false
-    const graph = makeGraph([
-      makeNode(1, 'CheckpointLoaderSimple', [
-        makeComboWidget('ckpt_name', 'missing_model.safetensors', [])
-      ])
-    ])
-
-    const modelCandidates = isCloud
-      ? scanAllModelCandidates(graph, noAssetSupport)
-      : []
-
-    expect(modelCandidates).toEqual([])
-  })
-
-  it('enrichWithEmbeddedMetadata detects missing embedded models without prior COMBO scan (OSS dialog path)', async () => {
-    // OSS path: candidates start empty, enrichWithEmbeddedMetadata adds
-    // missing embedded models so the dialog can show them.
+  it('does not detect embedded models without prior candidate scan', () => {
     const candidates: MissingModelCandidate[] = []
     const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 2,
@@ -1216,67 +1165,15 @@ describe('OSS missing model detection (non-Cloud path)', () => {
       ]
     })
 
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing
-    )
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
-    expect(result).toHaveLength(2)
-    expect(result.every((c) => c.isMissing === true)).toBe(true)
-    expect(result.map((c) => c.name)).toEqual([
-      'sd_xl_base_1.0.safetensors',
-      'detail_enhancer.safetensors'
-    ])
+    expect(result).toHaveLength(0)
   })
 
-  it('enrichWithEmbeddedMetadata sets isMissing=true when isAssetSupported is not provided (OSS)', async () => {
-    // When isAssetSupported is omitted (OSS), unmatched embedded models
-    // should have isMissing=true (not undefined), enabling the dialog.
-    const candidates: MissingModelCandidate[] = []
-    const graphData = fromPartial<ComfyWorkflowJSON>({
-      last_node_id: 1,
-      last_link_id: 0,
-      nodes: [
-        {
-          id: 1,
-          type: 'CheckpointLoaderSimple',
-          pos: [0, 0],
-          size: [100, 100],
-          flags: {},
-          order: 0,
-          mode: 0,
-          properties: {},
-          widgets_values: { ckpt_name: 'missing_model.safetensors' }
-        }
-      ],
-      links: [],
-      groups: [],
-      config: {},
-      extra: {},
-      version: 0.4,
-      models: [
-        {
-          name: 'missing_model.safetensors',
-          url: 'https://example.com/model',
-          directory: 'checkpoints'
-        }
-      ]
-    })
-
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing
-    )
-
-    expect(result).toHaveLength(1)
-    expect(result[0].isMissing).toBe(true)
-    expect(result[0].isAssetSupported).toBe(false)
-  })
-
-  it('enrichWithEmbeddedMetadata correctly filters for dialog: only isMissing=true with url', async () => {
-    const candidates: MissingModelCandidate[] = []
+  it('enriches live OSS candidates for dialog filtering', () => {
+    const candidates: MissingModelCandidate[] = [
+      makeCandidate('missing_model.safetensors')
+    ]
     const graphData = fromPartial<ComfyWorkflowJSON>({
       last_node_id: 1,
       last_link_id: 0,
@@ -1312,64 +1209,13 @@ describe('OSS missing model detection (non-Cloud path)', () => {
       ]
     })
 
-    const selectiveInstallCheck = async (name: string) =>
-      name === 'installed_model.safetensors'
-
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      selectiveInstallCheck
-    )
+    const result = enrichWithEmbeddedMetadata(candidates, graphData)
 
     const dialogModels = result.filter((c) => c.isMissing === true && c.url)
     expect(dialogModels).toHaveLength(1)
     expect(dialogModels[0].name).toBe('missing_model.safetensors')
     expect(dialogModels[0].url).toBe('https://example.com/model')
   })
-
-  it('enrichWithEmbeddedMetadata with isAssetSupported leaves isMissing undefined for asset-supported models (Cloud path)', async () => {
-    const candidates: MissingModelCandidate[] = []
-    const graphData = fromPartial<ComfyWorkflowJSON>({
-      last_node_id: 1,
-      last_link_id: 0,
-      nodes: [
-        {
-          id: 1,
-          type: 'CheckpointLoaderSimple',
-          pos: [0, 0],
-          size: [100, 100],
-          flags: {},
-          order: 0,
-          mode: 0,
-          properties: {},
-          widgets_values: { ckpt_name: 'model.safetensors' }
-        }
-      ],
-      links: [],
-      groups: [],
-      config: {},
-      extra: {},
-      version: 0.4,
-      models: [
-        {
-          name: 'model.safetensors',
-          url: 'https://example.com/model',
-          directory: 'checkpoints'
-        }
-      ]
-    })
-
-    const result = await enrichWithEmbeddedMetadata(
-      candidates,
-      graphData,
-      alwaysMissing,
-      () => true
-    )
-
-    expect(result).toHaveLength(1)
-    expect(result[0].isMissing).toBeUndefined()
-    expect(result[0].isAssetSupported).toBe(true)
-  })
 })
 
 const { mockUpdateModelsForNodeType, mockGetAssets } = vi.hoisted(() => ({
diff --git a/src/platform/missingModel/missingModelScan.ts b/src/platform/missingModel/missingModelScan.ts
index 34708b4a63..ccc51856e1 100644
--- a/src/platform/missingModel/missingModelScan.ts
+++ b/src/platform/missingModel/missingModelScan.ts
@@ -1,11 +1,7 @@
 import type { ModelFile } from '@/platform/workflow/validation/schemas/workflowSchema'
 import type { FlattenableWorkflowGraph } from '@/platform/workflow/core/utils/workflowFlattening'
 import { flattenWorkflowNodes } from '@/platform/workflow/core/utils/workflowFlattening'
-import type {
-  MissingModelCandidate,
-  MissingModelViewModel,
-  EmbeddedModelWithSource
-} from './types'
+import type { MissingModelCandidate, MissingModelViewModel } from './types'
 import { getAssetFilename } from '@/platform/assets/utils/assetMetadataUtils'
 import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
 // eslint-disable-next-line import-x/no-restricted-paths
@@ -17,13 +13,14 @@ import type {
   IBaseWidget,
   IComboWidget
 } from '@/lib/litegraph/src/types/widgets'
-import { getParentExecutionIds } from '@/types/nodeIdentification'
+import type { NodeExecutionId } from '@/types/nodeIdentification'
 import {
   collectAllNodes,
   getExecutionIdByNode
 } from '@/utils/graphTraversalUtil'
 import { LGraphEventMode } from '@/lib/litegraph/src/types/globalEnums'
 import { resolveComboValues } from '@/utils/litegraphUtil'
+import { getParentExecutionIds } from '@/types/nodeIdentification'
 
 export type MissingModelWorkflowData = FlattenableWorkflowGraph & {
   models?: ModelFile[]
@@ -70,6 +67,10 @@ function isAssetWidget(widget: IBaseWidget): widget is IAssetWidget {
   return widget.type === 'asset'
 }
 
+function isInactiveMode(mode: number | undefined): boolean {
+  return mode === LGraphEventMode.NEVER || mode === LGraphEventMode.BYPASS
+}
+
 // Full set of model file extensions used for scanning candidate widgets.
 // Intentionally broader than ALLOWED_SUFFIXES in missingModelDownload.ts,
 // which restricts which files are eligible for download.
@@ -111,11 +112,7 @@ export function scanAllModelCandidates(
     // Skip subgraph container nodes: their promoted widgets are synthetic
     // views of interior widgets, which are already scanned via recursion.
     if (node.isSubgraphNode?.()) continue
-    if (
-      node.mode === LGraphEventMode.NEVER ||
-      node.mode === LGraphEventMode.BYPASS
-    )
-      continue
+    if (isInactiveMode(node.mode)) continue
 
     candidates.push(
       ...scanNodeModelCandidates(
@@ -173,7 +170,7 @@ export function scanNodeModelCandidates(
 function scanAssetWidget(
   node: { type: string },
   widget: IAssetWidget,
-  executionId: string,
+  executionId: NodeExecutionId,
   getDirectory: ((nodeType: string) => string | undefined) | undefined
 ): MissingModelCandidate | null {
   const value = widget.value
@@ -194,7 +191,7 @@ function scanAssetWidget(
 function scanComboWidget(
   node: { type: string },
   widget: IComboWidget,
-  executionId: string,
+  executionId: NodeExecutionId,
   isAssetSupported: (nodeType: string, widgetName: string) => boolean,
   getDirectory: ((nodeType: string) => string | undefined) | undefined
 ): MissingModelCandidate | null {
@@ -217,14 +214,12 @@ function scanComboWidget(
   }
 }
 
-export async function enrichWithEmbeddedMetadata(
+export function enrichWithEmbeddedMetadata(
   candidates: readonly MissingModelCandidate[],
-  graphData: MissingModelWorkflowData,
-  checkModelInstalled: (name: string, directory: string) => Promise<boolean>,
-  isAssetSupported?: (nodeType: string, widgetName: string) => boolean
-): Promise<MissingModelCandidate[]> {
+  graphData: MissingModelWorkflowData
+): MissingModelCandidate[] {
   const allNodes = flattenWorkflowNodes(graphData)
-  const embeddedModels = collectEmbeddedModelsWithSource(allNodes, graphData)
+  const embeddedModels = collectEmbeddedModels(allNodes, graphData)
 
   const enriched = candidates.map((c) => ({ ...c }))
   const candidatesByKey = new Map<string, MissingModelCandidate[]>()
@@ -240,7 +235,7 @@ export async function enrichWithEmbeddedMetadata(
     else candidatesByKey.set(nameKey, [c])
   }
 
-  const deduped: EmbeddedModelWithSource[] = []
+  const deduped: ModelFile[] = []
   const enrichedKeys = new Set<string>()
   for (const model of embeddedModels) {
     const dedupeKey = `${model.name}::${model.directory}`
@@ -249,195 +244,60 @@ export async function enrichWithEmbeddedMetadata(
     deduped.push(model)
   }
 
-  const unmatched: EmbeddedModelWithSource[] = []
   for (const model of deduped) {
     const dirKey = `${model.name}::${model.directory}`
     const exact = candidatesByKey.get(dirKey)
     const fallback = candidatesByKey.get(model.name)
     const existing = exact?.length ? exact : fallback
-    if (existing) {
-      for (const c of existing) {
-        if (c.directory && c.directory !== model.directory) continue
-        c.directory ??= model.directory
-        c.url ??= model.url
-        c.hash ??= model.hash
-        c.hashType ??= model.hash_type
-      }
-    } else {
-      unmatched.push(model)
+    if (!existing) continue
+    for (const c of existing) {
+      if (c.directory && c.directory !== model.directory) continue
+      c.directory ??= model.directory
+      c.url ??= model.url
+      c.hash ??= model.hash
+      c.hashType ??= model.hash_type
     }
   }
 
-  // Workflow-level entries (sourceNodeType === '') survive only when
-  // some active (non-muted, non-bypassed) node actually references the
-  // model — not merely because any unrelated active node exists. A
-  // reference is any widget value (or node.properties.models entry)
-  // that matches the model name on an active node.
-  // Hoist the id→node map once; isModelReferencedByActiveNode would
-  // otherwise rebuild it on every unmatched entry.
-  const flattenedNodeById = new Map(allNodes.map((n) => [String(n.id), n]))
-  const activeUnmatched = unmatched.filter(
-    (m) =>
-      m.sourceNodeType !== '' ||
-      isModelReferencedByActiveNode(
-        m.name,
-        m.directory,
-        allNodes,
-        flattenedNodeById
-      )
-  )
-
-  const settled = await Promise.allSettled(
-    activeUnmatched.map(async (model) => {
-      const installed = await checkModelInstalled(model.name, model.directory)
-      if (installed) return null
-
-      const nodeIsAssetSupported = isAssetSupported
-        ? isAssetSupported(model.sourceNodeType, model.sourceWidgetName)
-        : false
-
-      return {
-        nodeId: model.sourceNodeId,
-        nodeType: model.sourceNodeType,
-        widgetName: model.sourceWidgetName,
-        isAssetSupported: nodeIsAssetSupported,
-        name: model.name,
-        directory: model.directory,
-        url: model.url,
-        hash: model.hash,
-        hashType: model.hash_type,
-        isMissing: nodeIsAssetSupported ? undefined : true
-      } satisfies MissingModelCandidate
-    })
-  )
-
-  for (const r of settled) {
-    if (r.status === 'rejected') {
-      console.warn(
-        '[Missing Model Pipeline] checkModelInstalled failed:',
-        r.reason
-      )
-      continue
-    }
-    if (r.value) enriched.push(r.value)
-  }
-
   return enriched
 }
 
-function isModelReferencedByActiveNode(
-  modelName: string,
-  modelDirectory: string | undefined,
-  allNodes: ReturnType<typeof flattenWorkflowNodes>,
-  nodeById: Map<string, ReturnType<typeof flattenWorkflowNodes>[number]>
-): boolean {
-  for (const node of allNodes) {
-    if (
-      node.mode === LGraphEventMode.NEVER ||
-      node.mode === LGraphEventMode.BYPASS
-    )
-      continue
-    if (!isAncestorPathActiveInFlattened(String(node.id), nodeById)) continue
-
-    // Require directory agreement when both sides specify one, so a
-    // same-name entry under a different folder does not keep an
-    // unrelated workflow-level model alive as missing.
-    const embeddedModels = (
-      node.properties as
-        | { models?: Array<{ name: string; directory?: string }> }
-        | undefined
-    )?.models
-    if (
-      embeddedModels?.some(
-        (m) =>
-          m.name === modelName &&
-          (modelDirectory === undefined ||
-            m.directory === undefined ||
-            m.directory === modelDirectory)
-      )
-    ) {
-      return true
-    }
-
-    // widgets_values carries only the name, so directory cannot be
-    // checked here — fall back to filename matching.
-    const values = node.widgets_values
-    if (!values) continue
-    const valueArray = Array.isArray(values) ? values : Object.values(values)
-    for (const v of valueArray) {
-      if (typeof v === 'string' && v === modelName) return true
-    }
-  }
-  return false
-}
-
-function isAncestorPathActiveInFlattened(
-  executionId: string,
-  nodeById: Map<string, ReturnType<typeof flattenWorkflowNodes>[number]>
-): boolean {
-  for (const ancestorId of getParentExecutionIds(executionId)) {
-    const ancestor = nodeById.get(ancestorId)
-    if (!ancestor) continue
-    if (
-      ancestor.mode === LGraphEventMode.NEVER ||
-      ancestor.mode === LGraphEventMode.BYPASS
-    )
-      return false
-  }
-  return true
-}
-
-function collectEmbeddedModelsWithSource(
+function collectEmbeddedModels(
   allNodes: ReturnType<typeof flattenWorkflowNodes>,
   graphData: MissingModelWorkflowData
-): EmbeddedModelWithSource[] {
-  const result: EmbeddedModelWithSource[] = []
+): ModelFile[] {
+  const result: ModelFile[] = []
+  const nodesById = new Map(allNodes.map((node) => [String(node.id), node]))
 
   for (const node of allNodes) {
-    if (
-      node.mode === LGraphEventMode.NEVER ||
-      node.mode === LGraphEventMode.BYPASS
-    )
-      continue
+    if (!isNodeAndAncestorsActive(node, nodesById)) continue
 
     const selected = getSelectedModelsMetadata(node)
     if (!selected?.length) continue
 
-    for (const model of selected) {
-      result.push({
-        ...model,
-        sourceNodeId: node.id,
-        sourceNodeType: node.type,
-        sourceWidgetName: findWidgetNameForModel(node, model.name)
-      })
-    }
+    result.push(...selected)
   }
 
-  // Workflow-level model entries have no originating node; sourceNodeId
-  // remains undefined and empty-string node type/widget are handled by
-  // groupCandidatesByName (no nodeId → no referencing node entry).
-  if (graphData.models?.length) {
-    for (const model of graphData.models) {
-      result.push({
-        ...model,
-        sourceNodeType: '',
-        sourceWidgetName: ''
-      })
-    }
-  }
+  if (graphData.models?.length) result.push(...graphData.models)
 
   return result
 }
 
-function findWidgetNameForModel(
+function isNodeAndAncestorsActive(
   node: ReturnType<typeof flattenWorkflowNodes>[number],
-  modelName: string
-): string {
-  if (Array.isArray(node.widgets_values) || !node.widgets_values) return ''
-  for (const [key, val] of Object.entries(node.widgets_values)) {
-    if (val === modelName) return key
+  nodesById: ReadonlyMap<
+    string,
+    ReturnType<typeof flattenWorkflowNodes>[number]
+  >
+): boolean {
+  if (isInactiveMode(node.mode)) return false
+
+  for (const ancestorId of getParentExecutionIds(String(node.id))) {
+    const ancestor = nodesById.get(ancestorId)
+    if (isInactiveMode(ancestor?.mode)) return false
   }
-  return ''
+
+  return true
 }
 
 interface AssetVerifier {
diff --git a/src/platform/missingModel/missingModelStore.test.ts b/src/platform/missingModel/missingModelStore.test.ts
index 8811b5d839..92bcc63238 100644
--- a/src/platform/missingModel/missingModelStore.test.ts
+++ b/src/platform/missingModel/missingModelStore.test.ts
@@ -1,8 +1,14 @@
 import { createPinia, setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
+import { createNodeLocatorId } from '@/types/nodeIdentification'
+
 import type { MissingModelCandidate } from '@/platform/missingModel/types'
 
+const mockNodeLocatorIdToNodeExecutionId = vi.hoisted(() =>
+  vi.fn((nodeLocatorId: string) => nodeLocatorId)
+)
+
 vi.mock('@/i18n', () => ({
   t: vi.fn((key: string) => `translated:${key}`),
   st: vi.fn((_key: string, fallback: string) => fallback)
@@ -12,6 +18,12 @@ vi.mock('@/platform/distribution/types', () => ({
   isCloud: false
 }))
 
+vi.mock('@/platform/workflow/management/stores/workflowStore', () => ({
+  useWorkflowStore: () => ({
+    nodeLocatorIdToNodeExecutionId: mockNodeLocatorIdToNodeExecutionId
+  })
+}))
+
 import { useMissingModelStore } from './missingModelStore'
 import { useToastStore } from '@/platform/updates/common/toastStore'
 import { app } from '@/scripts/app'
@@ -39,6 +51,9 @@ describe('missingModelStore', () => {
   beforeEach(() => {
     setActivePinia(createPinia())
     vi.restoreAllMocks()
+    mockNodeLocatorIdToNodeExecutionId.mockImplementation(
+      (nodeLocatorId: string) => nodeLocatorId
+    )
   })
 
   describe('setMissingModels', () => {
@@ -146,7 +161,9 @@ describe('missingModelStore', () => {
         makeModelCandidate('model_a.safetensors', { nodeId: '5' })
       ])
 
-      expect(store.hasMissingModelOnNode('5')).toBe(true)
+      expect(store.hasMissingModelOnNode(createNodeLocatorId(null, 5))).toBe(
+        true
+      )
     })
 
     it('returns false when node has no missing model', () => {
@@ -155,12 +172,30 @@ describe('missingModelStore', () => {
         makeModelCandidate('model_a.safetensors', { nodeId: '5' })
       ])
 
-      expect(store.hasMissingModelOnNode('99')).toBe(false)
+      expect(store.hasMissingModelOnNode(createNodeLocatorId(null, 99))).toBe(
+        false
+      )
     })
 
     it('returns false when no models are missing', () => {
       const store = useMissingModelStore()
-      expect(store.hasMissingModelOnNode('1')).toBe(false)
+      expect(store.hasMissingModelOnNode(createNodeLocatorId(null, 1))).toBe(
+        false
+      )
+    })
+
+    it('compares subgraph locators against missing model execution IDs', () => {
+      const store = useMissingModelStore()
+      const locatorId = createNodeLocatorId(
+        '11111111-1111-1111-1111-111111111111',
+        63
+      )
+      mockNodeLocatorIdToNodeExecutionId.mockReturnValueOnce('65:70:63')
+      store.setMissingModels([
+        makeModelCandidate('model_a.safetensors', { nodeId: '65:70:63' })
+      ])
+
+      expect(store.hasMissingModelOnNode(locatorId)).toBe(true)
     })
   })
 
diff --git a/src/platform/missingModel/missingModelStore.ts b/src/platform/missingModel/missingModelStore.ts
index aa1d0c14c7..1b12d77114 100644
--- a/src/platform/missingModel/missingModelStore.ts
+++ b/src/platform/missingModel/missingModelStore.ts
@@ -6,10 +6,11 @@ import { t } from '@/i18n'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { app } from '@/scripts/app'
 import { useToastStore } from '@/platform/updates/common/toastStore'
+import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
 import type { MissingModelCandidate } from '@/platform/missingModel/types'
 import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { getAncestorExecutionIds } from '@/types/nodeIdentification'
-import type { NodeExecutionId } from '@/types/nodeIdentification'
+import type { NodeExecutionId, NodeLocatorId } from '@/types/nodeIdentification'
 import { getActiveGraphNodeIds } from '@/utils/graphTraversalUtil'
 
 /**
@@ -19,6 +20,7 @@ import { getActiveGraphNodeIds } from '@/utils/graphTraversalUtil'
  */
 export const useMissingModelStore = defineStore('missingModel', () => {
   const canvasStore = useCanvasStore()
+  const workflowStore = useWorkflowStore()
 
   const missingModelCandidates = ref<MissingModelCandidate[] | null>(null)
   const isRefreshingMissingModels = ref(false)
@@ -193,8 +195,10 @@ export const useMissingModelStore = defineStore('missingModel', () => {
     missingModelCandidates.value = [...existing, ...newModels]
   }
 
-  function hasMissingModelOnNode(nodeLocatorId: string): boolean {
-    return missingModelNodeIds.value.has(nodeLocatorId)
+  function hasMissingModelOnNode(nodeLocatorId: NodeLocatorId): boolean {
+    const executionId =
+      workflowStore.nodeLocatorIdToNodeExecutionId(nodeLocatorId)
+    return executionId ? missingModelNodeIds.value.has(executionId) : false
   }
 
   function isWidgetMissingModel(nodeId: string, widgetName: string): boolean {
diff --git a/src/platform/missingModel/types.ts b/src/platform/missingModel/types.ts
index dd0b863127..96478d69b0 100644
--- a/src/platform/missingModel/types.ts
+++ b/src/platform/missingModel/types.ts
@@ -1,7 +1,4 @@
-import type {
-  ModelFile,
-  NodeId
-} from '@/platform/workflow/validation/schemas/workflowSchema'
+import type { NodeId } from '@/platform/workflow/validation/schemas/workflowSchema'
 
 /**
  * A single (node, widget, model) binding detected by the missing model pipeline.
@@ -28,13 +25,6 @@ export interface MissingModelCandidate {
   isMissing: boolean | undefined
 }
 
-export interface EmbeddedModelWithSource extends ModelFile {
-  /** Undefined for workflow-level models not tied to a specific node. */
-  sourceNodeId?: NodeId
-  sourceNodeType: string
-  sourceWidgetName: string
-}
-
 /** View model grouping multiple candidate references under a single model name. */
 export interface MissingModelViewModel {
   name: string
diff --git a/src/platform/nodeReplacement/missingNodeScan.test.ts b/src/platform/nodeReplacement/missingNodeScan.test.ts
index 5ba66059e7..15337dc8f6 100644
--- a/src/platform/nodeReplacement/missingNodeScan.test.ts
+++ b/src/platform/nodeReplacement/missingNodeScan.test.ts
@@ -53,6 +53,7 @@ import { getCnrIdFromNode } from '@/platform/nodeReplacement/cnrIdUtil'
 import { useNodeReplacementStore } from '@/platform/nodeReplacement/nodeReplacementStore'
 import { rescanAndSurfaceMissingNodes } from './missingNodeScan'
 import { useMissingNodesErrorStore } from '@/platform/nodeReplacement/missingNodesErrorStore'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
 
 function mockNode(
   id: number,
@@ -138,7 +139,9 @@ describe('scanMissingNodes (via rescanAndSurfaceMissingNodes)', () => {
 
   it('uses executionId when available for nodeId', () => {
     vi.mocked(collectAllNodes).mockReturnValue([mockNode(1, 'Missing')])
-    vi.mocked(getExecutionIdByNode).mockReturnValue('exec-42')
+    vi.mocked(getExecutionIdByNode).mockReturnValue(
+      createNodeExecutionId(['exec-42'])
+    )
 
     rescanAndSurfaceMissingNodes(mockGraph())
 
diff --git a/src/platform/settings/components/SettingDialog.vue b/src/platform/settings/components/SettingDialog.vue
index d4ac7051c7..679b67e168 100644
--- a/src/platform/settings/components/SettingDialog.vue
+++ b/src/platform/settings/components/SettingDialog.vue
@@ -12,7 +12,7 @@
           size="md"
           :placeholder="$t('g.searchSettings') + '...'"
           :debounce-time="128"
-          autofocus
+          :autofocus="activeCategoryKey !== 'keybinding'"
           @search="handleSearch"
         />
       </div>
diff --git a/src/platform/telemetry/providers/cloud/PostHogTelemetryProvider.test.ts b/src/platform/telemetry/providers/cloud/PostHogTelemetryProvider.test.ts
index f0d822a1ba..bde41cce4c 100644
--- a/src/platform/telemetry/providers/cloud/PostHogTelemetryProvider.test.ts
+++ b/src/platform/telemetry/providers/cloud/PostHogTelemetryProvider.test.ts
@@ -258,15 +258,15 @@ describe('PostHogTelemetryProvider', () => {
       )
     })
 
-    it('captures events with metadata', async () => {
+    it('captures auth events with metadata', async () => {
       const provider = createProvider()
       await vi.dynamicImportSettled()
 
-      provider.trackAuth({ method: 'google' })
+      provider.trackAuth({ method: 'google', share_id: 'share-1' })
 
       expect(hoisted.mockCapture).toHaveBeenCalledWith(
         TelemetryEvents.USER_AUTH_COMPLETED,
-        { method: 'google' }
+        { method: 'google', share_id: 'share-1' }
       )
     })
 
diff --git a/src/platform/telemetry/topupTracker.test.ts b/src/platform/telemetry/topupTracker.test.ts
index 9f8e38ccf0..3c223cde20 100644
--- a/src/platform/telemetry/topupTracker.test.ts
+++ b/src/platform/telemetry/topupTracker.test.ts
@@ -131,6 +131,28 @@ describe('topupTracker', () => {
       )
     })
 
+    it('should detect completed topup for topup_completed (unified billing feed)', () => {
+      const startTimestamp = Date.now() - 5 * 60 * 1000 // 5 minutes ago
+      mockLocalStorage.getItem.mockReturnValue(startTimestamp.toString())
+
+      const events: AuditLog[] = [
+        {
+          event_id: 'evt-topup',
+          event_type: 'topup_completed',
+          createdAt: new Date(startTimestamp + 1000).toISOString(),
+          params: {}
+        }
+      ]
+
+      const result = checkForCompletedTopup(events)
+
+      expect(result).toBe(true)
+      expect(mockTelemetry.trackApiCreditTopupSucceeded).toHaveBeenCalledOnce()
+      expect(mockLocalStorage.removeItem).toHaveBeenCalledWith(
+        'pending_topup_timestamp'
+      )
+    })
+
     it('should not detect topup if credit_added event is before tracking started', () => {
       const startTimestamp = Date.now()
       mockLocalStorage.getItem.mockReturnValue(startTimestamp.toString())
diff --git a/src/platform/telemetry/topupTracker.ts b/src/platform/telemetry/topupTracker.ts
index ab8d40be84..89e18f6126 100644
--- a/src/platform/telemetry/topupTracker.ts
+++ b/src/platform/telemetry/topupTracker.ts
@@ -35,10 +35,12 @@ export function checkForCompletedTopup(
 
   if (!events || events.length === 0) return false
 
-  // Find credit_added event that occurred after our timestamp
+  // Find a credit top-up event that occurred after our timestamp.
+  // Legacy /customers/events emits `credit_added`; the unified
+  // /api/billing/events feed emits `topup_completed`.
   const completedTopup = events.find(
     (e) =>
-      e.event_type === 'credit_added' &&
+      (e.event_type === 'credit_added' || e.event_type === 'topup_completed') &&
       e.createdAt &&
       new Date(e.createdAt).getTime() > timestamp
   )
diff --git a/src/platform/telemetry/types.ts b/src/platform/telemetry/types.ts
index f759a488a1..e77a9b0235 100644
--- a/src/platform/telemetry/types.ts
+++ b/src/platform/telemetry/types.ts
@@ -309,6 +309,7 @@ export interface SearchQueryMetadata {
  */
 export type NodeAddSource =
   | 'sidebar_drag'
+  | 'asset_browser'
   | 'search_modal'
   | 'paste'
   | 'programmatic'
diff --git a/src/platform/workflow/management/stores/workflowStore.test.ts b/src/platform/workflow/management/stores/workflowStore.test.ts
index 516a802082..8cd13c8e79 100644
--- a/src/platform/workflow/management/stores/workflowStore.test.ts
+++ b/src/platform/workflow/management/stores/workflowStore.test.ts
@@ -17,6 +17,7 @@ import { useWorkflowDraftStoreV2 } from '@/platform/workflow/persistence/stores/
 import { api } from '@/scripts/api'
 import { app as comfyApp } from '@/scripts/app'
 import { defaultGraph, defaultGraphJSON } from '@/scripts/defaultGraph'
+import { createNodeLocatorId } from '@/types/nodeIdentification'
 import { isSubgraph } from '@/utils/typeGuardUtil'
 import {
   createMockCanvas,
@@ -887,81 +888,75 @@ describe('useWorkflowStore', () => {
       })
     })
 
-    describe('nodeExecutionIdToNodeLocatorId', () => {
-      it('should convert execution ID to NodeLocatorId', () => {
-        const result = store.nodeExecutionIdToNodeLocatorId('123:456')
-        expect(result).toBe('a1b2c3d4-e5f6-7890-abcd-ef1234567890:456')
+    describe('executionIdToCurrentId', () => {
+      it('should convert an execution ID to the active subgraph node ID', () => {
+        const result = store.executionIdToCurrentId('123:456')
+        expect(result).toBe('456')
       })
 
-      it('should return simple node ID for root level nodes', () => {
-        const result = store.nodeExecutionIdToNodeLocatorId('123')
-        expect(result).toBe('123')
+      it('should return undefined for execution IDs outside the active subgraph', () => {
+        expect(() => store.executionIdToCurrentId('999:456')).not.toThrow()
+        expect(store.executionIdToCurrentId('999:456')).toBeUndefined()
       })
 
-      it('should return null for invalid execution IDs', () => {
-        const result = store.nodeExecutionIdToNodeLocatorId('999:456')
-        expect(result).toBeNull()
+      it('should return undefined for malformed execution IDs', () => {
+        expect(() => store.executionIdToCurrentId('123::456')).not.toThrow()
+        expect(store.executionIdToCurrentId('123::456')).toBeUndefined()
       })
     })
-
     describe('nodeLocatorIdToNodeId', () => {
       it('should extract node ID from NodeLocatorId', () => {
         const result = store.nodeLocatorIdToNodeId(
-          'a1b2c3d4-e5f6-7890-abcd-ef1234567890:456'
+          createNodeLocatorId('a1b2c3d4-e5f6-7890-abcd-ef1234567890', 456)
         )
         expect(result).toBe(456)
       })
 
       it('should handle string node IDs', () => {
         const result = store.nodeLocatorIdToNodeId(
-          'a1b2c3d4-e5f6-7890-abcd-ef1234567890:node_1'
+          createNodeLocatorId('a1b2c3d4-e5f6-7890-abcd-ef1234567890', 'node_1')
         )
         expect(result).toBe('node_1')
       })
 
       it('should handle simple node IDs (root graph)', () => {
-        const result = store.nodeLocatorIdToNodeId('123')
+        const result = store.nodeLocatorIdToNodeId(
+          createNodeLocatorId(null, 123)
+        )
         expect(result).toBe(123)
 
-        const stringResult = store.nodeLocatorIdToNodeId('node_1')
+        const stringResult = store.nodeLocatorIdToNodeId(
+          createNodeLocatorId(null, 'node_1')
+        )
         expect(stringResult).toBe('node_1')
       })
-
-      it('should return null for invalid NodeLocatorId', () => {
-        const result = store.nodeLocatorIdToNodeId('invalid:format')
-        expect(result).toBeNull()
-      })
     })
 
     describe('nodeLocatorIdToNodeExecutionId', () => {
       it('should convert NodeLocatorId to execution ID', () => {
-        // Need to mock isSubgraph to identify our mockSubgraph
         vi.mocked(isSubgraph).mockImplementation((obj): obj is Subgraph => {
           return obj === store.activeSubgraph
         })
 
         const result = store.nodeLocatorIdToNodeExecutionId(
-          'a1b2c3d4-e5f6-7890-abcd-ef1234567890:456'
+          createNodeLocatorId('a1b2c3d4-e5f6-7890-abcd-ef1234567890', 456)
         )
         expect(result).toBe('123:456')
       })
 
       it('should handle simple node IDs (root graph)', () => {
-        const result = store.nodeLocatorIdToNodeExecutionId('123')
+        const result = store.nodeLocatorIdToNodeExecutionId(
+          createNodeLocatorId(null, 123)
+        )
         expect(result).toBe('123')
       })
 
       it('should return null for unknown subgraph UUID', () => {
         const result = store.nodeLocatorIdToNodeExecutionId(
-          'unknown-uuid-1234-5678-90ab-cdef12345678:456'
+          createNodeLocatorId('unknown-uuid-1234-5678-90ab-cdef12345678', 456)
         )
         expect(result).toBeNull()
       })
-
-      it('should return null for invalid NodeLocatorId', () => {
-        const result = store.nodeLocatorIdToNodeExecutionId('invalid:format')
-        expect(result).toBeNull()
-      })
     })
   })
 
diff --git a/src/platform/workflow/management/stores/workflowStore.ts b/src/platform/workflow/management/stores/workflowStore.ts
index 55a0f6c511..1c684d7c6c 100644
--- a/src/platform/workflow/management/stores/workflowStore.ts
+++ b/src/platform/workflow/management/stores/workflowStore.ts
@@ -83,12 +83,9 @@ interface WorkflowStore {
   executionIdToCurrentId: (id: string) => string | undefined
   nodeIdToNodeLocatorId: (nodeId: NodeId, subgraph?: Subgraph) => NodeLocatorId
   nodeToNodeLocatorId: (node: LGraphNode) => NodeLocatorId
-  nodeExecutionIdToNodeLocatorId: (
-    nodeExecutionId: NodeExecutionId | string
-  ) => NodeLocatorId | null
-  nodeLocatorIdToNodeId: (locatorId: NodeLocatorId | string) => NodeId | null
+  nodeLocatorIdToNodeId: (locatorId: NodeLocatorId) => NodeId
   nodeLocatorIdToNodeExecutionId: (
-    locatorId: NodeLocatorId | string,
+    locatorId: NodeLocatorId,
     targetSubgraph?: Subgraph
   ) => NodeExecutionId | null
 }
@@ -580,17 +577,16 @@ export const useWorkflowStore = defineStore('workflow', () => {
 
   const getSubgraphsFromInstanceIds = (
     currentGraph: LGraph | Subgraph,
-    subgraphNodeIds: string[],
-    subgraphs: Subgraph[] = []
-  ): Subgraph[] => {
-    const currentPart = subgraphNodeIds.shift()
-    if (currentPart === undefined) return subgraphs
+    subgraphNodeIds: string[]
+  ): Subgraph[] | undefined => {
+    const [currentPart, ...remainingParts] = subgraphNodeIds
+    if (currentPart === undefined) return []
 
     const subgraph = subgraphNodeIdToSubgraph(currentPart, currentGraph)
-    if (subgraph === undefined) throw new Error('Subgraph not found')
+    if (subgraph === undefined) return
 
-    subgraphs.push(subgraph)
-    return getSubgraphsFromInstanceIds(subgraph, subgraphNodeIds, subgraphs)
+    const childSubgraphs = getSubgraphsFromInstanceIds(subgraph, remainingParts)
+    return childSubgraphs ? [subgraph, ...childSubgraphs] : undefined
   }
 
   //FIXME: use existing util function
@@ -604,17 +600,17 @@ export const useWorkflowStore = defineStore('workflow', () => {
       return
     }
 
-    // Parse the execution ID (e.g., "123:456:789")
-    const subgraphNodeIds = id.split(':')
+    const executionPath = parseNodeExecutionId(id)?.map(String)
+    if (!executionPath) return
 
-    // Start from the root graph
-    const graph = comfyApp.rootGraph
+    const nodeId = executionPath.at(-1)
+    if (nodeId === undefined) return
 
-    // If the last subgraph is the active subgraph, return the node ID
-    const subgraphs = getSubgraphsFromInstanceIds(graph, subgraphNodeIds)
-    if (subgraphs.at(-1) === subgraph) {
-      return subgraphNodeIds.at(-1)
-    }
+    const subgraphs = getSubgraphsFromInstanceIds(
+      comfyApp.rootGraph,
+      executionPath.slice(0, -1)
+    )
+    if (subgraphs?.at(-1) === subgraph) return nodeId
   }
 
   watch(activeWorkflow, updateActiveGraph)
@@ -632,7 +628,7 @@ export const useWorkflowStore = defineStore('workflow', () => {
     const targetSubgraph = subgraph ?? activeSubgraph.value
     if (!targetSubgraph) {
       // Node is in the root graph, return the node ID as-is
-      return String(nodeId)
+      return createNodeLocatorId(null, nodeId)
     }
 
     return createNodeLocatorId(targetSubgraph.id, nodeId)
@@ -646,55 +642,16 @@ export const useWorkflowStore = defineStore('workflow', () => {
   const nodeToNodeLocatorId = (node: LGraphNode): NodeLocatorId => {
     if (isSubgraph(node.graph))
       return createNodeLocatorId(node.graph.id, node.id)
-    return String(node.id)
-  }
-
-  /**
-   * Convert an execution ID to a NodeLocatorId
-   * @param nodeExecutionId The execution node ID (e.g., "123:456:789")
-   * @returns The NodeLocatorId or null if conversion fails
-   */
-  const nodeExecutionIdToNodeLocatorId = (
-    nodeExecutionId: NodeExecutionId | string
-  ): NodeLocatorId | null => {
-    // Handle simple node IDs (root graph - no colons)
-    if (!nodeExecutionId.includes(':')) {
-      return nodeExecutionId
-    }
-
-    const parts = parseNodeExecutionId(nodeExecutionId)
-    if (!parts || parts.length === 0) return null
-
-    const nodeId = parts[parts.length - 1]
-    const subgraphNodeIds = parts.slice(0, -1)
-
-    if (subgraphNodeIds.length === 0) {
-      // Node is in root graph, return the node ID as-is
-      return String(nodeId)
-    }
-
-    try {
-      const subgraphs = getSubgraphsFromInstanceIds(
-        comfyApp.rootGraph,
-        subgraphNodeIds.map((id) => String(id))
-      )
-      const immediateSubgraph = subgraphs[subgraphs.length - 1]
-      return createNodeLocatorId(immediateSubgraph.id, nodeId)
-    } catch {
-      return null
-    }
+    return createNodeLocatorId(null, node.id)
   }
 
   /**
    * Extract the node ID from a NodeLocatorId
    * @param locatorId The NodeLocatorId
-   * @returns The local node ID or null if invalid
+   * @returns The local node ID
    */
-  const nodeLocatorIdToNodeId = (
-    locatorId: NodeLocatorId | string
-  ): NodeId | null => {
-    const parsed = parseNodeLocatorId(locatorId)
-    return parsed?.localNodeId ?? null
+  const nodeLocatorIdToNodeId = (locatorId: NodeLocatorId): NodeId => {
+    return parseNodeLocatorId(locatorId)!.localNodeId
   }
 
   /**
@@ -704,7 +661,7 @@ export const useWorkflowStore = defineStore('workflow', () => {
    * @returns The execution ID or null if the node is not accessible from the target context
    */
   const nodeLocatorIdToNodeExecutionId = (
-    locatorId: NodeLocatorId | string,
+    locatorId: NodeLocatorId,
     targetSubgraph?: Subgraph
   ): NodeExecutionId | null => {
     const parsed = parseNodeLocatorId(locatorId)
@@ -714,7 +671,7 @@ export const useWorkflowStore = defineStore('workflow', () => {
 
     // If no subgraph UUID, this is a root graph node
     if (!subgraphUuid) {
-      return String(localNodeId)
+      return createNodeExecutionId([localNodeId])
     }
 
     // Find the path from root to the subgraph with this UUID
@@ -751,7 +708,7 @@ export const useWorkflowStore = defineStore('workflow', () => {
           comfyApp.rootGraph,
           path.slice(0, idx + 1).map((id) => String(id))
         )
-        return subgraphs[subgraphs.length - 1] === targetSubgraph
+        return subgraphs?.at(-1) === targetSubgraph
       })
     ) {
       return null
@@ -795,7 +752,6 @@ export const useWorkflowStore = defineStore('workflow', () => {
     executionIdToCurrentId,
     nodeIdToNodeLocatorId,
     nodeToNodeLocatorId,
-    nodeExecutionIdToNodeLocatorId,
     nodeLocatorIdToNodeId,
     nodeLocatorIdToNodeExecutionId
   }
diff --git a/src/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader.test.ts b/src/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader.test.ts
index 4cfee6d1c7..9bf41b03f8 100644
--- a/src/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader.test.ts
+++ b/src/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader.test.ts
@@ -266,11 +266,7 @@ describe('useSharedWorkflowUrlLoader', () => {
       view_mode: 'graph',
       is_app_mode: false
     })
-    expect(preservedQueryMocks.capturePreservedQuery).toHaveBeenCalledWith(
-      'share_auth',
-      { share: 'share-id-1' },
-      ['share']
-    )
+    expect(preservedQueryMocks.capturePreservedQuery).not.toHaveBeenCalled()
     expect(mockRouterReplace).toHaveBeenCalledWith({ query: {} })
     expect(preservedQueryMocks.clearPreservedQuery).toHaveBeenCalledWith(
       'share'
diff --git a/src/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader.ts b/src/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader.ts
index fe4bd9e9af..05ee751bc9 100644
--- a/src/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader.ts
+++ b/src/platform/workflow/sharing/composables/useSharedWorkflowUrlLoader.ts
@@ -9,13 +9,13 @@ import { useTelemetry } from '@/platform/telemetry'
 import OpenSharedWorkflowDialogContent from '@/platform/workflow/sharing/components/OpenSharedWorkflowDialogContent.vue'
 import type { SharedWorkflowPayload } from '@/platform/workflow/sharing/types/shareTypes'
 import {
-  capturePreservedQuery,
   clearPreservedQuery,
   hydratePreservedQuery,
   mergePreservedQueryIntoQuery
 } from '@/platform/navigation/preservedQueryManager'
 import { PRESERVED_QUERY_NAMESPACES } from '@/platform/navigation/preservedQueryNamespaces'
 import { useWorkflowShareService } from '@/platform/workflow/sharing/services/workflowShareService'
+import { isValidShareId } from '@/platform/workflow/sharing/utils/shareAuthAttribution'
 import { app } from '@/scripts/app'
 import { useDialogService } from '@/services/dialogService'
 import { useDialogStore } from '@/stores/dialogStore'
@@ -49,10 +49,6 @@ export function useSharedWorkflowUrlLoader() {
   const { mode, isAppMode } = useAppMode()
   const SHARE_NAMESPACE = PRESERVED_QUERY_NAMESPACES.SHARE
 
-  function isValidParameter(param: string): boolean {
-    return /^[a-zA-Z0-9_.-]+$/.test(param)
-  }
-
   async function ensureShareQueryFromIntent() {
     hydratePreservedQuery(SHARE_NAMESPACE)
     const mergedQuery = mergePreservedQueryIntoQuery(
@@ -129,7 +125,7 @@ export function useSharedWorkflowUrlLoader() {
       return 'not-present'
     }
 
-    if (!isValidParameter(shareParam)) {
+    if (!isValidShareId(shareParam)) {
       console.warn(
         `[useSharedWorkflowUrlLoader] Invalid share parameter format: ${shareParam}`
       )
@@ -148,13 +144,6 @@ export function useSharedWorkflowUrlLoader() {
       view_mode: mode.value,
       is_app_mode: isAppMode.value
     })
-    if (!isLoggedIn.value) {
-      capturePreservedQuery(
-        PRESERVED_QUERY_NAMESPACES.SHARE_AUTH,
-        { share: shareParam },
-        ['share']
-      )
-    }
 
     const result = await showOpenSharedWorkflowDialog(shareParam)
 
diff --git a/src/platform/workflow/sharing/utils/shareAuthAttribution.test.ts b/src/platform/workflow/sharing/utils/shareAuthAttribution.test.ts
new file mode 100644
index 0000000000..784693af55
--- /dev/null
+++ b/src/platform/workflow/sharing/utils/shareAuthAttribution.test.ts
@@ -0,0 +1,78 @@
+import { beforeEach, describe, expect, it } from 'vitest'
+import type { LocationQuery } from 'vue-router'
+
+import {
+  clearPreservedQuery,
+  getPreservedQueryParam
+} from '@/platform/navigation/preservedQueryManager'
+import { PRESERVED_QUERY_NAMESPACES } from '@/platform/navigation/preservedQueryNamespaces'
+
+import {
+  isValidShareId,
+  preserveLoggedOutShareAuthAttribution
+} from './shareAuthAttribution'
+
+const SHARE_AUTH_NAMESPACE = PRESERVED_QUERY_NAMESPACES.SHARE_AUTH
+const invalidShareQueries: Array<{ name: string; query: LocationQuery }> = [
+  { name: 'missing', query: {} },
+  { name: 'array value', query: { share: ['share-id-1'] } },
+  { name: 'invalid characters', query: { share: '../share-id-1' } },
+  { name: 'too long', query: { share: 'a'.repeat(129) } }
+]
+
+describe('shareAuthAttribution', () => {
+  beforeEach(() => {
+    clearPreservedQuery(SHARE_AUTH_NAMESPACE)
+    sessionStorage.clear()
+  })
+
+  it('preserves a valid share id for logged-out users', () => {
+    preserveLoggedOutShareAuthAttribution({ share: 'share-id_1.2' }, false)
+
+    expect(getPreservedQueryParam(SHARE_AUTH_NAMESPACE, 'share')).toBe(
+      'share-id_1.2'
+    )
+    expect(sessionStorage.getItem('Comfy.PreservedQuery.share_auth')).toContain(
+      'share-id_1.2'
+    )
+  })
+
+  it('does not preserve share attribution for logged-in users', () => {
+    preserveLoggedOutShareAuthAttribution({ share: 'share-id-1' }, true)
+
+    expect(
+      getPreservedQueryParam(SHARE_AUTH_NAMESPACE, 'share')
+    ).toBeUndefined()
+    expect(sessionStorage.getItem('Comfy.PreservedQuery.share_auth')).toBeNull()
+  })
+
+  it.for(invalidShareQueries)(
+    'does not preserve $name share params',
+    ({ query }) => {
+      preserveLoggedOutShareAuthAttribution(query, false)
+
+      expect(
+        getPreservedQueryParam(SHARE_AUTH_NAMESPACE, 'share')
+      ).toBeUndefined()
+      expect(
+        sessionStorage.getItem('Comfy.PreservedQuery.share_auth')
+      ).toBeNull()
+    }
+  )
+
+  it.for([
+    { shareId: 'abc123', expected: true },
+    { shareId: 'share-id_1.2', expected: true },
+    { shareId: 'a'.repeat(128), expected: true },
+    { shareId: '../share-id-1', expected: false },
+    { shareId: '.', expected: false },
+    { shareId: '..', expected: false },
+    { shareId: '-share-id', expected: false },
+    { shareId: 'share id', expected: false },
+    { shareId: '\u5171\u4eab', expected: false },
+    { shareId: 'a'.repeat(129), expected: false },
+    { shareId: '', expected: false }
+  ])('validates "$shareId" as $expected', ({ shareId, expected }) => {
+    expect(isValidShareId(shareId)).toBe(expected)
+  })
+})
diff --git a/src/platform/workflow/sharing/utils/shareAuthAttribution.ts b/src/platform/workflow/sharing/utils/shareAuthAttribution.ts
new file mode 100644
index 0000000000..593bba74ae
--- /dev/null
+++ b/src/platform/workflow/sharing/utils/shareAuthAttribution.ts
@@ -0,0 +1,28 @@
+import type { LocationQuery } from 'vue-router'
+
+import { capturePreservedQuery } from '@/platform/navigation/preservedQueryManager'
+import { PRESERVED_QUERY_NAMESPACES } from '@/platform/navigation/preservedQueryNamespaces'
+
+const SHARE_QUERY_KEY = 'share'
+const MAX_SHARE_ID_LENGTH = 128
+const SHARE_ID_PATTERN = /^[a-zA-Z0-9][a-zA-Z0-9_.-]*$/
+
+export function isValidShareId(shareId: string): boolean {
+  return shareId.length <= MAX_SHARE_ID_LENGTH && SHARE_ID_PATTERN.test(shareId)
+}
+
+export function preserveLoggedOutShareAuthAttribution(
+  query: LocationQuery,
+  isLoggedIn: boolean
+): void {
+  if (isLoggedIn) return
+
+  const shareId = query[SHARE_QUERY_KEY]
+  if (typeof shareId !== 'string' || !isValidShareId(shareId)) return
+
+  capturePreservedQuery(
+    PRESERVED_QUERY_NAMESPACES.SHARE_AUTH,
+    { [SHARE_QUERY_KEY]: shareId },
+    [SHARE_QUERY_KEY]
+  )
+}
diff --git a/src/platform/workflow/templates/composables/useTemplateWorkflows.test.ts b/src/platform/workflow/templates/composables/useTemplateWorkflows.test.ts
index 4a9c210fd9..ffc1439c60 100644
--- a/src/platform/workflow/templates/composables/useTemplateWorkflows.test.ts
+++ b/src/platform/workflow/templates/composables/useTemplateWorkflows.test.ts
@@ -49,6 +49,17 @@ vi.mock('@/stores/dialogStore', () => ({
   }))
 }))
 
+// useTelemetry() returns null in OSS, a dispatcher in cloud — toggle via mockIsCloud.
+const { mockIsCloud, mockTrackTemplate } = vi.hoisted(() => ({
+  mockIsCloud: { value: true },
+  mockTrackTemplate: vi.fn()
+}))
+
+vi.mock('@/platform/telemetry', () => ({
+  useTelemetry: () =>
+    mockIsCloud.value ? { trackTemplate: mockTrackTemplate } : null
+}))
+
 // Mock fetch
 global.fetch = vi.fn()
 
@@ -58,6 +69,9 @@ describe('useTemplateWorkflows', () => {
   let mockWorkflowTemplatesStore: MockWorkflowTemplatesStore
 
   beforeEach(() => {
+    mockIsCloud.value = true
+    mockTrackTemplate.mockClear()
+
     mockWorkflowTemplatesStore = {
       isLoaded: false,
       loadWorkflowTemplates: vi.fn().mockResolvedValue(true),
@@ -285,6 +299,30 @@ describe('useTemplateWorkflows', () => {
     expect(fetch).toHaveBeenCalledWith('mock-file-url/templates/template1.json')
   })
 
+  it('tracks template telemetry on load in cloud builds', async () => {
+    const { loadWorkflowTemplate } = useTemplateWorkflows()
+
+    mockWorkflowTemplatesStore.isLoaded = true
+    await loadWorkflowTemplate('template1', 'default')
+    await flushPromises()
+
+    expect(mockTrackTemplate).toHaveBeenCalledWith({
+      workflow_name: 'template1',
+      template_source: 'default'
+    })
+  })
+
+  it('does not fire template telemetry in OSS builds', async () => {
+    mockIsCloud.value = false
+    const { loadWorkflowTemplate } = useTemplateWorkflows()
+
+    mockWorkflowTemplatesStore.isLoaded = true
+    await loadWorkflowTemplate('template1', 'default')
+    await flushPromises()
+
+    expect(mockTrackTemplate).not.toHaveBeenCalled()
+  })
+
   it('should handle errors when loading templates', async () => {
     const { loadWorkflowTemplate, loadingTemplateId } = useTemplateWorkflows()
 
diff --git a/src/platform/workflow/templates/composables/useTemplateWorkflows.ts b/src/platform/workflow/templates/composables/useTemplateWorkflows.ts
index a5ee9c3b9b..21df601ec1 100644
--- a/src/platform/workflow/templates/composables/useTemplateWorkflows.ts
+++ b/src/platform/workflow/templates/composables/useTemplateWorkflows.ts
@@ -1,7 +1,6 @@
 import { computed, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
-import { isCloud } from '@/platform/distribution/types'
 import { useTelemetry } from '@/platform/telemetry'
 import { useWorkflowTemplatesStore } from '@/platform/workflow/templates/repositories/workflowTemplatesStore'
 import type {
@@ -132,12 +131,10 @@ export function useTemplateWorkflows() {
           ? t(`templateWorkflows.template.${id}`, id)
           : id
 
-      if (isCloud) {
-        useTelemetry()?.trackTemplate({
-          workflow_name: id,
-          template_source: sourceModule
-        })
-      }
+      useTelemetry()?.trackTemplate({
+        workflow_name: id,
+        template_source: sourceModule
+      })
 
       dialogStore.closeDialog()
       await app.loadGraphData(json, true, true, workflowName, {
diff --git a/src/platform/workspace/api/workspaceApi.ts b/src/platform/workspace/api/workspaceApi.ts
index 3aa53aa571..f9a1451326 100644
--- a/src/platform/workspace/api/workspaceApi.ts
+++ b/src/platform/workspace/api/workspaceApi.ts
@@ -118,9 +118,27 @@ export interface Plan {
   seat_summary: PlanSeatSummary
 }
 
+interface TeamCreditStopPrice {
+  list_price_cents: number
+  price_cents: number
+}
+
+interface TeamCreditStop {
+  id: string
+  credits: number
+  monthly: TeamCreditStopPrice
+  yearly: TeamCreditStopPrice
+}
+
+export interface TeamCreditStops {
+  default_stop_index: number
+  stops: TeamCreditStop[]
+}
+
 interface BillingPlansResponse {
   current_plan_slug?: string
   plans: Plan[]
+  team_credit_stops?: TeamCreditStops
 }
 
 type SubscriptionTransitionType =
@@ -214,6 +232,12 @@ export type BillingStatus =
   | 'payment_failed'
   | 'inactive'
 
+export interface CurrentTeamCreditStop {
+  id: string
+  credits_monthly: number
+  stop_usd: number
+}
+
 export interface BillingStatusResponse {
   is_active: boolean
   subscription_status?: BillingSubscriptionStatus
@@ -224,6 +248,7 @@ export interface BillingStatusResponse {
   has_funds: boolean
   cancel_at?: string
   renewal_date?: string
+  team_credit_stop?: CurrentTeamCreditStop
 }
 
 export interface BillingBalanceResponse {
diff --git a/src/platform/workspace/components/SubscriptionAddPaymentPreviewWorkspace.test.ts b/src/platform/workspace/components/SubscriptionAddPaymentPreviewWorkspace.test.ts
new file mode 100644
index 0000000000..2511f653fa
--- /dev/null
+++ b/src/platform/workspace/components/SubscriptionAddPaymentPreviewWorkspace.test.ts
@@ -0,0 +1,55 @@
+import userEvent from '@testing-library/user-event'
+import { render, screen } from '@testing-library/vue'
+import { describe, expect, it, vi } from 'vitest'
+
+import SubscriptionAddPaymentPreviewWorkspace from './SubscriptionAddPaymentPreviewWorkspace.vue'
+
+vi.mock('vue-i18n', () => ({
+  useI18n: () => ({
+    t: (key: string) => key,
+    n: (value: number) => value.toLocaleString('en-US')
+  })
+}))
+
+const globalOptions = {
+  mocks: { $t: (key: string) => key },
+  stubs: {
+    'i18n-t': { template: '<span />' },
+    Button: {
+      template: '<button @click="$emit(\'click\')"><slot /></button>'
+    }
+  }
+}
+
+describe('SubscriptionAddPaymentPreviewWorkspace', () => {
+  it('renders personal tier price and credits from tierKey', () => {
+    render(SubscriptionAddPaymentPreviewWorkspace, {
+      props: { tierKey: 'creator' },
+      global: globalOptions
+    })
+    expect(screen.getByText('subscription.tiers.creator.name')).toBeTruthy()
+    expect(screen.getByText('$35')).toBeTruthy()
+  })
+
+  it('renders the team plan from the selected slider stop', () => {
+    render(SubscriptionAddPaymentPreviewWorkspace, {
+      props: { teamPlan: { usd: 400, credits: 84_400, discountedUsd: 380 } },
+      global: globalOptions
+    })
+    expect(screen.getByText('subscription.teamPlan.name')).toBeTruthy()
+    expect(screen.getByText('$380')).toBeTruthy()
+    expect(screen.getAllByText('84,400').length).toBeGreaterThan(0)
+    expect(screen.getByText('$380.00')).toBeTruthy()
+  })
+
+  it('emits addCreditCard from the team confirm CTA', async () => {
+    const { emitted } = render(SubscriptionAddPaymentPreviewWorkspace, {
+      props: { teamPlan: { usd: 400, credits: 84_400, discountedUsd: 380 } },
+      global: globalOptions
+    })
+    await userEvent.click(
+      screen.getByText('subscription.preview.subscribeToPlan')
+    )
+    expect(emitted().addCreditCard).toBeTruthy()
+  })
+})
diff --git a/src/platform/workspace/components/SubscriptionAddPaymentPreviewWorkspace.vue b/src/platform/workspace/components/SubscriptionAddPaymentPreviewWorkspace.vue
index 820df40a56..199c16b317 100644
--- a/src/platform/workspace/components/SubscriptionAddPaymentPreviewWorkspace.vue
+++ b/src/platform/workspace/components/SubscriptionAddPaymentPreviewWorkspace.vue
@@ -16,9 +16,16 @@
             ${{ displayPrice }}
           </span>
           <span class="text-xl text-base-foreground">
-            {{ $t('subscription.usdPerMonthPerMember') }}
+            {{ $t('subscription.usdPerMonth') }}
           </span>
         </div>
+        <div
+          v-if="teamPlan"
+          class="flex items-center gap-1 text-sm text-muted-foreground"
+        >
+          <i class="icon-[comfy--credits] size-3.5 shrink-0 bg-amber-400" />
+          <span>{{ displayCredits }} {{ $t('subscription.perMonth') }}</span>
+        </div>
         <span class="text-muted-foreground">
           {{ $t('subscription.preview.startingToday') }}
         </span>
@@ -31,13 +38,10 @@
             {{ $t('subscription.preview.eachMonthCreditsRefill') }}
           </span>
           <div class="flex items-center gap-1">
-            <i class="icon-[lucide--component] text-sm text-amber-400" />
+            <i class="icon-[comfy--credits] size-4 shrink-0 bg-amber-400" />
             <span class="font-bold text-base-foreground">
               {{ displayCredits }}
             </span>
-            <span class="text-base-foreground">
-              {{ $t('subscription.preview.perMember') }}
-            </span>
           </div>
         </div>
 
@@ -63,36 +67,48 @@
           />
         </button>
         <div v-show="!isFeaturesCollapsed" class="flex flex-col gap-2 pt-2">
-          <div class="flex items-center justify-between">
-            <span class="text-sm text-base-foreground">
-              {{ $t('subscription.maxDurationLabel') }}
-            </span>
-            <span class="text-sm font-bold text-base-foreground">
-              {{ maxDuration }}
-            </span>
-          </div>
-          <div class="flex items-center justify-between">
-            <span class="text-sm text-base-foreground">
-              {{ $t('subscription.gpuLabel') }}
-            </span>
-            <i class="pi pi-check text-success-foreground text-xs" />
-          </div>
-          <div class="flex items-center justify-between">
-            <span class="text-sm text-base-foreground">
-              {{ $t('subscription.addCreditsLabel') }}
-            </span>
-            <i class="pi pi-check text-success-foreground text-xs" />
-          </div>
-          <div class="flex items-center justify-between">
-            <span class="text-sm text-base-foreground">
-              {{ $t('subscription.customLoRAsLabel') }}
-            </span>
-            <i
-              v-if="hasCustomLoRAs"
-              class="pi pi-check text-success-foreground text-xs"
-            />
-            <i v-else class="pi pi-times text-xs text-muted-foreground" />
-          </div>
+          <template v-if="teamPlan">
+            <div
+              v-for="perk in teamPerks"
+              :key="perk"
+              class="flex items-center gap-2"
+            >
+              <i class="pi pi-check text-success-foreground text-xs" />
+              <span class="text-sm text-base-foreground">{{ perk }}</span>
+            </div>
+          </template>
+          <template v-else>
+            <div class="flex items-center justify-between">
+              <span class="text-sm text-base-foreground">
+                {{ $t('subscription.maxDurationLabel') }}
+              </span>
+              <span class="text-sm font-bold text-base-foreground">
+                {{ maxDuration }}
+              </span>
+            </div>
+            <div class="flex items-center justify-between">
+              <span class="text-sm text-base-foreground">
+                {{ $t('subscription.gpuLabel') }}
+              </span>
+              <i class="pi pi-check text-success-foreground text-xs" />
+            </div>
+            <div class="flex items-center justify-between">
+              <span class="text-sm text-base-foreground">
+                {{ $t('subscription.addCreditsLabel') }}
+              </span>
+              <i class="pi pi-check text-success-foreground text-xs" />
+            </div>
+            <div class="flex items-center justify-between">
+              <span class="text-sm text-base-foreground">
+                {{ $t('subscription.customLoRAsLabel') }}
+              </span>
+              <i
+                v-if="hasCustomLoRAs"
+                class="pi pi-check text-success-foreground text-xs"
+              />
+              <i v-else class="pi pi-times text-xs text-muted-foreground" />
+            </div>
+          </template>
         </div>
       </div>
 
@@ -118,30 +134,7 @@
     <!-- Footer -->
     <div class="flex flex-col gap-2 pt-8">
       <!-- Terms Agreement -->
-      <p class="text-center text-xs text-muted-foreground">
-        <i18n-t keypath="subscription.preview.termsAgreement" tag="span">
-          <template #terms>
-            <a
-              href="https://www.comfy.org/terms"
-              target="_blank"
-              rel="noopener noreferrer"
-              class="underline hover:text-base-foreground"
-            >
-              {{ $t('subscription.preview.terms') }}
-            </a>
-          </template>
-          <template #privacy>
-            <a
-              href="https://www.comfy.org/privacy"
-              target="_blank"
-              rel="noopener noreferrer"
-              class="underline hover:text-base-foreground"
-            >
-              {{ $t('subscription.preview.privacyPolicy') }}
-            </a>
-          </template>
-        </i18n-t>
-      </p>
+      <SubscriptionTermsNote />
 
       <!-- Add Credit Card Button -->
       <Button
@@ -151,7 +144,7 @@
         :loading="isLoading"
         @click="$emit('addCreditCard')"
       >
-        {{ $t('subscription.preview.addCreditCard') }}
+        {{ $t('subscription.preview.subscribeToPlan', { plan: tierName }) }}
       </Button>
 
       <!-- Back Link -->
@@ -171,6 +164,7 @@ import { computed, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import Button from '@/components/ui/button/Button.vue'
+import type { TeamPlanSelection } from '@/platform/cloud/subscription/constants/teamPlanCreditStops'
 import {
   getTierCredits,
   getTierFeatures,
@@ -181,18 +175,24 @@ import type { BillingCycle } from '@/platform/cloud/subscription/utils/subscript
 import type { PreviewSubscribeResponse } from '@/platform/workspace/api/workspaceApi'
 import { cn } from '@comfyorg/tailwind-utils'
 
+import SubscriptionTermsNote from './SubscriptionTermsNote.vue'
+
 interface Props {
-  tierKey: Exclude<TierKey, 'free' | 'founder'>
+  /** Personal-tier checkout. Required unless `teamPlan` is set. */
+  tierKey?: Exclude<TierKey, 'free' | 'founder'>
   billingCycle?: BillingCycle
   isLoading?: boolean
   previewData?: PreviewSubscribeResponse | null
+  /** Team-plan checkout (selected slider stop); overrides tier-derived display. */
+  teamPlan?: TeamPlanSelection | null
 }
 
 const {
   tierKey,
   billingCycle = 'monthly',
   isLoading = false,
-  previewData = null
+  previewData = null,
+  teamPlan = null
 } = defineProps<Props>()
 
 defineEmits<{
@@ -204,24 +204,42 @@ const { t, n } = useI18n()
 
 const isFeaturesCollapsed = ref(true)
 
-const tierName = computed(() => t(`subscription.tiers.${tierKey}.name`))
+const tierName = computed(() =>
+  teamPlan
+    ? t('subscription.teamPlan.name')
+    : t(`subscription.tiers.${tierKey}.name`)
+)
 
 const displayPrice = computed(() => {
+  if (teamPlan) return teamPlan.discountedUsd
   if (previewData?.new_plan) {
     return (previewData.new_plan.price_cents / 100).toFixed(0)
   }
-  return getTierPrice(tierKey, billingCycle === 'yearly')
+  return tierKey ? getTierPrice(tierKey, billingCycle === 'yearly') : 0
 })
 
-const displayCredits = computed(() => n(getTierCredits(tierKey) ?? 0))
+const displayCredits = computed(() =>
+  n(teamPlan ? teamPlan.credits : tierKey ? (getTierCredits(tierKey) ?? 0) : 0)
+)
 
-const hasCustomLoRAs = computed(() => getTierFeatures(tierKey).customLoRAs)
+const teamPerks = computed(() => [
+  t('subscription.teamPlan.perkInviteMembers'),
+  t('subscription.teamPlan.perkConcurrentRuns'),
+  t('subscription.teamPlan.perkSharedPool'),
+  t('subscription.teamPlan.perkRolePermissions')
+])
+
+const hasCustomLoRAs = computed(() =>
+  tierKey ? getTierFeatures(tierKey).customLoRAs : false
+)
 const maxDuration = computed(() => t(`subscription.maxDuration.${tierKey}`))
 
 const totalDueToday = computed(() => {
+  if (teamPlan) return teamPlan.discountedUsd.toFixed(2)
   if (previewData) {
     return (previewData.cost_today_cents / 100).toFixed(2)
   }
+  if (!tierKey) return '0.00'
   const priceValue = getTierPrice(tierKey, billingCycle === 'yearly')
   if (billingCycle === 'yearly') {
     return (priceValue * 12).toFixed(2)
diff --git a/src/platform/workspace/components/SubscriptionCheckoutSteps.stories.ts b/src/platform/workspace/components/SubscriptionCheckoutSteps.stories.ts
new file mode 100644
index 0000000000..015550301d
--- /dev/null
+++ b/src/platform/workspace/components/SubscriptionCheckoutSteps.stories.ts
@@ -0,0 +1,126 @@
+import type { Meta, StoryObj } from '@storybook/vue3-vite'
+
+import type { PreviewSubscribeResponse } from '@/platform/workspace/api/workspaceApi'
+
+import SubscriptionAddPaymentPreviewWorkspace from './SubscriptionAddPaymentPreviewWorkspace.vue'
+import SubscriptionSuccessWorkspace from './SubscriptionSuccessWorkspace.vue'
+import SubscriptionTransitionPreviewWorkspace from './SubscriptionTransitionPreviewWorkspace.vue'
+
+type PreviewPlanInfo = PreviewSubscribeResponse['new_plan']
+
+/**
+ * Checkout steps of the unified subscription dialog (FE-934): the
+ * "Confirm your payment" / "Confirm your plan change" preview screens and the
+ * "You're all set" success screen. Driven by props (no API in Storybook).
+ */
+const meta: Meta = {
+  title: 'Components/SubscriptionCheckoutSteps',
+  parameters: { layout: 'centered' }
+}
+
+export default meta
+type Story = StoryObj
+
+const creatorPlan: PreviewPlanInfo = {
+  slug: 'creator-annual',
+  tier: 'CREATOR',
+  duration: 'ANNUAL',
+  price_cents: 2800,
+  credits_cents: 740000,
+  seat_summary: {
+    seat_count: 1,
+    total_cost_cents: 2800,
+    total_credits_cents: 740000
+  },
+  period_end: '2027-07-10T00:00:00Z'
+}
+
+const proPlan: PreviewPlanInfo = {
+  slug: 'pro-annual',
+  tier: 'PRO',
+  duration: 'ANNUAL',
+  price_cents: 8000,
+  credits_cents: 2110000,
+  seat_summary: {
+    seat_count: 1,
+    total_cost_cents: 8000,
+    total_credits_cents: 2110000
+  },
+  period_end: '2026-07-10T00:00:00Z'
+}
+
+const shell =
+  '<div class="mx-auto flex h-[680px] w-[460px] flex-col rounded-2xl border border-border-default bg-secondary-background p-12">'
+
+/** New subscription — "Confirm your payment" (AddPayment preview). */
+export const ConfirmNewSubscription: Story = {
+  render: () => ({
+    components: { SubscriptionAddPaymentPreviewWorkspace },
+    data: () => ({
+      previewData: {
+        allowed: true,
+        transition_type: 'new_subscription',
+        effective_at: '2026-07-10T00:00:00Z',
+        is_immediate: true,
+        cost_today_cents: 2800,
+        cost_next_period_cents: 2800,
+        credits_today_cents: 740000,
+        credits_next_period_cents: 740000,
+        new_plan: creatorPlan
+      } satisfies PreviewSubscribeResponse
+    }),
+    template: `${shell}<SubscriptionAddPaymentPreviewWorkspace tier-key="creator" billing-cycle="yearly" :preview-data="previewData" /></div>`
+  })
+}
+
+/** Team subscription — "Confirm your payment" rendered from a slider stop. */
+export const ConfirmTeamSubscription: Story = {
+  render: () => ({
+    components: { SubscriptionAddPaymentPreviewWorkspace },
+    data: () => ({ teamPlan: { usd: 400, credits: 84_400 } }),
+    template: `${shell}<SubscriptionAddPaymentPreviewWorkspace :team-plan="teamPlan" /></div>`
+  })
+}
+
+/** Plan change — "Confirm your plan change" (Transition preview, Pro → Creator). */
+export const ConfirmPlanChange: Story = {
+  render: () => ({
+    components: { SubscriptionTransitionPreviewWorkspace },
+    data: () => ({
+      previewData: {
+        allowed: true,
+        transition_type: 'downgrade',
+        effective_at: '2026-07-10T00:00:00Z',
+        is_immediate: false,
+        cost_today_cents: 0,
+        cost_next_period_cents: 2800,
+        credits_today_cents: 0,
+        credits_next_period_cents: 740000,
+        current_plan: proPlan,
+        new_plan: creatorPlan
+      } satisfies PreviewSubscribeResponse
+    }),
+    template: `${shell}<SubscriptionTransitionPreviewWorkspace :preview-data="previewData" /></div>`
+  })
+}
+
+/** Success — "You're all set". */
+export const SuccessAllSet: Story = {
+  render: () => ({
+    components: { SubscriptionSuccessWorkspace },
+    data: () => ({
+      previewData: {
+        allowed: true,
+        transition_type: 'new_subscription',
+        effective_at: '2026-07-10T00:00:00Z',
+        is_immediate: true,
+        cost_today_cents: 2800,
+        cost_next_period_cents: 2800,
+        credits_today_cents: 740000,
+        credits_next_period_cents: 740000,
+        new_plan: creatorPlan
+      } satisfies PreviewSubscribeResponse
+    }),
+    template: `${shell}<SubscriptionSuccessWorkspace tier-key="creator" :preview-data="previewData" /></div>`
+  })
+}
diff --git a/src/platform/workspace/components/SubscriptionRequiredDialogContentUnified.vue b/src/platform/workspace/components/SubscriptionRequiredDialogContentUnified.vue
new file mode 100644
index 0000000000..b7a2be3e92
--- /dev/null
+++ b/src/platform/workspace/components/SubscriptionRequiredDialogContentUnified.vue
@@ -0,0 +1,166 @@
+<template>
+  <div
+    :class="
+      cn(
+        'relative flex h-full flex-col gap-4 overflow-y-auto p-4 pt-6',
+        checkoutStep === 'pricing' &&
+          'xl:min-h-[min(740px,90vh)] xl:w-[min(1280px,95vw)]'
+      )
+    "
+  >
+    <Button
+      v-if="checkoutStep === 'preview'"
+      size="icon"
+      variant="muted-textonly"
+      class="absolute top-2.5 left-2.5 shrink-0 rounded-full text-text-secondary hover:bg-white/10"
+      :aria-label="$t('g.back')"
+      @click="handleBackToPricing"
+    >
+      <i class="pi pi-arrow-left text-xl" />
+    </Button>
+
+    <Button
+      size="icon"
+      variant="muted-textonly"
+      class="absolute top-2.5 right-2.5 shrink-0 rounded-full text-text-secondary hover:bg-white/10"
+      :aria-label="$t('g.close')"
+      @click="onClose"
+    >
+      <i class="pi pi-times text-xl" />
+    </Button>
+
+    <div class="flex flex-col items-center gap-3">
+      <h2 class="m-0 font-inter text-2xl font-semibold text-base-foreground">
+        {{ $t('subscription.descriptionWorkspace') }}
+      </h2>
+    </div>
+
+    <div v-if="reason === 'out_of_credits'" class="text-center">
+      <h2 class="m-0 text-xl text-muted-foreground lg:text-2xl">
+        {{ $t('credits.topUp.insufficientTitle') }}
+      </h2>
+      <p class="m-0 mt-2 text-sm text-text-secondary">
+        {{ $t('credits.topUp.insufficientMessage') }}
+      </p>
+    </div>
+
+    <!-- Pricing Table Step (unified: personal/team plan toggle) -->
+    <UnifiedPricingTable
+      v-if="checkoutStep === 'pricing'"
+      class="xl:flex-1"
+      :initial-plan-mode="initialPlanMode"
+      :is-loading="isLoadingPreview || isResubscribing"
+      :loading-tier="loadingTier"
+      @subscribe="handleSubscribeClick"
+      @resubscribe="handleResubscribe"
+      @subscribe-team="handleSubscribeTeamClick"
+    />
+
+    <!-- Subscription Preview Step - New Subscription -->
+    <SubscriptionAddPaymentPreviewWorkspace
+      v-else-if="
+        checkoutStep === 'preview' &&
+        previewData &&
+        previewData.transition_type === 'new_subscription'
+      "
+      :preview-data="previewData"
+      :tier-key="selectedTierKey!"
+      :billing-cycle="selectedBillingCycle"
+      :is-loading="isSubscribing || isPolling"
+      @add-credit-card="handleAddCreditCard"
+      @back="handleBackToPricing"
+    />
+
+    <!-- Subscription Preview Step - Plan Transition -->
+    <SubscriptionTransitionPreviewWorkspace
+      v-else-if="
+        checkoutStep === 'preview' &&
+        previewData &&
+        previewData.transition_type !== 'new_subscription'
+      "
+      :preview-data="previewData"
+      :is-loading="isSubscribing || isPolling"
+      @confirm="handleConfirmTransition"
+      @back="handleBackToPricing"
+    />
+
+    <!-- Subscription Preview Step - Team (display-only until the BE slider
+         contract lands; the confirm CTA is stubbed below) -->
+    <SubscriptionAddPaymentPreviewWorkspace
+      v-else-if="checkoutStep === 'preview' && selectedTeamStop"
+      :team-plan="selectedTeamStop"
+      @add-credit-card="handleTeamSubscribe"
+      @back="handleBackToPricing"
+    />
+
+    <!-- Success Step - "You're all set" -->
+    <SubscriptionSuccessWorkspace
+      v-else-if="checkoutStep === 'success' && selectedTierKey"
+      :tier-key="selectedTierKey"
+      :preview-data="previewData"
+      @close="handleSuccessClose"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { cn } from '@comfyorg/tailwind-utils'
+import { useToast } from 'primevue/usetoast'
+import { useI18n } from 'vue-i18n'
+
+import Button from '@/components/ui/button/Button.vue'
+import type { SubscriptionDialogReason } from '@/platform/cloud/subscription/composables/useSubscriptionDialog'
+import { useSubscriptionCheckout } from '@/platform/workspace/composables/useSubscriptionCheckout'
+
+import SubscriptionAddPaymentPreviewWorkspace from './SubscriptionAddPaymentPreviewWorkspace.vue'
+import SubscriptionSuccessWorkspace from './SubscriptionSuccessWorkspace.vue'
+import SubscriptionTransitionPreviewWorkspace from './SubscriptionTransitionPreviewWorkspace.vue'
+import UnifiedPricingTable from './UnifiedPricingTable.vue'
+
+const { onClose, reason, initialPlanMode } = defineProps<{
+  onClose: () => void
+  reason?: SubscriptionDialogReason
+  initialPlanMode?: 'personal' | 'team'
+}>()
+
+const emit = defineEmits<{
+  close: [subscribed: boolean]
+}>()
+
+const { t } = useI18n()
+const toast = useToast()
+
+const {
+  checkoutStep,
+  isLoadingPreview,
+  loadingTier,
+  isSubscribing,
+  isResubscribing,
+  previewData,
+  selectedTierKey,
+  selectedTeamStop,
+  selectedBillingCycle,
+  isPolling,
+  handleSubscribeClick,
+  handleSubscribeTeamClick,
+  handleBackToPricing,
+  handleSuccessClose,
+  handleAddCreditCard,
+  handleConfirmTransition,
+  handleResubscribe
+} = useSubscriptionCheckout(emit)
+
+// Personal-tier checkout reuses the full useSubscriptionCheckout flow above.
+// Team-plan checkout renders the confirm step from the selected slider stop,
+// but the final subscribe is blocked on the BE discount-breakpoint contract
+// (FE-934 / doc Open Q#2: the slider stop -> plan-slug / subscribe-request shape
+// is undefined), so the confirm CTA is stubbed until that lands.
+function handleTeamSubscribe() {
+  toast.add({
+    severity: 'info',
+    summary: t('subscription.teamPlan.name'),
+    detail: t('subscription.teamPlan.checkoutComingSoon'),
+    life: 4000
+  })
+}
+</script>
diff --git a/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.test.ts b/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.test.ts
index 680af8da60..04b63be3ec 100644
--- a/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.test.ts
+++ b/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.test.ts
@@ -14,7 +14,8 @@ const mockHandleBackToPricing = vi.fn()
 const mockHandleAddCreditCard = vi.fn()
 const mockHandleConfirmTransition = vi.fn()
 const mockHandleResubscribe = vi.fn()
-const mockCheckoutStep = ref<'pricing' | 'preview'>('pricing')
+const mockHandleSuccessClose = vi.fn()
+const mockCheckoutStep = ref<'pricing' | 'preview' | 'success'>('pricing')
 const mockPreviewData = ref<{ transition_type: string } | null>(null)
 
 vi.mock('@/platform/workspace/composables/useSubscriptionCheckout', () => ({
@@ -32,7 +33,8 @@ vi.mock('@/platform/workspace/composables/useSubscriptionCheckout', () => ({
     handleBackToPricing: mockHandleBackToPricing,
     handleAddCreditCard: mockHandleAddCreditCard,
     handleConfirmTransition: mockHandleConfirmTransition,
-    handleResubscribe: mockHandleResubscribe
+    handleResubscribe: mockHandleResubscribe,
+    handleSuccessClose: mockHandleSuccessClose
   })
 }))
 
@@ -78,6 +80,13 @@ const TransitionPreviewStub = {
   </div>`
 }
 
+const SuccessStub = {
+  name: 'SubscriptionSuccessWorkspace',
+  template: `<div data-testid="success">
+    <button data-testid="success-close-btn" @click="$emit('close')">Done</button>
+  </div>`
+}
+
 function renderComponent(
   props: { onClose?: () => void; reason?: SubscriptionDialogReason } = {}
 ) {
@@ -94,7 +103,8 @@ function renderComponent(
       stubs: {
         PricingTableWorkspace: PricingTableStub,
         SubscriptionAddPaymentPreviewWorkspace: AddPaymentPreviewStub,
-        SubscriptionTransitionPreviewWorkspace: TransitionPreviewStub
+        SubscriptionTransitionPreviewWorkspace: TransitionPreviewStub,
+        SubscriptionSuccessWorkspace: SuccessStub
       }
     }
   })
@@ -195,4 +205,21 @@ describe('SubscriptionRequiredDialogContentWorkspace', () => {
 
     expect(mockHandleBackToPricing).toHaveBeenCalled()
   })
+
+  it('shows the success screen on the success step', () => {
+    mockCheckoutStep.value = 'success'
+    renderComponent()
+    expect(screen.getByTestId('success')).toBeInTheDocument()
+    expect(screen.queryByTestId('pricing-table')).not.toBeInTheDocument()
+  })
+
+  it('wires the success close event to handleSuccessClose', async () => {
+    const user = userEvent.setup()
+    mockCheckoutStep.value = 'success'
+    renderComponent()
+
+    await user.click(screen.getByTestId('success-close-btn'))
+
+    expect(mockHandleSuccessClose).toHaveBeenCalled()
+  })
 })
diff --git a/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue b/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue
index f8a815ac37..b83e6f4f68 100644
--- a/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue
+++ b/src/platform/workspace/components/SubscriptionRequiredDialogContentWorkspace.vue
@@ -90,6 +90,14 @@
       @confirm="handleConfirmTransition"
       @back="handleBackToPricing"
     />
+
+    <!-- Success Step - subscribe/change-plan confirmation -->
+    <SubscriptionSuccessWorkspace
+      v-else-if="checkoutStep === 'success' && selectedTierKey"
+      :tier-key="selectedTierKey"
+      :preview-data="previewData"
+      @close="handleSuccessClose"
+    />
   </div>
 </template>
 
@@ -100,6 +108,7 @@ import { useSubscriptionCheckout } from '@/platform/workspace/composables/useSub
 
 import PricingTableWorkspace from './PricingTableWorkspace.vue'
 import SubscriptionAddPaymentPreviewWorkspace from './SubscriptionAddPaymentPreviewWorkspace.vue'
+import SubscriptionSuccessWorkspace from './SubscriptionSuccessWorkspace.vue'
 import SubscriptionTransitionPreviewWorkspace from './SubscriptionTransitionPreviewWorkspace.vue'
 
 const { onClose, reason } = defineProps<{
@@ -125,7 +134,8 @@ const {
   handleBackToPricing,
   handleAddCreditCard,
   handleConfirmTransition,
-  handleResubscribe
+  handleResubscribe,
+  handleSuccessClose
 } = useSubscriptionCheckout(emit)
 </script>
 
diff --git a/src/platform/workspace/components/SubscriptionSuccessWorkspace.test.ts b/src/platform/workspace/components/SubscriptionSuccessWorkspace.test.ts
new file mode 100644
index 0000000000..d593340c3d
--- /dev/null
+++ b/src/platform/workspace/components/SubscriptionSuccessWorkspace.test.ts
@@ -0,0 +1,70 @@
+import userEvent from '@testing-library/user-event'
+import { render, screen } from '@testing-library/vue'
+import { describe, expect, it, vi } from 'vitest'
+
+import type { PreviewSubscribeResponse } from '@/platform/workspace/api/workspaceApi'
+
+import SubscriptionSuccessWorkspace from './SubscriptionSuccessWorkspace.vue'
+
+vi.mock('vue-i18n', () => ({
+  useI18n: () => ({
+    t: (key: string) => key,
+    n: (value: number) => String(value)
+  })
+}))
+
+function makePreviewData(priceCents: number): PreviewSubscribeResponse {
+  return {
+    allowed: true,
+    transition_type: 'new_subscription',
+    effective_at: '2026-07-10T00:00:00Z',
+    is_immediate: true,
+    cost_today_cents: priceCents,
+    cost_next_period_cents: priceCents,
+    credits_today_cents: 0,
+    credits_next_period_cents: 0,
+    new_plan: {
+      slug: 'standard-monthly',
+      tier: 'STANDARD',
+      duration: 'MONTHLY',
+      price_cents: priceCents,
+      credits_cents: 0,
+      seat_summary: {
+        seat_count: 1,
+        total_cost_cents: priceCents,
+        total_credits_cents: 0
+      }
+    }
+  }
+}
+
+function renderCard() {
+  return render(SubscriptionSuccessWorkspace, {
+    props: {
+      tierKey: 'standard',
+      previewData: makePreviewData(1600)
+    },
+    global: {
+      mocks: { $t: (key: string) => key },
+      stubs: {
+        Button: {
+          template: '<button @click="$emit(\'click\')"><slot /></button>'
+        }
+      }
+    }
+  })
+}
+
+describe('SubscriptionSuccessWorkspace', () => {
+  it('renders the all-set heading and plan price', () => {
+    renderCard()
+    expect(screen.getByText('subscription.success.allSet')).toBeTruthy()
+    expect(screen.getByText('$16')).toBeTruthy()
+  })
+
+  it('emits close when the close button is clicked', async () => {
+    const { emitted } = renderCard()
+    await userEvent.click(screen.getByRole('button'))
+    expect(emitted().close).toBeTruthy()
+  })
+})
diff --git a/src/platform/workspace/components/SubscriptionSuccessWorkspace.vue b/src/platform/workspace/components/SubscriptionSuccessWorkspace.vue
new file mode 100644
index 0000000000..d6670df354
--- /dev/null
+++ b/src/platform/workspace/components/SubscriptionSuccessWorkspace.vue
@@ -0,0 +1,81 @@
+<template>
+  <div
+    class="mx-auto flex h-full max-w-[400px] flex-col items-stretch justify-between text-sm"
+  >
+    <div class="flex flex-col items-center gap-4 pt-8">
+      <i class="pi pi-check-circle text-success-foreground text-5xl" />
+      <h2
+        class="m-0 text-center text-xl font-semibold text-base-foreground lg:text-2xl"
+      >
+        {{ $t('subscription.success.allSet') }}
+      </h2>
+      <p class="m-0 text-center text-sm text-muted-foreground">
+        {{ $t('subscription.success.planUpdated') }}
+        {{ $t('subscription.success.receiptEmailed') }}
+      </p>
+
+      <!-- Plan summary -->
+      <div
+        class="mt-4 flex w-full flex-col gap-1 rounded-xl border border-border-default bg-base-background p-4"
+      >
+        <span class="text-sm text-base-foreground">{{ tierName }}</span>
+        <div class="flex items-baseline gap-1">
+          <span class="text-2xl font-semibold text-base-foreground">
+            ${{ displayPrice }}
+          </span>
+          <span class="text-sm text-base-foreground">
+            {{ $t('subscription.usdPerMonth') }}
+          </span>
+        </div>
+        <div class="flex items-center gap-1 text-sm text-muted-foreground">
+          <i class="icon-[comfy--credits] size-4 shrink-0 bg-amber-400" />
+          <span>{{ displayCredits }} {{ $t('subscription.perMonth') }}</span>
+        </div>
+      </div>
+
+      <!-- Team success "Invite your team" block renders here (FE-965 / DES-394). -->
+    </div>
+
+    <div class="flex flex-col gap-2 pt-8">
+      <Button
+        variant="secondary"
+        size="lg"
+        class="w-full rounded-lg"
+        @click="$emit('close')"
+      >
+        {{ $t('g.close') }}
+      </Button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+import Button from '@/components/ui/button/Button.vue'
+import { getTierCredits } from '@/platform/cloud/subscription/constants/tierPricing'
+import type { TierKey } from '@/platform/cloud/subscription/constants/tierPricing'
+import type { PreviewSubscribeResponse } from '@/platform/workspace/api/workspaceApi'
+
+const { tierKey, previewData = null } = defineProps<{
+  tierKey: Exclude<TierKey, 'free' | 'founder'>
+  previewData?: PreviewSubscribeResponse | null
+}>()
+
+defineEmits<{
+  close: []
+}>()
+
+const { t, n } = useI18n()
+
+const tierName = computed(() => t(`subscription.tiers.${tierKey}.name`))
+
+const displayPrice = computed(() =>
+  previewData?.new_plan
+    ? (previewData.new_plan.price_cents / 100).toFixed(0)
+    : '0'
+)
+
+const displayCredits = computed(() => n(getTierCredits(tierKey) ?? 0))
+</script>
diff --git a/src/platform/workspace/components/SubscriptionTermsNote.vue b/src/platform/workspace/components/SubscriptionTermsNote.vue
new file mode 100644
index 0000000000..15087a879f
--- /dev/null
+++ b/src/platform/workspace/components/SubscriptionTermsNote.vue
@@ -0,0 +1,26 @@
+<template>
+  <p class="m-0 text-center text-xs text-muted-foreground">
+    <i18n-t keypath="subscription.preview.termsAgreement" tag="span">
+      <template #terms>
+        <a
+          href="https://www.comfy.org/terms"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="underline hover:text-base-foreground"
+        >
+          {{ $t('subscription.preview.terms') }}
+        </a>
+      </template>
+      <template #privacy>
+        <a
+          href="https://www.comfy.org/privacy"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="underline hover:text-base-foreground"
+        >
+          {{ $t('subscription.preview.privacyPolicy') }}
+        </a>
+      </template>
+    </i18n-t>
+  </p>
+</template>
diff --git a/src/platform/workspace/components/SubscriptionTransitionPreviewWorkspace.vue b/src/platform/workspace/components/SubscriptionTransitionPreviewWorkspace.vue
index 69e47964be..c2c606f71b 100644
--- a/src/platform/workspace/components/SubscriptionTransitionPreviewWorkspace.vue
+++ b/src/platform/workspace/components/SubscriptionTransitionPreviewWorkspace.vue
@@ -9,7 +9,7 @@
       <!-- Plan Comparison Header -->
       <div class="flex items-center gap-4">
         <!-- Current Plan -->
-        <div class="flex w-[250px] flex-col gap-1">
+        <div class="flex flex-1 flex-col gap-1">
           <span class="text-sm text-base-foreground">
             {{ currentTierName }}
           </span>
@@ -18,11 +18,11 @@
               ${{ currentDisplayPrice }}
             </span>
             <span class="text-sm text-base-foreground">
-              {{ $t('subscription.usdPerMonthPerMember') }}
+              {{ $t('subscription.usdPerMonth') }}
             </span>
           </div>
           <div class="flex items-center gap-1 text-sm text-muted-foreground">
-            <i class="icon-[lucide--component] text-xs text-amber-400" />
+            <i class="icon-[comfy--credits] size-3.5 shrink-0 bg-amber-400" />
             <span
               >{{ currentDisplayCredits }}
               {{ $t('subscription.perMonth') }}</span
@@ -36,10 +36,10 @@
         </div>
 
         <!-- Arrow -->
-        <i class="pi pi-arrow-right size-8 text-muted-foreground" />
+        <i class="pi pi-arrow-right size-8 shrink-0 text-muted-foreground" />
 
         <!-- New Plan -->
-        <div class="flex flex-col gap-1">
+        <div class="flex flex-1 flex-col gap-1">
           <span class="text-sm font-semibold text-base-foreground">
             {{ newTierName }}
           </span>
@@ -48,11 +48,11 @@
               ${{ newDisplayPrice }}
             </span>
             <span class="text-sm text-base-foreground">
-              {{ $t('subscription.usdPerMonthPerMember') }}
+              {{ $t('subscription.usdPerMonth') }}
             </span>
           </div>
           <div class="flex items-center gap-1 text-sm text-muted-foreground">
-            <i class="icon-[lucide--component] text-xs text-amber-400" />
+            <i class="icon-[comfy--credits] size-3.5 shrink-0 bg-amber-400" />
             <span
               >{{ newDisplayCredits }} {{ $t('subscription.perMonth') }}</span
             >
@@ -63,19 +63,32 @@
         </div>
       </div>
 
-      <!-- Credits Section -->
+      <!-- Next Cycle Section -->
       <div class="flex flex-col gap-3 pt-12 pb-6">
+        <span class="text-base-foreground">
+          {{
+            $t('subscription.preview.everyMonthStarting', {
+              date: effectiveDate
+            })
+          }}
+        </span>
         <div class="flex items-center justify-between">
-          <span class="text-base-foreground">
-            {{ $t('subscription.preview.eachMonthCreditsRefill') }}
+          <span class="text-muted-foreground">
+            {{ $t('subscription.preview.creditsRefillTo') }}
           </span>
           <div class="flex items-center gap-1">
-            <i class="icon-[lucide--component] text-sm text-amber-400" />
+            <i class="icon-[comfy--credits] size-4 shrink-0 bg-amber-400" />
             <span class="font-bold text-base-foreground">
               {{ newDisplayCredits }}
             </span>
           </div>
         </div>
+        <div class="flex items-center justify-between">
+          <span class="text-muted-foreground">
+            {{ $t('subscription.preview.youllBeCharged') }}
+          </span>
+          <span class="text-base-foreground">${{ newMonthlyCharge }}</span>
+        </div>
       </div>
 
       <!-- Proration Section -->
@@ -131,6 +144,8 @@
 
     <!-- Footer -->
     <div class="flex flex-col gap-2 pt-8">
+      <SubscriptionTermsNote />
+
       <Button
         variant="secondary"
         size="lg"
@@ -138,7 +153,7 @@
         :loading="isLoading"
         @click="$emit('confirm')"
       >
-        {{ $t('subscription.preview.confirm') }}
+        {{ $t('subscription.preview.switchToPlan', { plan: newTierName }) }}
       </Button>
 
       <Button
@@ -160,6 +175,8 @@ import Button from '@/components/ui/button/Button.vue'
 import { getTierCredits } from '@/platform/cloud/subscription/constants/tierPricing'
 import type { PreviewSubscribeResponse } from '@/platform/workspace/api/workspaceApi'
 
+import SubscriptionTermsNote from './SubscriptionTermsNote.vue'
+
 interface Props {
   previewData: PreviewSubscribeResponse
   isLoading?: boolean
@@ -202,6 +219,10 @@ const newDisplayPrice = computed(() =>
   (previewData.new_plan.price_cents / 100).toFixed(0)
 )
 
+const newMonthlyCharge = computed(() =>
+  (previewData.new_plan.price_cents / 100).toFixed(2)
+)
+
 const currentDisplayCredits = computed(() => {
   if (!previewData.current_plan) return n(0)
   const tierKey = previewData.current_plan.tier.toLowerCase() as
diff --git a/src/platform/workspace/components/UnifiedPricingTable.stories.ts b/src/platform/workspace/components/UnifiedPricingTable.stories.ts
new file mode 100644
index 0000000000..2419cf178a
--- /dev/null
+++ b/src/platform/workspace/components/UnifiedPricingTable.stories.ts
@@ -0,0 +1,46 @@
+import type { Meta, StoryObj } from '@storybook/vue3-vite'
+
+import UnifiedPricingTable from './UnifiedPricingTable.vue'
+
+/**
+ * The unified pricing table (B4 / FE-934): one table for the new billing model,
+ * with a personal/team **plan** toggle on a single workspace (Gamma-style).
+ *
+ * Note: the personal/team toggle itself only renders when `teamWorkspacesEnabled`
+ * is on (a server flag, off in Storybook), so these stories drive the view via
+ * `initialPlanMode` instead. Personal prices fall back to the static
+ * `TIER_PRICING` (no API in Storybook); the team column uses the locked DES-197
+ * credit-slider stops.
+ */
+const meta: Meta<typeof UnifiedPricingTable> = {
+  title: 'Components/UnifiedPricingTable',
+  component: UnifiedPricingTable,
+  tags: ['autodocs'],
+  parameters: { layout: 'fullscreen' },
+  argTypes: {
+    initialPlanMode: {
+      control: 'inline-radio',
+      options: ['personal', 'team']
+    }
+  },
+  decorators: [
+    (story) => ({
+      components: { story },
+      template:
+        '<div class="mx-auto max-w-[1328px] bg-base-background p-8"><story /></div>'
+    })
+  ]
+}
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+/** Personal plans (Standard / Creator / Pro) with the monthly/yearly toggle. */
+export const Personal: Story = {
+  args: { initialPlanMode: 'personal' }
+}
+
+/** Team plan: the credit slider + Enterprise card. */
+export const TeamPlan: Story = {
+  args: { initialPlanMode: 'team' }
+}
diff --git a/src/platform/workspace/components/UnifiedPricingTable.test.ts b/src/platform/workspace/components/UnifiedPricingTable.test.ts
new file mode 100644
index 0000000000..0531d883f0
--- /dev/null
+++ b/src/platform/workspace/components/UnifiedPricingTable.test.ts
@@ -0,0 +1,233 @@
+import { render, screen } from '@testing-library/vue'
+import userEvent from '@testing-library/user-event'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { computed, ref } from 'vue'
+import { createI18n } from 'vue-i18n'
+
+import Button from '@/components/ui/button/Button.vue'
+import enMessages from '@/locales/en/main.json'
+import UnifiedPricingTable from '@/platform/workspace/components/UnifiedPricingTable.vue'
+
+interface MockSubscription {
+  tier: string
+  isCancelled?: boolean
+  duration?: string
+}
+
+interface MockTeamStop {
+  id: string
+  credits_monthly: number
+  stop_usd: number
+}
+
+const mockSubscription = ref<MockSubscription | null>(null)
+const mockCurrentPlanSlug = ref<string | null>(null)
+const mockCurrentTeamCreditStop = ref<MockTeamStop | null>(null)
+const mockTeamFlag = ref(false)
+
+vi.mock('@/composables/billing/useBillingContext', () => ({
+  useBillingContext: () => ({
+    plans: ref([]),
+    currentPlanSlug: computed(() => mockCurrentPlanSlug.value),
+    fetchPlans: vi.fn(),
+    subscription: computed(() => mockSubscription.value),
+    currentTeamCreditStop: computed(() => mockCurrentTeamCreditStop.value)
+  })
+}))
+
+vi.mock('@/composables/useFeatureFlags', () => ({
+  useFeatureFlags: () => ({
+    flags: { teamWorkspacesEnabled: mockTeamFlag.value }
+  })
+}))
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages: { en: enMessages }
+})
+
+function renderComponent(props: Record<string, unknown> = {}) {
+  return render(UnifiedPricingTable, {
+    props,
+    global: {
+      plugins: [i18n],
+      components: { Button },
+      stubs: {
+        SelectButton: { template: '<div />' },
+        // Clicking emits a change to a different stop ($200) so tests can move
+        // the selection off the current stop.
+        CreditSlider: {
+          template:
+            '<button data-testid="team-slider" @click="$emit(\'change\', { index: 0, usd: 200, credits: 42200 })" />',
+          emits: ['change', 'update:modelValue']
+        }
+      }
+    }
+  })
+}
+
+describe('UnifiedPricingTable plan CTA labels', () => {
+  beforeEach(() => {
+    mockSubscription.value = null
+    mockCurrentPlanSlug.value = null
+    mockCurrentTeamCreditStop.value = null
+    mockTeamFlag.value = false
+  })
+
+  it('prompts free-tier users to subscribe, never to "change"', () => {
+    mockSubscription.value = { tier: 'FREE', duration: 'ANNUAL' }
+
+    renderComponent()
+
+    expect(
+      screen.getByRole('button', { name: 'Subscribe to Standard Yearly' })
+    ).toBeTruthy()
+    expect(
+      screen.getByRole('button', { name: 'Subscribe to Creator Yearly' })
+    ).toBeTruthy()
+    expect(
+      screen.getByRole('button', { name: 'Subscribe to Pro Yearly' })
+    ).toBeTruthy()
+    expect(screen.queryByRole('button', { name: /^Change to/ })).toBeNull()
+  })
+
+  it('offers a plan change to users already on a paid plan', () => {
+    mockSubscription.value = { tier: 'STANDARD', duration: 'ANNUAL' }
+
+    renderComponent()
+
+    expect(
+      screen.getByRole('button', { name: 'Change to Creator Yearly' })
+    ).toBeTruthy()
+    expect(
+      screen.getByRole('button', { name: 'Change to Pro Yearly' })
+    ).toBeTruthy()
+  })
+
+  it('keeps personal tier cards actionable for a team subscriber', () => {
+    mockSubscription.value = { tier: 'TEAM', duration: 'ANNUAL' }
+    mockCurrentTeamCreditStop.value = {
+      id: 'team_700',
+      credits_monthly: 147_700,
+      stop_usd: 700
+    }
+
+    renderComponent()
+
+    expect(screen.queryByRole('button', { name: /Not available/ })).toBeNull()
+  })
+})
+
+describe('UnifiedPricingTable team plan CTA', () => {
+  const TEAM_STOP = {
+    id: 'team_2500',
+    credits_monthly: 527_500,
+    stop_usd: 2_500
+  }
+
+  beforeEach(() => {
+    mockSubscription.value = null
+    mockCurrentPlanSlug.value = null
+    mockCurrentTeamCreditStop.value = null
+    mockTeamFlag.value = true
+  })
+
+  it('disables the CTA while sitting on the active current plan', () => {
+    mockSubscription.value = {
+      tier: 'TEAM',
+      duration: 'ANNUAL',
+      isCancelled: false
+    }
+    mockCurrentTeamCreditStop.value = TEAM_STOP
+
+    renderComponent({ initialPlanMode: 'team' })
+
+    const cta = screen.getByRole('button', { name: 'Current plan' })
+    expect(cta).toBeDisabled()
+  })
+
+  it('lets an active sub change to a different stop', async () => {
+    const user = userEvent.setup()
+    mockSubscription.value = {
+      tier: 'TEAM',
+      duration: 'ANNUAL',
+      isCancelled: false
+    }
+    mockCurrentTeamCreditStop.value = TEAM_STOP
+
+    const { emitted } = renderComponent({ initialPlanMode: 'team' })
+
+    await user.click(screen.getByTestId('team-slider'))
+
+    const cta = screen.getByRole('button', { name: 'Change plan' })
+    expect(cta).toBeEnabled()
+    await user.click(cta)
+    expect(emitted().subscribeTeam).toBeTruthy()
+  })
+
+  it('lets an active sub change billing cycle at the current stop', async () => {
+    const user = userEvent.setup()
+    mockSubscription.value = {
+      tier: 'TEAM',
+      duration: 'MONTHLY',
+      isCancelled: false
+    }
+    mockCurrentTeamCreditStop.value = TEAM_STOP
+
+    const { emitted } = renderComponent({ initialPlanMode: 'team' })
+
+    // The subscription is monthly; the default view is yearly, so the same stop
+    // on the other cycle is a change, not the current plan.
+    const cta = screen.getByRole('button', { name: 'Change plan' })
+    expect(cta).toBeEnabled()
+    await user.click(cta)
+    expect(emitted().subscribeTeam).toBeTruthy()
+    expect(emitted().resubscribe).toBeFalsy()
+  })
+
+  it('re-subscribes (not change) for a cancelled team subscription', async () => {
+    const user = userEvent.setup()
+    mockSubscription.value = {
+      tier: 'TEAM',
+      duration: 'ANNUAL',
+      isCancelled: true
+    }
+    mockCurrentTeamCreditStop.value = TEAM_STOP
+
+    const { emitted } = renderComponent({ initialPlanMode: 'team' })
+
+    const cta = screen.getByRole('button', { name: 'Resubscribe' })
+    expect(cta).toBeEnabled()
+    await user.click(cta)
+    expect(emitted().resubscribe).toBeTruthy()
+  })
+
+  it('lets a cancelled sub change to a different stop (not re-subscribe)', async () => {
+    const user = userEvent.setup()
+    mockSubscription.value = {
+      tier: 'TEAM',
+      duration: 'ANNUAL',
+      isCancelled: true
+    }
+    mockCurrentTeamCreditStop.value = TEAM_STOP
+
+    const { emitted } = renderComponent({ initialPlanMode: 'team' })
+
+    await user.click(screen.getByTestId('team-slider'))
+
+    const cta = screen.getByRole('button', { name: 'Change plan' })
+    expect(cta).toBeEnabled()
+    await user.click(cta)
+    expect(emitted().subscribeTeam).toBeTruthy()
+    expect(emitted().resubscribe).toBeFalsy()
+  })
+
+  it('prompts a fresh subscribe when on no team plan', () => {
+    renderComponent({ initialPlanMode: 'team' })
+
+    expect(
+      screen.getByRole('button', { name: 'Subscribe to Team Yearly' })
+    ).toBeTruthy()
+  })
+})
diff --git a/src/platform/workspace/components/UnifiedPricingTable.vue b/src/platform/workspace/components/UnifiedPricingTable.vue
new file mode 100644
index 0000000000..763b96f1dd
--- /dev/null
+++ b/src/platform/workspace/components/UnifiedPricingTable.vue
@@ -0,0 +1,833 @@
+<template>
+  <div class="flex flex-col xl:h-full">
+    <!-- Plan-scope toggle (personal vs team PLAN on one workspace): sits directly
+         on top of the content area — outside it, attached with no gap (DES QA).
+         Only shown when team plans are available (teamWorkspacesEnabled). -->
+    <div v-if="showTeam" class="flex justify-center">
+      <SelectButton
+        v-model="planMode"
+        :options="planScopeOptions"
+        option-label="label"
+        option-value="value"
+        :allow-empty="false"
+        unstyled
+        :pt="planScopeButtonPt"
+      />
+    </div>
+
+    <!-- Content well: a borderless base-background area (DES-197 "Personal Plan,
+         Yearly" 2951:584251 — bg base-background, rounded-2xl, NO border, 32px
+         padding) holding the description, billing toggle and plan cards on one
+         uniform surface. "Remove the outline" = drop the border, not the area.
+         Grows to fill the dialog so its height stays constant across the
+         personal/team toggle. -->
+    <div
+      class="flex min-h-0 flex-col gap-6 rounded-2xl bg-base-background p-8 xl:flex-1"
+    >
+      <!-- Plan-scope description, above the billing toggle (DES-197). -->
+      <I18nT
+        v-if="planMode === 'personal'"
+        keypath="subscription.personalHeader"
+        tag="p"
+        class="m-0 text-center text-sm text-muted-foreground"
+      >
+        <template #action>
+          <button
+            type="button"
+            class="cursor-pointer border-none bg-transparent p-0 text-sm text-base-foreground hover:text-muted-foreground"
+            @click="planMode = 'team'"
+          >
+            {{ t('subscription.personalHeaderAction') }}
+          </button>
+        </template>
+      </I18nT>
+      <I18nT
+        v-else
+        keypath="subscription.teamHeader"
+        tag="p"
+        class="m-0 text-center text-sm text-muted-foreground"
+      >
+        <template #learnMore>
+          <button
+            type="button"
+            class="cursor-pointer border-none bg-transparent p-0 text-sm text-base-foreground hover:text-muted-foreground"
+            @click="handleViewEnterprise"
+          >
+            {{ t('subscription.teamHeaderLearnMore') }}
+          </button>
+        </template>
+      </I18nT>
+
+      <!-- Billing-cycle toggle: drives both the personal tier cards and the
+           team credit slider (team monthly halves the yearly discount). -->
+      <div class="flex justify-center">
+        <SelectButton
+          v-model="currentBillingCycle"
+          :options="billingCycleOptions"
+          option-label="label"
+          option-value="value"
+          :allow-empty="false"
+          unstyled
+          :pt="toggleButtonPt"
+        >
+          <template #option="{ option }">
+            <div class="flex items-center gap-2">
+              <span>{{ option.label }}</span>
+              <div
+                v-if="option.value === 'yearly'"
+                class="flex items-center rounded-full bg-primary-background px-2 py-0.5 text-2xs font-bold whitespace-nowrap text-white"
+              >
+                {{
+                  planMode === 'team'
+                    ? t('subscription.saveYearlyUpTo')
+                    : t('subscription.saveYearly')
+                }}
+              </div>
+            </div>
+          </template>
+        </SelectButton>
+      </div>
+
+      <!-- PERSONAL PLANS: tier cards (data-driven via the billing facade,
+         falling back to TIER_PRICING). -->
+      <div
+        v-if="planMode === 'personal'"
+        class="flex flex-col items-stretch gap-6 xl:flex-1 xl:flex-row xl:justify-center"
+      >
+        <div
+          v-for="tier in tiers"
+          :key="tier.id"
+          class="flex flex-col rounded-2xl border border-border-default bg-base-background shadow-[0_0_12px_rgba(0,0,0,0.1)] xl:w-80"
+        >
+          <div class="flex flex-1 flex-col gap-4 p-6 pb-0">
+            <div class="flex flex-row items-center justify-between gap-2">
+              <span
+                class="font-inter text-base/normal font-bold text-base-foreground"
+              >
+                {{ tier.name }}
+              </span>
+              <div
+                v-if="tier.isPopular"
+                class="flex h-5 items-center rounded-full bg-base-foreground px-1.5 text-2xs font-bold tracking-tight text-base-background uppercase"
+              >
+                {{ t('subscription.mostPopular') }}
+              </div>
+            </div>
+            <div class="flex flex-col gap-2">
+              <div class="flex flex-row items-baseline gap-2">
+                <span
+                  class="font-inter text-[28px] leading-normal font-semibold text-base-foreground tabular-nums"
+                >
+                  ${{ getPrice(tier) }}
+                  <span
+                    v-show="currentBillingCycle === 'yearly'"
+                    class="text-2xl text-muted-foreground line-through"
+                  >
+                    ${{ getMonthlyPrice(tier) }}
+                  </span>
+                </span>
+                <span class="font-inter text-sm/normal text-base-foreground">
+                  {{ t('subscription.usdPerMonth') }}
+                </span>
+              </div>
+              <span class="text-sm text-muted-foreground">
+                {{
+                  currentBillingCycle === 'yearly'
+                    ? t('subscription.billedYearly', {
+                        total: `$${getAnnualTotal(tier)}`
+                      })
+                    : t('subscription.billedMonthly')
+                }}
+              </span>
+            </div>
+
+            <div class="h-px w-full bg-border-default" />
+
+            <!-- Progressive feature list: "What's included" then
+                 "Everything in {prev tier}, plus:" (DES-197). -->
+            <div class="flex flex-col gap-3">
+              <span class="text-sm text-muted-foreground">
+                {{ tier.featuresHeader }}
+              </span>
+              <div
+                v-for="feature in tier.features"
+                :key="feature"
+                class="flex flex-row items-start gap-2"
+              >
+                <i class="pi pi-check mt-0.5 text-xs text-base-foreground" />
+                <span class="text-sm font-normal text-muted-foreground">
+                  {{ feature }}
+                </span>
+              </div>
+            </div>
+
+            <!-- Credit grant + template-based video estimate, pinned to the
+                 card bottom so the figures align across tiers. -->
+            <div class="mt-auto flex flex-col gap-1">
+              <div class="flex flex-row items-center gap-2">
+                <i
+                  class="icon-[comfy--credits] size-4 shrink-0 bg-amber-400"
+                  aria-hidden="true"
+                />
+                <span
+                  class="font-inter text-sm/normal font-bold text-base-foreground tabular-nums"
+                >
+                  {{ n(tier.pricing.credits) }}
+                </span>
+                <span class="text-sm text-muted-foreground">
+                  {{ t('subscription.monthlyCredits') }}
+                </span>
+              </div>
+              <span class="text-sm text-muted-foreground">
+                {{
+                  t('subscription.videoEstimate', {
+                    count: n(tier.pricing.videoEstimate)
+                  })
+                }}
+              </span>
+            </div>
+          </div>
+          <div class="flex flex-col p-6">
+            <Button
+              :variant="getButtonSeverity(tier)"
+              :disabled="isButtonDisabled(tier)"
+              :loading="loadingTier === tier.key"
+              :class="
+                cn(
+                  'h-10 w-full',
+                  getButtonTextClass(tier),
+                  tier.key === 'creator'
+                    ? 'border-transparent bg-base-foreground hover:bg-inverted-background-hover'
+                    : 'border-transparent bg-secondary-background hover:bg-secondary-background-hover focus:bg-secondary-background-selected'
+                )
+              "
+              @click="() => handleSubscribe(tier.key)"
+            >
+              {{ getButtonLabel(tier) }}
+            </Button>
+          </div>
+        </div>
+      </div>
+
+      <!-- TEAM PLAN: [Team Plan | Details] card + Enterprise card -->
+      <div v-else class="flex min-h-0 flex-col gap-6 xl:flex-1">
+        <div
+          class="flex flex-col items-stretch gap-6 xl:flex-1 xl:flex-row xl:justify-center"
+        >
+          <!-- Team Plan + Details share one card, split by a divider. -->
+          <div
+            class="flex flex-[2.6] flex-col rounded-2xl border border-border-default bg-base-background shadow-[0_0_12px_rgba(0,0,0,0.1)] xl:flex-row xl:overflow-hidden"
+          >
+            <!-- Team Plan column -->
+            <div class="flex flex-[1.6] flex-col gap-6 p-6">
+              <div class="flex flex-col gap-1">
+                <span
+                  class="font-inter text-base/normal font-bold text-base-foreground"
+                >
+                  {{ t('subscription.teamPlan.name') }}
+                </span>
+                <span class="text-sm text-muted-foreground">
+                  {{ t('subscription.teamPlan.tagline') }}
+                </span>
+              </div>
+
+              <!-- Credit slider owns its price/discount/billed display; the
+                   cycle halves the yearly discount when monthly. -->
+              <CreditSlider
+                v-model="teamUsd"
+                :cycle="currentBillingCycle"
+                @change="onTeamChange"
+              />
+
+              <!-- Selected credit grant + template-based video estimate -->
+              <div class="flex flex-col gap-1">
+                <div class="flex flex-row items-center gap-2">
+                  <i
+                    class="icon-[comfy--credits] size-4 shrink-0 bg-amber-400"
+                    aria-hidden="true"
+                  />
+                  <span
+                    class="font-inter text-sm/normal font-bold text-base-foreground tabular-nums"
+                  >
+                    {{ n(teamCredits) }}
+                  </span>
+                  <span class="text-sm text-muted-foreground">
+                    {{ t('subscription.monthlyCredits') }}
+                  </span>
+                </div>
+                <span class="text-sm text-muted-foreground">
+                  {{
+                    t('subscription.videoEstimate', {
+                      count: n(teamVideoEstimate)
+                    })
+                  }}
+                </span>
+              </div>
+
+              <!-- CTA pinned to the card bottom (aligns with Enterprise CTA) -->
+              <Button
+                variant="inverted"
+                :disabled="isTeamButtonDisabled"
+                class="mt-auto h-10 w-full font-inter text-sm/normal font-bold"
+                @click="handleSubscribeTeam"
+              >
+                {{ teamButtonLabel }}
+              </Button>
+            </div>
+
+            <!-- Divider: horizontal when stacked, vertical at xl -->
+            <div
+              class="h-px w-full shrink-0 self-stretch bg-border-default xl:h-auto xl:w-px"
+            />
+
+            <!-- Details column -->
+            <div class="flex flex-1 flex-col gap-4 p-6">
+              <span
+                class="font-inter text-base/normal font-bold text-base-foreground"
+              >
+                {{ t('subscription.teamPlan.detailsTitle') }}
+              </span>
+
+              <div class="flex flex-col gap-3">
+                <span class="text-sm text-muted-foreground">
+                  {{
+                    t('subscription.everythingInPlus', {
+                      plan: t('subscription.tiers.pro.name')
+                    })
+                  }}
+                </span>
+                <div
+                  v-for="perk in teamDetailPerks"
+                  :key="perk"
+                  class="flex flex-row items-start gap-2"
+                >
+                  <i class="pi pi-check mt-0.5 text-xs text-base-foreground" />
+                  <span class="text-sm font-normal text-muted-foreground">
+                    {{ perk }}
+                  </span>
+                </div>
+              </div>
+
+              <div class="flex flex-col gap-3">
+                <span class="text-sm text-muted-foreground">
+                  {{ t('subscription.teamPlan.comingSoonLabel') }}
+                </span>
+                <div class="flex flex-row items-start gap-2">
+                  <i class="pi pi-clock mt-0.5 text-xs text-muted-foreground" />
+                  <span class="text-sm font-normal text-muted-foreground">
+                    {{ t('subscription.teamPlan.perkProjectAssets') }}
+                  </span>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <!-- Enterprise card -->
+          <div
+            class="flex flex-1 flex-col gap-4 rounded-2xl border border-border-default bg-base-background p-6 shadow-[0_0_12px_rgba(0,0,0,0.1)]"
+          >
+            <span
+              class="font-inter text-base/normal font-bold text-base-foreground"
+            >
+              {{ t('subscription.enterprise.name') }}
+            </span>
+            <div class="flex flex-col gap-3">
+              <span class="text-sm/relaxed font-normal text-muted-foreground">
+                {{ t('subscription.enterprise.needMoreMembers') }}
+              </span>
+              <span class="text-sm/relaxed font-normal text-muted-foreground">
+                {{ t('subscription.enterprise.flexibility') }}
+              </span>
+            </div>
+            <div class="h-px w-full bg-border-default" />
+            <span class="text-sm/relaxed font-normal text-muted-foreground">
+              {{ t('subscription.enterprise.reachOut') }}
+            </span>
+            <Button
+              variant="secondary"
+              class="mt-auto h-10 w-full border-transparent bg-secondary-background font-bold hover:bg-secondary-background-hover"
+              @click="handleViewEnterprise"
+            >
+              {{ t('subscription.enterprise.cta') }}
+            </Button>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Footnote: template caveat + contact / pricing links -->
+    <I18nT
+      keypath="subscription.pricingBlurb"
+      tag="p"
+      class="m-0 mt-auto pt-4 text-center text-sm text-text-secondary"
+    >
+      <template #seeDetails>
+        <a
+          :href="VIDEO_TEMPLATE_URL"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="cursor-pointer text-sm text-base-foreground no-underline hover:text-muted-foreground"
+        >
+          {{ t('subscription.pricingBlurbSeeDetails') }}
+        </a>
+      </template>
+      <template #questions>
+        <a
+          :href="QUESTIONS_URL"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="cursor-pointer text-sm text-base-foreground no-underline hover:text-muted-foreground"
+        >
+          {{ t('subscription.pricingBlurbQuestions') }}
+        </a>
+      </template>
+      <template #enterpriseDiscussions>
+        <a
+          :href="ENTERPRISE_URL"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="cursor-pointer text-sm text-base-foreground no-underline hover:text-muted-foreground"
+        >
+          {{ t('subscription.pricingBlurbEnterprise') }}
+        </a>
+      </template>
+      <template #clickHere>
+        <a
+          :href="PRICING_URL"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="cursor-pointer text-sm text-base-foreground no-underline hover:text-muted-foreground"
+        >
+          {{ t('subscription.pricingBlurbClickHere') }}
+        </a>
+      </template>
+    </I18nT>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { cn } from '@comfyorg/tailwind-utils'
+import SelectButton from 'primevue/selectbutton'
+import type { ToggleButtonPassThroughMethodOptions } from 'primevue/togglebutton'
+import { computed, onMounted, ref, watch } from 'vue'
+import { I18nT, useI18n } from 'vue-i18n'
+
+import Button from '@/components/ui/button/Button.vue'
+import CreditSlider from '@/components/ui/credit-slider/CreditSlider.vue'
+import { useBillingContext } from '@/composables/billing/useBillingContext'
+import { useFeatureFlags } from '@/composables/useFeatureFlags'
+import {
+  TIER_PRICING,
+  TIER_TO_KEY
+} from '@/platform/cloud/subscription/constants/tierPricing'
+import type {
+  SubscriptionTier,
+  TierKey,
+  TierPricing
+} from '@/platform/cloud/subscription/constants/tierPricing'
+import {
+  DEFAULT_TEAM_PLAN_STOP_INDEX,
+  getDiscountedMonthlyUsd,
+  TEAM_PLAN_CREDIT_STOPS
+} from '@/platform/cloud/subscription/constants/teamPlanCreditStops'
+import type { TeamPlanSelection } from '@/platform/cloud/subscription/constants/teamPlanCreditStops'
+import type { BillingCycle } from '@/platform/cloud/subscription/utils/subscriptionTierRank'
+import type { Plan } from '@/platform/workspace/api/workspaceApi'
+
+type CheckoutTierKey = Exclude<TierKey, 'free' | 'founder'>
+
+interface Props {
+  isLoading?: boolean
+  loadingTier?: CheckoutTierKey | null
+  /** Initial plan scope. The toggle to switch is only shown when team plans
+   *  are available (`teamWorkspacesEnabled`). */
+  initialPlanMode?: 'personal' | 'team'
+}
+
+const {
+  isLoading,
+  loadingTier = null,
+  initialPlanMode = 'personal'
+} = defineProps<Props>()
+
+const emit = defineEmits<{
+  subscribe: [payload: { tierKey: CheckoutTierKey; billingCycle: BillingCycle }]
+  resubscribe: []
+  // Team-plan checkout. NOTE: the slider stop -> plan-slug mapping is blocked on
+  // the BE discount-breakpoint contract (FE-934 / doc Open Q#2); the host shows
+  // the confirm step but stubs the final subscribe until the contract lands.
+  // TODO(FE-934): once the contract lands, also carry `currentBillingCycle`
+  // (yearly | monthly) so checkout subscribes to the selected cycle, not just
+  // the stop. The pricing-table view already toggles cycle; the confirm/checkout
+  // chain still assumes yearly.
+  subscribeTeam: [payload: TeamPlanSelection]
+}>()
+
+const { t, n } = useI18n()
+const { flags } = useFeatureFlags()
+
+/** Team plans only exist behind the flag (mirrors useBillingContext type). */
+const showTeam = computed(() => flags.teamWorkspacesEnabled)
+
+const planMode = ref<'personal' | 'team'>(initialPlanMode)
+
+/** The Wan 2.2 i2v template the video estimates are based on. */
+const VIDEO_TEMPLATE_URL =
+  'https://cloud.comfy.org/?template=video_wan2_2_14B_i2v'
+
+/** External footnote destinations — rendered as real links (open in a new tab). */
+const QUESTIONS_URL = 'https://portal.usepylon.com/comfy-org/forms/question'
+const ENTERPRISE_URL = 'https://www.comfy.org/enterprise'
+const PRICING_URL = 'https://www.comfy.org/pricing'
+
+/** Videos-per-credit ratio is constant across tiers; reuse it for the team
+ *  plan's template-based estimate until the BE carries a team figure. */
+const VIDEO_PER_CREDIT =
+  TIER_PRICING.pro.videoEstimate / TIER_PRICING.pro.credits
+
+interface BillingCycleOption {
+  label: string
+  value: BillingCycle
+}
+
+interface PlanScopeOption {
+  label: string
+  value: 'personal' | 'team'
+}
+
+interface PricingTierConfig {
+  id: SubscriptionTier
+  key: CheckoutTierKey
+  name: string
+  pricing: TierPricing
+  /** "What's included:" (Standard) or "Everything in {prev}, plus:". */
+  featuresHeader: string
+  features: string[]
+  isPopular?: boolean
+}
+
+// Billing-cycle toggle: the active option is a solid white pill (DES-197).
+const toggleButtonPt = {
+  root: {
+    class: 'flex gap-1 bg-secondary-background rounded-lg p-1.5'
+  },
+  pcToggleButton: {
+    root: ({ context }: ToggleButtonPassThroughMethodOptions) => ({
+      class: [
+        // min-w keeps Yearly (with its discount badge) and Monthly the same
+        // width so the active pill doesn't resize when toggling (DES QA).
+        'h-8 min-w-44 px-5 rounded-md transition-colors cursor-pointer border-none outline-none ring-0 text-sm font-medium flex items-center justify-center',
+        context.active
+          ? 'bg-base-foreground text-base-background'
+          : 'bg-transparent text-muted-foreground hover:bg-secondary-background-hover'
+      ]
+    }),
+    label: { class: 'flex items-center gap-2 ' }
+  }
+}
+
+// Plan-scope toggle (For Personal / For Teams): active is a subtle raised pill,
+// not the solid white of the billing toggle (DES-197 2951:592113).
+const planScopeButtonPt = {
+  // No pill container (DES "Plan Type Tabs" 2812:818371 has no bg) — just the
+  // tabs, so the active base-background tab sits flush on top of the content area.
+  root: {
+    class: 'flex gap-1'
+  },
+  pcToggleButton: {
+    root: ({ context }: ToggleButtonPassThroughMethodOptions) => ({
+      class: [
+        'h-8 px-4 rounded-t-md transition cursor-pointer border-none outline-none ring-0 text-sm font-medium flex items-center justify-center',
+        // Inactive tab is the active tab at half opacity (DES QA) — same fill
+        // and text, faded as one, not a separate muted colour.
+        context.active
+          ? 'bg-base-background text-base-foreground'
+          : 'bg-base-background text-base-foreground opacity-50 hover:opacity-100'
+      ]
+    }),
+    label: { class: 'flex items-center gap-2' }
+  }
+}
+
+const planScopeOptions: PlanScopeOption[] = [
+  { label: t('subscription.planScope.personal'), value: 'personal' },
+  { label: t('subscription.planScope.team'), value: 'team' }
+]
+
+const billingCycleOptions: BillingCycleOption[] = [
+  { label: t('subscription.yearly'), value: 'yearly' },
+  { label: t('subscription.monthly'), value: 'monthly' }
+]
+
+/** Team-plan "Details" column perks (DES-197), shown under "Everything in Pro". */
+const teamDetailPerks: string[] = [
+  t('subscription.teamPlan.perkInviteMembers'),
+  t('subscription.teamPlan.perkConcurrentRuns'),
+  t('subscription.teamPlan.perkSharedPool'),
+  t('subscription.teamPlan.perkRolePermissions')
+]
+
+const tiers: PricingTierConfig[] = [
+  {
+    id: 'STANDARD',
+    key: 'standard',
+    name: t('subscription.tiers.standard.name'),
+    pricing: TIER_PRICING.standard,
+    featuresHeader: t('subscription.whatsIncluded'),
+    features: [
+      t('subscription.tiers.standard.feature1'),
+      t('subscription.tiers.standard.feature2')
+    ],
+    isPopular: false
+  },
+  {
+    id: 'CREATOR',
+    key: 'creator',
+    name: t('subscription.tiers.creator.name'),
+    pricing: TIER_PRICING.creator,
+    featuresHeader: t('subscription.everythingInPlus', {
+      plan: t('subscription.tiers.standard.name')
+    }),
+    features: [t('subscription.tiers.creator.feature1')],
+    isPopular: true
+  },
+  {
+    id: 'PRO',
+    key: 'pro',
+    name: t('subscription.tiers.pro.name'),
+    pricing: TIER_PRICING.pro,
+    featuresHeader: t('subscription.everythingInPlus', {
+      plan: t('subscription.tiers.creator.name')
+    }),
+    features: [t('subscription.tiers.pro.feature1')],
+    isPopular: false
+  }
+]
+
+const {
+  plans: apiPlans,
+  currentPlanSlug,
+  fetchPlans,
+  subscription,
+  currentTeamCreditStop
+} = useBillingContext()
+
+const isCancelled = computed(() => subscription.value?.isCancelled ?? false)
+
+const currentBillingCycle = ref<BillingCycle>('yearly')
+
+// Team plan selection (slider). Stop -> slug mapping is BE-blocked (see emit).
+const teamUsd = ref<number>(
+  TEAM_PLAN_CREDIT_STOPS[DEFAULT_TEAM_PLAN_STOP_INDEX].usd
+)
+const teamCredits = ref<number>(
+  TEAM_PLAN_CREDIT_STOPS[DEFAULT_TEAM_PLAN_STOP_INDEX].credits
+)
+const teamVideoEstimate = computed(() =>
+  Math.round(teamCredits.value * VIDEO_PER_CREDIT)
+)
+
+// The team's currently-subscribed stop (null when on no team plan). Matched to
+// the slider stops by list price so the current stop can be disabled.
+const isTeamSubscribed = computed(() => currentTeamCreditStop.value !== null)
+const currentTeamStopIndex = computed(() => {
+  const usd = currentTeamCreditStop.value?.stop_usd
+  if (usd == null) return null
+  const i = TEAM_PLAN_CREDIT_STOPS.findIndex((stop) => stop.usd === usd)
+  return i === -1 ? null : i
+})
+
+// Start the slider on the current stop so an active subscriber sees their plan
+// (disabled) and must move off it to change.
+watch(
+  currentTeamCreditStop,
+  (stop) => {
+    if (!stop) return
+    teamUsd.value = stop.stop_usd
+    teamCredits.value = stop.credits_monthly
+  },
+  { immediate: true }
+)
+
+// The CTA — not the slider stop — reflects the current plan: on the active stop
+// it reads "Current plan" (disabled); a cancelled plan re-subscribes on its
+// stop. Any other stop is locked because the credit stop can't be changed.
+const isTeamCurrentStopSelected = computed(
+  () =>
+    currentTeamStopIndex.value !== null &&
+    TEAM_PLAN_CREDIT_STOPS[currentTeamStopIndex.value]?.usd === teamUsd.value
+)
+
+// Yearly and monthly at the same credit stop are distinct plans, so toggling
+// the cycle is a change, not the current plan.
+const subscribedCycle = computed<BillingCycle>(() =>
+  subscription.value?.duration === 'MONTHLY' ? 'monthly' : 'yearly'
+)
+const isTeamCurrentPlanSelected = computed(
+  () =>
+    isTeamCurrentStopSelected.value &&
+    currentBillingCycle.value === subscribedCycle.value
+)
+
+const teamButtonLabel = computed(() => {
+  if (!isTeamSubscribed.value) {
+    return currentBillingCycle.value === 'yearly'
+      ? t('subscription.teamPlan.cta')
+      : t('subscription.teamPlan.ctaMonthly')
+  }
+  // The exact current plan re-subscribes (cancelled) or reads "Current plan"
+  // (active); any other stop or cycle is a change.
+  if (isTeamCurrentPlanSelected.value) {
+    return isCancelled.value
+      ? t('subscription.resubscribe')
+      : t('subscription.teamPlan.currentPlan')
+  }
+  return t('subscription.teamPlan.changePlan')
+})
+
+const isTeamButtonDisabled = computed(
+  () =>
+    isLoading ||
+    (isTeamSubscribed.value &&
+      isTeamCurrentPlanSelected.value &&
+      !isCancelled.value)
+)
+
+onMounted(() => {
+  void fetchPlans()
+})
+
+function getApiPlanForTier(
+  tierKey: CheckoutTierKey,
+  duration: BillingCycle
+): Plan | undefined {
+  const apiDuration = duration === 'yearly' ? 'ANNUAL' : 'MONTHLY'
+  const apiTier = tierKey.toUpperCase() as Plan['tier']
+  return apiPlans.value.find(
+    (p) => p.tier === apiTier && p.duration === apiDuration
+  )
+}
+
+function getPriceFromApi(tier: PricingTierConfig): number | null {
+  const plan = getApiPlanForTier(tier.key, currentBillingCycle.value)
+  if (!plan) return null
+  const price = plan.price_cents / 100
+  return currentBillingCycle.value === 'yearly' ? price / 12 : price
+}
+
+const currentTierKey = computed<TierKey | null>(() =>
+  subscription.value?.tier ? TIER_TO_KEY[subscription.value.tier] : null
+)
+
+const isYearlySubscription = computed(
+  () => subscription.value?.duration === 'ANNUAL'
+)
+
+const isCurrentPlan = (tierKey: CheckoutTierKey): boolean => {
+  if (currentPlanSlug.value) {
+    const plan = getApiPlanForTier(tierKey, currentBillingCycle.value)
+    return plan?.slug === currentPlanSlug.value
+  }
+  if (!currentTierKey.value) return false
+  const selectedIsYearly = currentBillingCycle.value === 'yearly'
+  return (
+    currentTierKey.value === tierKey &&
+    isYearlySubscription.value === selectedIsYearly
+  )
+}
+
+const getButtonLabel = (tier: PricingTierConfig): string => {
+  const planName =
+    currentBillingCycle.value === 'yearly'
+      ? t('subscription.tierNameYearly', { name: tier.name })
+      : tier.name
+
+  if (isCurrentPlan(tier.key)) {
+    return isCancelled.value
+      ? t('subscription.resubscribeTo', { plan: planName })
+      : t('subscription.currentPlan')
+  }
+
+  // Free tier is not a paid plan to "change" from — those users subscribe.
+  const hasActivePaidPlan =
+    currentTierKey.value !== null && currentTierKey.value !== 'free'
+
+  return hasActivePaidPlan
+    ? t('subscription.changeTo', { plan: planName })
+    : t('subscription.subscribeTo', { plan: planName })
+}
+
+const getButtonSeverity = (
+  tier: PricingTierConfig
+): 'primary' | 'secondary' => {
+  if (isCurrentPlan(tier.key)) {
+    return isCancelled.value ? 'primary' : 'secondary'
+  }
+  if (tier.key === 'creator') return 'primary'
+  return 'secondary'
+}
+
+const isButtonDisabled = (tier: PricingTierConfig): boolean => {
+  if (isLoading) return true
+  if (isCurrentPlan(tier.key)) {
+    return !isCancelled.value
+  }
+  return false
+}
+
+const getButtonTextClass = (tier: PricingTierConfig): string =>
+  tier.key === 'creator'
+    ? 'font-inter text-sm font-bold leading-normal text-base-background'
+    : 'font-inter text-sm font-bold leading-normal text-primary-foreground'
+
+const getPrice = (tier: PricingTierConfig): number =>
+  getPriceFromApi(tier) ?? tier.pricing[currentBillingCycle.value]
+
+const getMonthlyPrice = (tier: PricingTierConfig): number => {
+  const plan = getApiPlanForTier(tier.key, 'monthly')
+  return plan ? plan.price_cents / 100 : tier.pricing.monthly
+}
+
+const getAnnualTotal = (tier: PricingTierConfig): number => {
+  const plan = getApiPlanForTier(tier.key, 'yearly')
+  return plan ? plan.price_cents / 100 : tier.pricing.yearly * 12
+}
+
+function handleSubscribe(tierKey: CheckoutTierKey) {
+  if (isLoading) return
+  if (isCurrentPlan(tierKey)) {
+    if (isCancelled.value) {
+      emit('resubscribe')
+    }
+    return
+  }
+  emit('subscribe', { tierKey, billingCycle: currentBillingCycle.value })
+}
+
+function onTeamChange(stop: { index: number; usd: number; credits: number }) {
+  teamUsd.value = stop.usd
+  teamCredits.value = stop.credits
+}
+
+function handleSubscribeTeam() {
+  if (isTeamButtonDisabled.value) return
+  // Re-subscribe only when keeping the exact current plan; any other stop or
+  // cycle is a change.
+  if (isCancelled.value && isTeamCurrentPlanSelected.value) {
+    emit('resubscribe')
+    return
+  }
+  emit('subscribeTeam', {
+    usd: teamUsd.value,
+    credits: teamCredits.value,
+    discountedUsd: getDiscountedMonthlyUsd(
+      teamUsd.value,
+      currentBillingCycle.value
+    )
+  })
+}
+
+function handleViewEnterprise() {
+  window.open(ENTERPRISE_URL, '_blank')
+}
+</script>
diff --git a/src/platform/workspace/components/dialogs/InviteMemberUpsellDialogContent.vue b/src/platform/workspace/components/dialogs/InviteMemberUpsellDialogContent.vue
index 5e6bd17bd3..3fd37ee4c6 100644
--- a/src/platform/workspace/components/dialogs/InviteMemberUpsellDialogContent.vue
+++ b/src/platform/workspace/components/dialogs/InviteMemberUpsellDialogContent.vue
@@ -52,10 +52,12 @@
 <script setup lang="ts">
 import Button from '@/components/ui/button/Button.vue'
 import { useBillingContext } from '@/composables/billing/useBillingContext'
+import { useSubscriptionDialog } from '@/platform/cloud/subscription/composables/useSubscriptionDialog'
 import { useDialogStore } from '@/stores/dialogStore'
 
 const dialogStore = useDialogStore()
-const { isActiveSubscription, showSubscriptionDialog } = useBillingContext()
+const { isActiveSubscription } = useBillingContext()
+const subscriptionDialog = useSubscriptionDialog()
 
 function onDismiss() {
   dialogStore.closeDialog({ key: 'invite-member-upsell' })
@@ -63,6 +65,6 @@ function onDismiss() {
 
 function onUpgrade() {
   dialogStore.closeDialog({ key: 'invite-member-upsell' })
-  showSubscriptionDialog()
+  subscriptionDialog.show({ planMode: 'team' })
 }
 </script>
diff --git a/src/platform/workspace/components/dialogs/settings/MembersPanelContent.test.ts b/src/platform/workspace/components/dialogs/settings/MembersPanelContent.test.ts
index fbaba6cf8d..6b3fc8b41a 100644
--- a/src/platform/workspace/components/dialogs/settings/MembersPanelContent.test.ts
+++ b/src/platform/workspace/components/dialogs/settings/MembersPanelContent.test.ts
@@ -14,7 +14,7 @@ import type {
 const mockHandleCopyInviteLink = vi.fn()
 const mockHandleRevokeInvite = vi.fn()
 const mockHandleCreateWorkspace = vi.fn()
-const mockShowSubscriptionDialog = vi.fn()
+const mockShowTeamPlans = vi.fn()
 const mockSelectMember = vi.fn()
 const mockToggleSort = vi.fn()
 
@@ -99,7 +99,7 @@ vi.mock('@/platform/workspace/composables/useMembersPanel', () => ({
       m.email.toLowerCase() === 'owner@example.com',
     selectMember: mockSelectMember,
     toggleSort: mockToggleSort,
-    showSubscriptionDialog: mockShowSubscriptionDialog,
+    showTeamPlans: mockShowTeamPlans,
     handleCopyInviteLink: mockHandleCopyInviteLink,
     handleRevokeInvite: mockHandleRevokeInvite,
     handleCreateWorkspace: mockHandleCreateWorkspace,
@@ -320,13 +320,13 @@ describe('MembersPanelContent', () => {
       ).toBeTruthy()
     })
 
-    it('opens subscription dialog on view plans click', async () => {
+    it('opens team plans on view plans click', async () => {
       renderComponent()
       const viewPlansBtn = screen.getByRole('button', {
         name: /workspacePanel\.members\.viewPlans/
       })
       await userEvent.click(viewPlansBtn)
-      expect(mockShowSubscriptionDialog).toHaveBeenCalled()
+      expect(mockShowTeamPlans).toHaveBeenCalled()
     })
 
     it('hides search input', () => {
diff --git a/src/platform/workspace/components/dialogs/settings/MembersPanelContent.vue b/src/platform/workspace/components/dialogs/settings/MembersPanelContent.vue
index b62993c9cb..becd26552d 100644
--- a/src/platform/workspace/components/dialogs/settings/MembersPanelContent.vue
+++ b/src/platform/workspace/components/dialogs/settings/MembersPanelContent.vue
@@ -168,7 +168,7 @@
           <MemberUpsellBanner
             v-if="isSingleSeatPlan"
             :is-active-subscription="isActiveSubscription"
-            @show-plans="showSubscriptionDialog()"
+            @show-plans="showTeamPlans()"
           />
 
           <!-- Pending Invites -->
@@ -229,7 +229,7 @@ const {
   isCurrentUser,
   selectMember,
   toggleSort,
-  showSubscriptionDialog,
+  showTeamPlans,
   handleCopyInviteLink,
   handleRevokeInvite,
   handleCreateWorkspace
diff --git a/src/platform/workspace/composables/useMembersPanel.test.ts b/src/platform/workspace/composables/useMembersPanel.test.ts
index 9686e07c41..bc3ca89d1e 100644
--- a/src/platform/workspace/composables/useMembersPanel.test.ts
+++ b/src/platform/workspace/composables/useMembersPanel.test.ts
@@ -321,6 +321,13 @@ vi.mock('@/platform/cloud/subscription/constants/tierPricing', () => ({
   }
 }))
 
+vi.mock(
+  '@/platform/cloud/subscription/composables/useSubscriptionDialog',
+  () => ({
+    useSubscriptionDialog: () => ({ show: vi.fn() })
+  })
+)
+
 vi.mock('@/services/dialogService', () => ({
   useDialogService: () => ({
     showRemoveMemberDialog: mockShowRemoveMemberDialog,
diff --git a/src/platform/workspace/composables/useMembersPanel.ts b/src/platform/workspace/composables/useMembersPanel.ts
index 4b14fd6f98..28507ba27f 100644
--- a/src/platform/workspace/composables/useMembersPanel.ts
+++ b/src/platform/workspace/composables/useMembersPanel.ts
@@ -5,6 +5,7 @@ import { useI18n } from 'vue-i18n'
 
 import { useCurrentUser } from '@/composables/auth/useCurrentUser'
 import { useBillingContext } from '@/composables/billing/useBillingContext'
+import { useSubscriptionDialog } from '@/platform/cloud/subscription/composables/useSubscriptionDialog'
 import { TIER_TO_KEY } from '@/platform/cloud/subscription/constants/tierPricing'
 import { useWorkspaceUI } from '@/platform/workspace/composables/useWorkspaceUI'
 import type {
@@ -84,12 +85,9 @@ export function useMembersPanel() {
   } = storeToRefs(workspaceStore)
   const { copyInviteLink } = workspaceStore
   const { permissions, uiConfig } = useWorkspaceUI()
-  const {
-    isActiveSubscription,
-    subscription,
-    showSubscriptionDialog,
-    getMaxSeats
-  } = useBillingContext()
+  const { isActiveSubscription, subscription, getMaxSeats } =
+    useBillingContext()
+  const subscriptionDialog = useSubscriptionDialog()
 
   const maxSeats = computed(() => {
     if (isPersonalWorkspace.value) return 1
@@ -189,6 +187,10 @@ export function useMembersPanel() {
     void showRemoveMemberDialog(member.id)
   }
 
+  function showTeamPlans() {
+    subscriptionDialog.show({ planMode: 'team' })
+  }
+
   return {
     searchQuery,
     activeView,
@@ -211,7 +213,7 @@ export function useMembersPanel() {
     isCurrentUser,
     selectMember,
     toggleSort,
-    showSubscriptionDialog,
+    showTeamPlans,
     handleCopyInviteLink,
     handleRevokeInvite,
     handleCreateWorkspace,
diff --git a/src/platform/workspace/composables/useSubscriptionCheckout.test.ts b/src/platform/workspace/composables/useSubscriptionCheckout.test.ts
index 43b8474a81..281034f885 100644
--- a/src/platform/workspace/composables/useSubscriptionCheckout.test.ts
+++ b/src/platform/workspace/composables/useSubscriptionCheckout.test.ts
@@ -235,6 +235,27 @@ describe('useSubscriptionCheckout', () => {
     })
   })
 
+  describe('handleSubscribeTeamClick', () => {
+    it('transitions to preview with the selected team stop', async () => {
+      const checkout = await setup()
+
+      checkout.handleSubscribeTeamClick({
+        usd: 400,
+        credits: 84_400,
+        discountedUsd: 380
+      })
+
+      expect(checkout.checkoutStep.value).toBe('preview')
+      expect(checkout.selectedTeamStop.value).toStrictEqual({
+        usd: 400,
+        credits: 84_400,
+        discountedUsd: 380
+      })
+      expect(checkout.previewData.value).toBeNull()
+      expect(checkout.selectedTierKey.value).toBeNull()
+    })
+  })
+
   describe('handleBackToPricing', () => {
     it('resets to pricing step and clears preview data', async () => {
       const checkout = await setup()
@@ -246,10 +267,24 @@ describe('useSubscriptionCheckout', () => {
       expect(checkout.checkoutStep.value).toBe('pricing')
       expect(checkout.previewData.value).toBeNull()
     })
+
+    it('clears the selected team stop', async () => {
+      const checkout = await setup()
+      checkout.handleSubscribeTeamClick({
+        usd: 400,
+        credits: 84_400,
+        discountedUsd: 380
+      })
+
+      checkout.handleBackToPricing()
+
+      expect(checkout.checkoutStep.value).toBe('pricing')
+      expect(checkout.selectedTeamStop.value).toBeNull()
+    })
   })
 
   describe('handleAddCreditCard', () => {
-    it('emits close on subscribed status', async () => {
+    it('transitions to success step on subscribed status', async () => {
       const checkout = await setup()
       checkout.selectedTierKey.value = 'standard'
       checkout.selectedBillingCycle.value = 'yearly'
@@ -267,7 +302,7 @@ describe('useSubscriptionCheckout', () => {
         'https://platform.comfy.org/payment/success',
         'https://platform.comfy.org/payment/failed'
       )
-      expect(emit).toHaveBeenCalledWith('close', true)
+      expect(checkout.checkoutStep.value).toBe('success')
     })
 
     it('opens payment URL when needs_payment_method', async () => {
@@ -305,7 +340,7 @@ describe('useSubscriptionCheckout', () => {
   })
 
   describe('handleConfirmTransition', () => {
-    it('emits close on subscribed status', async () => {
+    it('transitions to success step on subscribed status', async () => {
       const checkout = await setup()
       checkout.selectedTierKey.value = 'standard'
       checkout.selectedBillingCycle.value = 'yearly'
@@ -318,7 +353,7 @@ describe('useSubscriptionCheckout', () => {
 
       await checkout.handleConfirmTransition()
 
-      expect(emit).toHaveBeenCalledWith('close', true)
+      expect(checkout.checkoutStep.value).toBe('success')
     })
 
     it('shows error toast on failure', async () => {
diff --git a/src/platform/workspace/composables/useSubscriptionCheckout.ts b/src/platform/workspace/composables/useSubscriptionCheckout.ts
index 163ca6cac1..ae1f264adb 100644
--- a/src/platform/workspace/composables/useSubscriptionCheckout.ts
+++ b/src/platform/workspace/composables/useSubscriptionCheckout.ts
@@ -4,6 +4,7 @@ import { useI18n } from 'vue-i18n'
 
 import { useBillingContext } from '@/composables/billing/useBillingContext'
 import { getComfyPlatformBaseUrl } from '@/config/comfyApi'
+import type { TeamPlanSelection } from '@/platform/cloud/subscription/constants/teamPlanCreditStops'
 import type { TierKey } from '@/platform/cloud/subscription/constants/tierPricing'
 import type { BillingCycle } from '@/platform/cloud/subscription/utils/subscriptionTierRank'
 import { useTelemetry } from '@/platform/telemetry'
@@ -13,7 +14,7 @@ import type {
 } from '@/platform/workspace/api/workspaceApi'
 import { useBillingOperationStore } from '@/platform/workspace/stores/billingOperationStore'
 
-type CheckoutStep = 'pricing' | 'preview'
+type CheckoutStep = 'pricing' | 'preview' | 'success'
 type CheckoutTierKey = Exclude<TierKey, 'free' | 'founder'>
 
 export function findPlanSlug(
@@ -52,6 +53,7 @@ export function useSubscriptionCheckout(emit: {
   const isResubscribing = ref(false)
   const previewData = ref<PreviewSubscribeResponse | null>(null)
   const selectedTierKey = ref<CheckoutTierKey | null>(null)
+  const selectedTeamStop = ref<TeamPlanSelection | null>(null)
   const selectedBillingCycle = ref<BillingCycle>('yearly')
   const isPolling = computed(() => billingOperationStore.hasPendingOperations)
 
@@ -112,9 +114,26 @@ export function useSubscriptionCheckout(emit: {
     }
   }
 
+  /**
+   * Team-plan checkout entry: show the "Confirm your payment" step rendered
+   * from the selected slider stop. The final subscribe call stays stubbed in
+   * the host until the BE slider contract lands (FE-934 / doc Open Q#2).
+   */
+  function handleSubscribeTeamClick(payload: TeamPlanSelection) {
+    selectedTeamStop.value = payload
+    selectedTierKey.value = null
+    previewData.value = null
+    checkoutStep.value = 'preview'
+  }
+
   function handleBackToPricing() {
     checkoutStep.value = 'pricing'
     previewData.value = null
+    selectedTeamStop.value = null
+  }
+
+  function handleSuccessClose() {
+    emit('close', true)
   }
 
   async function handleSubscription() {
@@ -137,13 +156,8 @@ export function useSubscriptionCheckout(emit: {
 
       if (response.status === 'subscribed') {
         telemetry?.trackMonthlySubscriptionSucceeded()
-        toast.add({
-          severity: 'success',
-          summary: t('subscription.required.pollingSuccess'),
-          life: 5000
-        })
         await Promise.all([fetchStatus(), fetchBalance()])
-        emit('close', true)
+        checkoutStep.value = 'success'
       } else if (
         response.status === 'needs_payment_method' &&
         response.payment_method_url
@@ -203,10 +217,13 @@ export function useSubscriptionCheckout(emit: {
     isResubscribing,
     previewData,
     selectedTierKey,
+    selectedTeamStop,
     selectedBillingCycle,
     isPolling,
     handleSubscribeClick,
+    handleSubscribeTeamClick,
     handleBackToPricing,
+    handleSuccessClose,
     handleAddCreditCard: handleSubscription,
     handleConfirmTransition: handleSubscription,
     handleResubscribe
diff --git a/src/platform/workspace/composables/useWorkspaceBilling.ts b/src/platform/workspace/composables/useWorkspaceBilling.ts
index a5c8d0425a..2979f463e0 100644
--- a/src/platform/workspace/composables/useWorkspaceBilling.ts
+++ b/src/platform/workspace/composables/useWorkspaceBilling.ts
@@ -82,6 +82,10 @@ export function useWorkspaceBilling(): BillingState & BillingActions {
   const currentPlanSlug = computed(
     () => statusData.value?.plan_slug ?? billingPlans.currentPlanSlug.value
   )
+  const teamCreditStops = computed(() => billingPlans.teamCreditStops.value)
+  const currentTeamCreditStop = computed(
+    () => statusData.value?.team_credit_stop ?? null
+  )
 
   async function initialize(): Promise<void> {
     if (isInitialized.value) return
@@ -287,6 +291,8 @@ export function useWorkspaceBilling(): BillingState & BillingActions {
     balance,
     plans,
     currentPlanSlug,
+    teamCreditStops,
+    currentTeamCreditStop,
     isLoading,
     error,
     isActiveSubscription,
diff --git a/src/renderer/core/canvas/canvasStore.test.ts b/src/renderer/core/canvas/canvasStore.test.ts
index 4a3752b2fa..f8677e45fe 100644
--- a/src/renderer/core/canvas/canvasStore.test.ts
+++ b/src/renderer/core/canvas/canvasStore.test.ts
@@ -1,7 +1,10 @@
 import { createTestingPinia } from '@pinia/testing'
 import { setActivePinia } from 'pinia'
+import { nextTick } from 'vue'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
+import type { LGraphCanvas, Positionable } from '@/lib/litegraph/src/litegraph'
+import { LGraph, LGraphNode } from '@/lib/litegraph/src/litegraph'
 import { LGraphGroup } from '@/lib/litegraph/src/LGraphGroup'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 
@@ -85,6 +88,42 @@ describe('useCanvasStore', () => {
       expect(originalHandler).toHaveBeenCalledWith(2.0, app.canvas.ds.offset)
     })
   })
+
+  describe('node:before-removed selection cleanup', () => {
+    it('removes the node from store.selectedItems before its onRemoved fires', async () => {
+      const graph = new LGraph()
+      const node = new LGraphNode('test')
+      graph.add(node)
+
+      const selectedItems = new Set<Positionable>([node])
+      const fakeCanvas = {
+        canvas: document.createElement('canvas'),
+        graph,
+        selectedItems,
+        deselect: vi.fn((item: Positionable) => {
+          selectedItems.delete(item)
+        })
+      }
+      store.canvas = fakeCanvas as unknown as LGraphCanvas
+      await nextTick()
+      store.updateSelectedItems()
+      expect(store.selectedItems).toContain(node)
+
+      let stillSelectedInOnRemoved: boolean | undefined
+      node.onRemoved = () => {
+        stillSelectedInOnRemoved = store.selectedItems.includes(node)
+      }
+
+      graph.remove(node)
+
+      expect(
+        stillSelectedInOnRemoved,
+        'selectedItems must not contain the node when onRemoved fires'
+      ).toBe(false)
+      expect(store.selectedItems).toEqual([])
+    })
+  })
+
   it('Does not include groups in selected nodeIds', async () => {
     store.selectedItems = [new LGraphGroup()]
 
diff --git a/src/renderer/core/canvas/canvasStore.ts b/src/renderer/core/canvas/canvasStore.ts
index 868037c81a..96e18ce8e7 100644
--- a/src/renderer/core/canvas/canvasStore.ts
+++ b/src/renderer/core/canvas/canvasStore.ts
@@ -131,6 +131,18 @@ export const useCanvasStore = defineStore('canvas', () => {
   whenever(
     () => canvas.value,
     (newCanvas) => {
+      currentGraph.value = newCanvas.graph
+      // Scoped to the on-screen graph: selection only holds items from it,
+      // so removals in other graphs can't affect the live selection.
+      useEventListener(
+        () => currentGraph.value?.events,
+        'node:before-removed',
+        (e: CustomEvent<{ node: LGraphNode }>) => {
+          newCanvas.deselect(e.detail.node)
+          updateSelectedItems()
+        }
+      )
+
       useEventListener(
         newCanvas.canvas,
         'litegraph:set-graph',
diff --git a/src/renderer/core/layout/__tests__/TransformPane.test.ts b/src/renderer/core/layout/__tests__/TransformPane.test.ts
index 281b1a1766..da72e6bbc4 100644
--- a/src/renderer/core/layout/__tests__/TransformPane.test.ts
+++ b/src/renderer/core/layout/__tests__/TransformPane.test.ts
@@ -21,7 +21,6 @@ vi.mock('@/renderer/core/layout/transform/useTransformState', () => {
     useTransformState: () => ({
       camera: computed(() => mockData.mockCamera),
       transformStyle: computed(() => mockData.mockTransformStyle),
-      canvasToScreen: vi.fn(),
       screenToCanvas: vi.fn(),
       isNodeInViewport: vi.fn(),
       syncWithCanvas
@@ -180,7 +179,6 @@ describe('TransformPane', () => {
 
       const transformState = useTransformState()
       expect(transformState.syncWithCanvas).toBeDefined()
-      expect(transformState.canvasToScreen).toBeDefined()
       expect(transformState.screenToCanvas).toBeDefined()
     })
   })
diff --git a/src/renderer/core/layout/slots/slotIdentifier.ts b/src/renderer/core/layout/slots/slotIdentifier.ts
index 2600405e9c..955654805d 100644
--- a/src/renderer/core/layout/slots/slotIdentifier.ts
+++ b/src/renderer/core/layout/slots/slotIdentifier.ts
@@ -1,3 +1,5 @@
+import type { NodeId } from '@/renderer/core/layout/types'
+
 /**
  * Slot identifier utilities for consistent slot key generation and parsing
  *
@@ -7,7 +9,7 @@
  */
 
 interface SlotIdentifier {
-  nodeId: string
+  nodeId: NodeId
   index: number
   isInput: boolean
 }
@@ -18,23 +20,23 @@ interface SlotIdentifier {
  */
 export function getSlotKey(identifier: SlotIdentifier): string
 export function getSlotKey(
-  nodeId: string,
+  nodeId: NodeId,
   index: number,
   isInput: boolean
 ): string
 export function getSlotKey(
-  nodeIdOrIdentifier: string | SlotIdentifier,
+  nodeIdOrIdentifier: NodeId | SlotIdentifier,
   index?: number,
   isInput?: boolean
 ): string {
   if (typeof nodeIdOrIdentifier === 'object') {
     const { nodeId, index, isInput } = nodeIdOrIdentifier
-    return `${nodeId}-${isInput ? 'in' : 'out'}-${index}`
+    return `${String(nodeId)}-${isInput ? 'in' : 'out'}-${index}`
   }
 
   if (index === undefined || isInput === undefined) {
     throw new Error('Missing required parameters for slot key generation')
   }
 
-  return `${nodeIdOrIdentifier}-${isInput ? 'in' : 'out'}-${index}`
+  return `${String(nodeIdOrIdentifier)}-${isInput ? 'in' : 'out'}-${index}`
 }
diff --git a/src/renderer/core/layout/store/layoutStore.ts b/src/renderer/core/layout/store/layoutStore.ts
index 1cb27b06f3..20135f088f 100644
--- a/src/renderer/core/layout/store/layoutStore.ts
+++ b/src/renderer/core/layout/store/layoutStore.ts
@@ -127,8 +127,8 @@ class LayoutStoreImpl implements LayoutStore {
   private isGlobalDispatchQueued = false
 
   // CustomRef cache and trigger functions
-  private nodeRefs = new Map<NodeId, Ref<NodeLayout | null>>()
-  private nodeTriggers = new Map<NodeId, () => void>()
+  private nodeRefs = new Map<string, Ref<NodeLayout | null>>()
+  private nodeTriggers = new Map<string, () => void>()
 
   // New data structures for hit testing
   private linkLayouts = new Map<LinkId, LinkLayout>()
@@ -137,10 +137,10 @@ class LayoutStoreImpl implements LayoutStore {
   private rerouteLayouts = new Map<RerouteId, RerouteLayout>()
 
   // Spatial index managers
-  private spatialIndex: SpatialIndexManager // For nodes
-  private linkSegmentSpatialIndex: SpatialIndexManager // For link segments (single index for all link geometry)
-  private slotSpatialIndex: SpatialIndexManager // For slots
-  private rerouteSpatialIndex: SpatialIndexManager // For reroutes
+  private spatialIndex: SpatialIndexManager<NodeId> // For nodes
+  private linkSegmentSpatialIndex: SpatialIndexManager<string> // For link segments (single index for all link geometry)
+  private slotSpatialIndex: SpatialIndexManager<string> // For slots
+  private rerouteSpatialIndex: SpatialIndexManager<string> // For reroutes
 
   // Vue dragging state for selection toolbox (public ref for direct mutation)
   public isDraggingVueNodes = ref(false)
@@ -173,10 +173,10 @@ class LayoutStoreImpl implements LayoutStore {
     this.yoperations = this.ydoc.getArray('operations')
 
     // Initialize spatial index managers
-    this.spatialIndex = new SpatialIndexManager()
-    this.linkSegmentSpatialIndex = new SpatialIndexManager() // Single index for all link geometry
-    this.slotSpatialIndex = new SpatialIndexManager()
-    this.rerouteSpatialIndex = new SpatialIndexManager()
+    this.spatialIndex = new SpatialIndexManager<NodeId>()
+    this.linkSegmentSpatialIndex = new SpatialIndexManager<string>() // Single index for all link geometry
+    this.slotSpatialIndex = new SpatialIndexManager<string>()
+    this.rerouteSpatialIndex = new SpatialIndexManager<string>()
 
     // Listen for Yjs changes and trigger Vue reactivity
     this.ynodes.observe((event: Y.YMapEvent<NodeLayoutMap>) => {
@@ -230,24 +230,24 @@ class LayoutStoreImpl implements LayoutStore {
    * Get or create a customRef for a node layout
    */
   getNodeLayoutRef(nodeId: NodeId): Ref<NodeLayout | null> {
-    let nodeRef = this.nodeRefs.get(nodeId)
+    const nodeKey = String(nodeId)
+    let nodeRef = this.nodeRefs.get(nodeKey)
 
     if (!nodeRef) {
       nodeRef = customRef<NodeLayout | null>((track, trigger) => {
-        // Store the trigger so we can call it when Yjs changes
-        this.nodeTriggers.set(nodeId, trigger)
+        this.nodeTriggers.set(nodeKey, trigger)
 
         return {
           get: () => {
             track()
-            const ynode = this.ynodes.get(nodeId)
+            const ynode = this.ynodes.get(nodeKey)
             const layout = ynode ? yNodeToLayout(ynode) : null
             return layout
           },
           set: (newLayout: NodeLayout | null) => {
             if (newLayout === null) {
               // Delete operation
-              const existing = this.ynodes.get(nodeId)
+              const existing = this.ynodes.get(nodeKey)
               if (existing) {
                 this.applyOperation({
                   type: 'deleteNode',
@@ -261,7 +261,7 @@ class LayoutStoreImpl implements LayoutStore {
               }
             } else {
               // Update operation - detect what changed
-              const existing = this.ynodes.get(nodeId)
+              const existing = this.ynodes.get(nodeKey)
               if (!existing) {
                 // Create operation
                 this.applyOperation({
@@ -326,7 +326,7 @@ class LayoutStoreImpl implements LayoutStore {
         }
       })
 
-      this.nodeRefs.set(nodeId, nodeRef)
+      this.nodeRefs.set(nodeKey, nodeRef)
     }
 
     return nodeRef
@@ -341,13 +341,10 @@ class LayoutStoreImpl implements LayoutStore {
       void this.version
 
       const result: NodeId[] = []
-      for (const [nodeId] of this.ynodes) {
-        const ynode = this.ynodes.get(nodeId)
-        if (ynode) {
-          const layout = yNodeToLayout(ynode)
-          if (layout && boundsIntersect(layout.bounds, bounds)) {
-            result.push(nodeId)
-          }
+      for (const [nodeId, ynode] of this.ynodes) {
+        const layout = yNodeToLayout(ynode)
+        if (boundsIntersect(layout.bounds, bounds)) {
+          result.push(nodeId)
         }
       }
       return result
@@ -363,14 +360,9 @@ class LayoutStoreImpl implements LayoutStore {
       void this.version
 
       const result = new Map<NodeId, NodeLayout>()
-      for (const [nodeId] of this.ynodes) {
-        const ynode = this.ynodes.get(nodeId)
-        if (ynode) {
-          const layout = yNodeToLayout(ynode)
-          if (layout) {
-            result.set(nodeId, layout)
-          }
-        }
+      for (const [nodeId, ynode] of this.ynodes) {
+        const layout = yNodeToLayout(ynode)
+        result.set(nodeId, layout)
       }
       return result
     })
@@ -389,14 +381,9 @@ class LayoutStoreImpl implements LayoutStore {
   queryNodeAtPoint(point: Point): NodeId | null {
     const nodes: Array<[NodeId, NodeLayout]> = []
 
-    for (const [nodeId] of this.ynodes) {
-      const ynode = this.ynodes.get(nodeId)
-      if (ynode) {
-        const layout = yNodeToLayout(ynode)
-        if (layout) {
-          nodes.push([nodeId, layout])
-        }
-      }
+    for (const [nodeId, ynode] of this.ynodes) {
+      const layout = yNodeToLayout(ynode)
+      nodes.push([nodeId, layout])
     }
 
     // Sort by zIndex (top to bottom)
@@ -446,17 +433,7 @@ class LayoutStoreImpl implements LayoutStore {
   deleteLinkLayout(linkId: LinkId): void {
     const deleted = this.linkLayouts.delete(linkId)
     if (deleted) {
-      // Clean up any segment layouts for this link
-      const keysToDelete: string[] = []
-      for (const [key] of this.linkSegmentLayouts) {
-        if (key.startsWith(`${linkId}:`)) {
-          keysToDelete.push(key)
-        }
-      }
-      for (const key of keysToDelete) {
-        this.linkSegmentLayouts.delete(key)
-        this.linkSegmentSpatialIndex.remove(key)
-      }
+      this.cleanupLinkSegments(linkId)
     }
   }
 
@@ -536,6 +513,7 @@ class LayoutStoreImpl implements LayoutStore {
    * Update reroute layout data
    */
   updateRerouteLayout(rerouteId: RerouteId, layout: RerouteLayout): void {
+    const rerouteKey = String(rerouteId)
     const existing = this.rerouteLayouts.get(rerouteId)
 
     if (!existing) {
@@ -548,10 +526,10 @@ class LayoutStoreImpl implements LayoutStore {
 
     if (existing) {
       // Update spatial index
-      this.rerouteSpatialIndex.update(String(rerouteId), layout.bounds) // Spatial index uses strings
+      this.rerouteSpatialIndex.update(rerouteKey, layout.bounds)
     } else {
       // Insert into spatial index
-      this.rerouteSpatialIndex.insert(String(rerouteId), layout.bounds) // Spatial index uses strings
+      this.rerouteSpatialIndex.insert(rerouteKey, layout.bounds)
     }
 
     this.rerouteLayouts.set(rerouteId, layout)
@@ -564,7 +542,8 @@ class LayoutStoreImpl implements LayoutStore {
     const deleted = this.rerouteLayouts.delete(rerouteId)
     if (deleted) {
       // Remove from spatial index
-      this.rerouteSpatialIndex.remove(String(rerouteId)) // Spatial index uses strings
+      const rerouteKey = String(rerouteId)
+      this.rerouteSpatialIndex.remove(rerouteKey)
     }
   }
 
@@ -917,7 +896,7 @@ class LayoutStoreImpl implements LayoutStore {
     // Manually trigger affected node refs after transaction
     // This is needed because Yjs observers don't fire for property changes
     change.nodeIds.forEach((nodeId) => {
-      const trigger = this.nodeTriggers.get(nodeId)
+      const trigger = this.nodeTriggers.get(String(nodeId))
       if (trigger) {
         trigger()
       }
@@ -989,8 +968,9 @@ class LayoutStoreImpl implements LayoutStore {
    * This should be called from the component's onUnmounted hook.
    */
   cleanupNodeRef(nodeId: NodeId): void {
-    this.nodeRefs.delete(nodeId)
-    this.nodeTriggers.delete(nodeId)
+    const nodeKey = String(nodeId)
+    this.nodeRefs.delete(nodeKey)
+    this.nodeTriggers.delete(nodeKey)
   }
 
   /**
@@ -1018,8 +998,9 @@ class LayoutStoreImpl implements LayoutStore {
       this.isGlobalDispatchQueued = false
 
       nodes.forEach((node, index) => {
+        const nodeId = String(node.id)
         const layout: NodeLayout = {
-          id: node.id.toString(),
+          id: nodeId,
           position: { x: node.pos[0], y: node.pos[1] },
           size: { width: node.size[0], height: node.size[1] },
           zIndex: index,
@@ -1032,10 +1013,10 @@ class LayoutStoreImpl implements LayoutStore {
           }
         }
 
-        this.ynodes.set(layout.id, layoutToYNode(layout))
+        this.ynodes.set(nodeId, layoutToYNode(layout))
 
         // Add to spatial index
-        this.spatialIndex.insert(layout.id, layout.bounds)
+        this.spatialIndex.insert(nodeId, layout.bounds)
       })
 
       // Trigger all existing refs to notify Vue of the new data
@@ -1048,7 +1029,7 @@ class LayoutStoreImpl implements LayoutStore {
     operation: MoveNodeOperation,
     change: LayoutChange
   ): void {
-    const ynode = this.ynodes.get(operation.nodeId)
+    const ynode = this.ynodes.get(String(operation.nodeId))
     if (!ynode) {
       return
     }
@@ -1076,7 +1057,7 @@ class LayoutStoreImpl implements LayoutStore {
     operation: ResizeNodeOperation,
     change: LayoutChange
   ): void {
-    const ynode = this.ynodes.get(operation.nodeId)
+    const ynode = this.ynodes.get(String(operation.nodeId))
     if (!ynode) return
 
     const position = yNodeToLayout(ynode).position
@@ -1102,7 +1083,7 @@ class LayoutStoreImpl implements LayoutStore {
     operation: SetNodeZIndexOperation,
     change: LayoutChange
   ): void {
-    const ynode = this.ynodes.get(operation.nodeId)
+    const ynode = this.ynodes.get(String(operation.nodeId))
     if (!ynode) return
 
     ynode.set('zIndex', operation.zIndex)
@@ -1114,7 +1095,7 @@ class LayoutStoreImpl implements LayoutStore {
     change: LayoutChange
   ): void {
     const ynode = layoutToYNode(operation.layout)
-    this.ynodes.set(operation.nodeId, ynode)
+    this.ynodes.set(String(operation.nodeId), ynode)
 
     // Add to spatial index
     this.spatialIndex.insert(operation.nodeId, operation.layout.bounds)
@@ -1127,9 +1108,10 @@ class LayoutStoreImpl implements LayoutStore {
     operation: DeleteNodeOperation,
     change: LayoutChange
   ): void {
-    if (!this.ynodes.has(operation.nodeId)) return
+    const nodeKey = String(operation.nodeId)
+    if (!this.ynodes.has(nodeKey)) return
 
-    this.ynodes.delete(operation.nodeId)
+    this.ynodes.delete(nodeKey)
     // Note: We intentionally do NOT delete nodeRefs and nodeTriggers here.
     // During undo/redo, Vue components may still hold references to the old ref.
     // If we delete the trigger, Vue won't be notified when the node is re-created.
@@ -1143,7 +1125,8 @@ class LayoutStoreImpl implements LayoutStore {
 
     // Delete the associated links
     for (const linkId of linksToDelete) {
-      this.ylinks.delete(String(linkId))
+      const linkKey = String(linkId)
+      this.ylinks.delete(linkKey)
       this.linkLayouts.delete(linkId)
 
       // Clean up link segment layouts
@@ -1162,7 +1145,7 @@ class LayoutStoreImpl implements LayoutStore {
 
     for (const nodeId of operation.nodeIds) {
       const data = operation.bounds[nodeId]
-      const ynode = this.ynodes.get(nodeId)
+      const ynode = this.ynodes.get(String(nodeId))
       if (!ynode || !data) continue
 
       ynode.set('position', { x: data.bounds.x, y: data.bounds.y })
@@ -1197,7 +1180,8 @@ class LayoutStoreImpl implements LayoutStore {
     linkData.set('targetNodeId', operation.targetNodeId)
     linkData.set('targetSlot', operation.targetSlot)
 
-    this.ylinks.set(String(operation.linkId), linkData)
+    const linkKey = String(operation.linkId)
+    this.ylinks.set(linkKey, linkData)
 
     // Link geometry will be computed separately when nodes move
     // This just tracks that the link exists
@@ -1208,9 +1192,10 @@ class LayoutStoreImpl implements LayoutStore {
     operation: DeleteLinkOperation,
     change: LayoutChange
   ): void {
-    if (!this.ylinks.has(String(operation.linkId))) return
+    const linkKey = String(operation.linkId)
+    if (!this.ylinks.has(linkKey)) return
 
-    this.ylinks.delete(String(operation.linkId))
+    this.ylinks.delete(linkKey)
     this.linkLayouts.delete(operation.linkId)
     // Clean up any segment layouts for this link
     this.cleanupLinkSegments(operation.linkId)
@@ -1228,7 +1213,8 @@ class LayoutStoreImpl implements LayoutStore {
     rerouteData.set('parentId', operation.parentId)
     rerouteData.set('linkIds', operation.linkIds)
 
-    this.yreroutes.set(String(operation.rerouteId), rerouteData) // Yjs Map keys must be strings
+    const rerouteKey = String(operation.rerouteId)
+    this.yreroutes.set(rerouteKey, rerouteData)
 
     // The observer will automatically update the spatial index
     change.type = 'create'
@@ -1238,11 +1224,12 @@ class LayoutStoreImpl implements LayoutStore {
     operation: DeleteRerouteOperation,
     change: LayoutChange
   ): void {
-    if (!this.yreroutes.has(String(operation.rerouteId))) return // Yjs Map keys are strings
+    const rerouteKey = String(operation.rerouteId)
+    if (!this.yreroutes.has(rerouteKey)) return
 
-    this.yreroutes.delete(String(operation.rerouteId)) // Yjs Map keys are strings
+    this.yreroutes.delete(rerouteKey)
     this.rerouteLayouts.delete(operation.rerouteId) // Layout map uses numeric ID
-    this.rerouteSpatialIndex.remove(String(operation.rerouteId)) // Spatial index uses strings
+    this.rerouteSpatialIndex.remove(rerouteKey)
 
     change.type = 'delete'
   }
@@ -1251,7 +1238,8 @@ class LayoutStoreImpl implements LayoutStore {
     operation: MoveRerouteOperation,
     change: LayoutChange
   ): void {
-    const yreroute = this.yreroutes.get(String(operation.rerouteId)) // Yjs Map keys are strings
+    const rerouteKey = String(operation.rerouteId)
+    const yreroute = this.yreroutes.get(rerouteKey)
     if (!yreroute) return
 
     yreroute.set('position', operation.position)
@@ -1331,9 +1319,10 @@ class LayoutStoreImpl implements LayoutStore {
    * Clean up all segment layouts for a link
    */
   private cleanupLinkSegments(linkId: LinkId): void {
+    const linkPrefix = `${linkId}:`
     const keysToDelete: string[] = []
     for (const [key] of this.linkSegmentLayouts) {
-      if (key.startsWith(`${linkId}:`)) {
+      if (key.startsWith(linkPrefix)) {
         keysToDelete.push(key)
       }
     }
@@ -1364,15 +1353,17 @@ class LayoutStoreImpl implements LayoutStore {
    * Handle reroute deletion
    */
   private handleRerouteDelete(rerouteId: RerouteId): void {
+    const rerouteKey = String(rerouteId)
     this.rerouteLayouts.delete(rerouteId)
-    this.rerouteSpatialIndex.remove(String(rerouteId))
+    this.rerouteSpatialIndex.remove(rerouteKey)
   }
 
   /**
    * Handle reroute upsert (update if exists, create if not)
    */
   private handleRerouteUpsert(rerouteId: RerouteId): void {
-    const rerouteData = this.yreroutes.get(String(rerouteId))
+    const rerouteKey = String(rerouteId)
+    const rerouteData = this.yreroutes.get(rerouteKey)
     if (!rerouteData) return
 
     const position = this.getRerouteField(rerouteData, 'position')
@@ -1509,7 +1500,7 @@ class LayoutStoreImpl implements LayoutStore {
     const boundsRecord: BatchUpdateBoundsOperation['bounds'] = {}
 
     for (const { nodeId, bounds } of updates) {
-      const ynode = this.ynodes.get(nodeId)
+      const ynode = this.ynodes.get(String(nodeId))
       if (!ynode) continue
       const currentLayout = yNodeToLayout(ynode)
 
diff --git a/src/renderer/core/layout/sync/useLayoutSync.ts b/src/renderer/core/layout/sync/useLayoutSync.ts
index e37675d42a..c70d5d749f 100644
--- a/src/renderer/core/layout/sync/useLayoutSync.ts
+++ b/src/renderer/core/layout/sync/useLayoutSync.ts
@@ -110,7 +110,7 @@ export function useLayoutSync() {
       if (change.nodeIds.length === 0) return
 
       for (const nodeId of change.nodeIds) {
-        pendingNodeIds.add(nodeId)
+        pendingNodeIds.add(String(nodeId))
       }
       scheduleFlush(change.source, canvas)
     })
diff --git a/src/renderer/core/layout/transform/useTransformState.test.ts b/src/renderer/core/layout/transform/useTransformState.test.ts
index be76e8b752..7a2a748078 100644
--- a/src/renderer/core/layout/transform/useTransformState.test.ts
+++ b/src/renderer/core/layout/transform/useTransformState.test.ts
@@ -117,34 +117,6 @@ describe('useTransformState', () => {
       transformState.syncWithCanvas(mockCanvas as LGraphCanvas)
     })
 
-    describe('canvasToScreen', () => {
-      it('should convert canvas coordinates to screen coordinates', () => {
-        const { canvasToScreen } = transformState
-
-        const canvasPoint = { x: 10, y: 20 }
-        const screenPoint = canvasToScreen(canvasPoint)
-
-        // screen = (canvas + offset) * scale
-        // x: (10 + 100) * 2 = 220
-        // y: (20 + 50) * 2 = 140
-        expect(screenPoint).toEqual({ x: 220, y: 140 })
-      })
-
-      it('should handle zero coordinates', () => {
-        const { canvasToScreen } = transformState
-
-        const screenPoint = canvasToScreen({ x: 0, y: 0 })
-        expect(screenPoint).toEqual({ x: 200, y: 100 })
-      })
-
-      it('should handle negative coordinates', () => {
-        const { canvasToScreen } = transformState
-
-        const screenPoint = canvasToScreen({ x: -10, y: -20 })
-        expect(screenPoint).toEqual({ x: 180, y: 60 })
-      })
-    })
-
     describe('screenToCanvas', () => {
       it('should convert screen coordinates to canvas coordinates', () => {
         const { screenToCanvas } = transformState
@@ -157,186 +129,10 @@ describe('useTransformState', () => {
         // y: 140 / 2 - 50 = 20
         expect(canvasPoint).toEqual({ x: 10, y: 20 })
       })
-
-      it('should be inverse of canvasToScreen', () => {
-        const { canvasToScreen, screenToCanvas } = transformState
-
-        const originalPoint = { x: 25, y: 35 }
-        const screenPoint = canvasToScreen(originalPoint)
-        const backToCanvas = screenToCanvas(screenPoint)
-
-        expect(backToCanvas.x).toBeCloseTo(originalPoint.x)
-        expect(backToCanvas.y).toBeCloseTo(originalPoint.y)
-      })
-    })
-  })
-
-  describe('getNodeScreenBounds', () => {
-    beforeEach(() => {
-      const mockCanvas = createMockCanvasContext()
-      mockCanvas.ds.offset = [100, 50]
-      mockCanvas.ds.scale = 2
-      transformState.syncWithCanvas(mockCanvas as LGraphCanvas)
-    })
-
-    it('should calculate correct screen bounds for a node', () => {
-      const { getNodeScreenBounds } = transformState
-
-      const nodePos: [number, number] = [10, 20]
-      const nodeSize: [number, number] = [200, 100]
-      const bounds = getNodeScreenBounds(nodePos, nodeSize)
-
-      // Top-left: canvasToScreen(10, 20) = (220, 140)
-      // Width: 200 * 2 = 400
-      // Height: 100 * 2 = 200
-      expect(bounds.x).toBe(220)
-      expect(bounds.y).toBe(140)
-      expect(bounds.width).toBe(400)
-      expect(bounds.height).toBe(200)
-    })
-  })
-
-  describe('isNodeInViewport', () => {
-    beforeEach(() => {
-      const mockCanvas = createMockCanvasContext()
-      mockCanvas.ds.offset = [0, 0]
-      mockCanvas.ds.scale = 1
-      transformState.syncWithCanvas(mockCanvas as LGraphCanvas)
-    })
-
-    const viewport = { width: 1000, height: 600 }
-
-    it('should return true for nodes inside viewport', () => {
-      const { isNodeInViewport } = transformState
-
-      const nodePos: [number, number] = [100, 100]
-      const nodeSize: [number, number] = [200, 100]
-
-      expect(isNodeInViewport(nodePos, nodeSize, viewport)).toBe(true)
-    })
-
-    it('should return false for nodes completely outside viewport', () => {
-      const { isNodeInViewport } = transformState
-
-      // Node far to the right
-      expect(isNodeInViewport([2000, 100], [200, 100], viewport)).toBe(false)
-
-      // Node far to the left
-      expect(isNodeInViewport([-500, 100], [200, 100], viewport)).toBe(false)
-
-      // Node far below
-      expect(isNodeInViewport([100, 1000], [200, 100], viewport)).toBe(false)
-
-      // Node far above
-      expect(isNodeInViewport([100, -500], [200, 100], viewport)).toBe(false)
-    })
-
-    it('should return true for nodes partially in viewport with margin', () => {
-      const { isNodeInViewport } = transformState
-
-      // Node slightly outside but within margin
-      const nodePos: [number, number] = [-50, -50]
-      const nodeSize: [number, number] = [100, 100]
-
-      expect(isNodeInViewport(nodePos, nodeSize, viewport, 0.2)).toBe(true)
-    })
-
-    it('should return false for tiny nodes (size culling)', () => {
-      const { isNodeInViewport } = transformState
-
-      // Node is in viewport but too small
-      const nodePos: [number, number] = [100, 100]
-      const nodeSize: [number, number] = [3, 3] // Less than 4 pixels
-
-      expect(isNodeInViewport(nodePos, nodeSize, viewport)).toBe(false)
-    })
-
-    it('should adjust margin based on zoom level', () => {
-      const { isNodeInViewport, syncWithCanvas } = transformState
-      const mockCanvas = createMockCanvasContext()
-
-      // Test with very low zoom
-      mockCanvas.ds.scale = 0.05
-      syncWithCanvas(mockCanvas as LGraphCanvas)
-
-      // Node at edge should still be visible due to increased margin
-      expect(isNodeInViewport([1100, 100], [200, 100], viewport)).toBe(true)
-
-      // Test with high zoom
-      mockCanvas.ds.scale = 4
-      syncWithCanvas(mockCanvas as LGraphCanvas)
-
-      // Margin should be tighter
-      expect(isNodeInViewport([1100, 100], [200, 100], viewport)).toBe(false)
-    })
-  })
-
-  describe('getViewportBounds', () => {
-    beforeEach(() => {
-      const mockCanvas = createMockCanvasContext()
-      mockCanvas.ds.offset = [100, 50]
-      mockCanvas.ds.scale = 2
-      transformState.syncWithCanvas(mockCanvas as LGraphCanvas)
-    })
-
-    it('should calculate viewport bounds in canvas coordinates', () => {
-      const { getViewportBounds } = transformState
-      const viewport = { width: 1000, height: 600 }
-
-      const bounds = getViewportBounds(viewport, 0.2)
-
-      // With 20% margin:
-      // marginX = 1000 * 0.2 = 200
-      // marginY = 600 * 0.2 = 120
-      // topLeft in screen: (-200, -120)
-      // bottomRight in screen: (1200, 720)
-
-      // Convert to canvas coordinates (canvas = screen / scale - offset):
-      // topLeft: (-200 / 2 - 100, -120 / 2 - 50) = (-200, -110)
-      // bottomRight: (1200 / 2 - 100, 720 / 2 - 50) = (500, 310)
-
-      expect(bounds.x).toBe(-200)
-      expect(bounds.y).toBe(-110)
-      expect(bounds.width).toBe(700) // 500 - (-200)
-      expect(bounds.height).toBe(420) // 310 - (-110)
-    })
-
-    it('should handle zero margin', () => {
-      const { getViewportBounds } = transformState
-      const viewport = { width: 1000, height: 600 }
-
-      const bounds = getViewportBounds(viewport, 0)
-
-      // No margin, so viewport bounds are exact
-      expect(bounds.x).toBe(-100) // 0 / 2 - 100
-      expect(bounds.y).toBe(-50) // 0 / 2 - 50
-      expect(bounds.width).toBe(500) // 1000 / 2
-      expect(bounds.height).toBe(300) // 600 / 2
     })
   })
 
   describe('edge cases', () => {
-    it('should handle extreme zoom levels', () => {
-      const { syncWithCanvas, canvasToScreen } = transformState
-      const mockCanvas = createMockCanvasContext()
-
-      // Very small zoom
-      mockCanvas.ds.scale = 0.001
-      syncWithCanvas(mockCanvas as LGraphCanvas)
-
-      const point1 = canvasToScreen({ x: 1000, y: 1000 })
-      expect(point1.x).toBeCloseTo(1)
-      expect(point1.y).toBeCloseTo(1)
-
-      // Very large zoom
-      mockCanvas.ds.scale = 100
-      syncWithCanvas(mockCanvas as LGraphCanvas)
-
-      const point2 = canvasToScreen({ x: 1, y: 1 })
-      expect(point2.x).toBe(100)
-      expect(point2.y).toBe(100)
-    })
-
     it('should handle zero scale in screenToCanvas', () => {
       const { syncWithCanvas, screenToCanvas } = transformState
       const mockCanvas = createMockCanvasContext()
diff --git a/src/renderer/core/layout/transform/useTransformState.ts b/src/renderer/core/layout/transform/useTransformState.ts
index 5f0b0a086c..5d04623591 100644
--- a/src/renderer/core/layout/transform/useTransformState.ts
+++ b/src/renderer/core/layout/transform/useTransformState.ts
@@ -104,24 +104,6 @@ function useTransformStateIndividual() {
     camera.z = canvas.ds.scale || 1
   }
 
-  /**
-   * Converts canvas coordinates to screen coordinates
-   *
-   * Applies the same transform that LiteGraph uses for rendering.
-   * Essential for positioning Vue components to align with canvas elements.
-   *
-   * Formula: screen = (canvas + offset) * scale
-   *
-   * @param point - Point in canvas coordinate system
-   * @returns Point in screen coordinate system
-   */
-  function canvasToScreen(point: Point): Point {
-    return {
-      x: (point.x + camera.x) * camera.z,
-      y: (point.y + camera.y) * camera.z
-    }
-  }
-
   /**
    * Converts screen coordinates to canvas coordinates
    *
@@ -140,111 +122,11 @@ function useTransformStateIndividual() {
     }
   }
 
-  // Get node's screen bounds for culling
-  function getNodeScreenBounds(
-    pos: [number, number],
-    size: [number, number]
-  ): DOMRect {
-    const topLeft = canvasToScreen({ x: pos[0], y: pos[1] })
-    const width = size[0] * camera.z
-    const height = size[1] * camera.z
-
-    return new DOMRect(topLeft.x, topLeft.y, width, height)
-  }
-
-  // Helper: Calculate zoom-adjusted margin for viewport culling
-  function calculateAdjustedMargin(baseMargin: number): number {
-    if (camera.z < 0.1) return Math.min(baseMargin * 5, 2.0)
-    if (camera.z > 3.0) return Math.max(baseMargin * 0.5, 0.05)
-    return baseMargin
-  }
-
-  // Helper: Check if node is too small to be visible at current zoom
-  function isNodeTooSmall(nodeSize: [number, number]): boolean {
-    const nodeScreenSize = Math.max(nodeSize[0], nodeSize[1]) * camera.z
-    return nodeScreenSize < 4
-  }
-
-  // Helper: Calculate expanded viewport bounds with margin
-  function getExpandedViewportBounds(
-    viewport: { width: number; height: number },
-    margin: number
-  ) {
-    const marginX = viewport.width * margin
-    const marginY = viewport.height * margin
-    return {
-      left: -marginX,
-      right: viewport.width + marginX,
-      top: -marginY,
-      bottom: viewport.height + marginY
-    }
-  }
-
-  // Helper: Test if node intersects with viewport bounds
-  function testViewportIntersection(
-    screenPos: { x: number; y: number },
-    nodeSize: [number, number],
-    bounds: { left: number; right: number; top: number; bottom: number }
-  ): boolean {
-    const nodeRight = screenPos.x + nodeSize[0] * camera.z
-    const nodeBottom = screenPos.y + nodeSize[1] * camera.z
-
-    return !(
-      nodeRight < bounds.left ||
-      screenPos.x > bounds.right ||
-      nodeBottom < bounds.top ||
-      screenPos.y > bounds.bottom
-    )
-  }
-
-  // Check if node is within viewport with frustum and size-based culling
-  function isNodeInViewport(
-    nodePos: [number, number],
-    nodeSize: [number, number],
-    viewport: { width: number; height: number },
-    margin: number = 0.2
-  ): boolean {
-    // Early exit for tiny nodes
-    if (isNodeTooSmall(nodeSize)) return false
-
-    const screenPos = canvasToScreen({ x: nodePos[0], y: nodePos[1] })
-    const adjustedMargin = calculateAdjustedMargin(margin)
-    const bounds = getExpandedViewportBounds(viewport, adjustedMargin)
-
-    return testViewportIntersection(screenPos, nodeSize, bounds)
-  }
-
-  // Get viewport bounds in canvas coordinates (for spatial index queries)
-  function getViewportBounds(
-    viewport: { width: number; height: number },
-    margin: number = 0.2
-  ) {
-    const marginX = viewport.width * margin
-    const marginY = viewport.height * margin
-
-    const topLeft = screenToCanvas({ x: -marginX, y: -marginY })
-    const bottomRight = screenToCanvas({
-      x: viewport.width + marginX,
-      y: viewport.height + marginY
-    })
-
-    return {
-      x: topLeft.x,
-      y: topLeft.y,
-      width: bottomRight.x - topLeft.x,
-      height: bottomRight.y - topLeft.y
-    }
-  }
-
   return {
     camera: readonly(camera),
     transformStyle,
     syncWithCanvas,
-    canvasToScreen,
-    screenToCanvas,
-    getNodeScreenBounds,
-    isNodeInViewport,
-    getViewportBounds
+    screenToCanvas
   }
 }
 
diff --git a/src/renderer/core/layout/types.ts b/src/renderer/core/layout/types.ts
index 42df159cc0..83c764cb1e 100644
--- a/src/renderer/core/layout/types.ts
+++ b/src/renderer/core/layout/types.ts
@@ -6,6 +6,8 @@
  */
 import type { ComputedRef, Ref } from 'vue'
 
+import type { NodeId as WorkflowNodeId } from '@/platform/workflow/validation/schemas/workflowSchema'
+
 // Enum for layout source types
 export enum LayoutSource {
   Canvas = 'canvas',
@@ -37,7 +39,7 @@ export interface NodeBoundsUpdate {
   bounds: Bounds
 }
 
-export type NodeId = string
+export type NodeId = WorkflowNodeId
 export type LinkId = number
 export type RerouteId = number
 
diff --git a/src/renderer/core/spatial/SpatialIndex.ts b/src/renderer/core/spatial/SpatialIndex.ts
index 8541352c1c..2a8e7061fd 100644
--- a/src/renderer/core/spatial/SpatialIndex.ts
+++ b/src/renderer/core/spatial/SpatialIndex.ts
@@ -15,21 +15,21 @@ import { QuadTree } from './QuadTree'
 /**
  * Cache entry for spatial queries
  */
-interface CacheEntry {
-  result: NodeId[]
+interface CacheEntry<TId> {
+  result: TId[]
   timestamp: number
 }
 
 /**
  * Spatial index manager using QuadTree
  */
-export class SpatialIndexManager {
-  private quadTree: QuadTree<NodeId>
-  private queryCache: Map<string, CacheEntry>
+export class SpatialIndexManager<TId extends string | number = NodeId> {
+  private quadTree: QuadTree<TId>
+  private queryCache: Map<string, CacheEntry<TId>>
   private cacheSize = 0
 
   constructor(bounds?: Bounds) {
-    this.quadTree = new QuadTree<NodeId>(
+    this.quadTree = new QuadTree<TId>(
       bounds ?? QUADTREE_CONFIG.DEFAULT_BOUNDS,
       {
         maxDepth: QUADTREE_CONFIG.MAX_DEPTH,
@@ -42,16 +42,16 @@ export class SpatialIndexManager {
   /**
    * Insert a node into the spatial index
    */
-  insert(nodeId: NodeId, bounds: Bounds): void {
-    this.quadTree.insert(nodeId, bounds, nodeId)
+  insert(nodeId: TId, bounds: Bounds): void {
+    this.quadTree.insert(String(nodeId), bounds, nodeId)
     this.invalidateCache()
   }
 
   /**
    * Update a node's bounds in the spatial index
    */
-  update(nodeId: NodeId, bounds: Bounds): void {
-    this.quadTree.update(nodeId, bounds)
+  update(nodeId: TId, bounds: Bounds): void {
+    this.quadTree.update(String(nodeId), bounds)
     this.invalidateCache()
   }
 
@@ -59,9 +59,9 @@ export class SpatialIndexManager {
    * Batch update multiple nodes' bounds in the spatial index
    * More efficient than calling update() multiple times as it only invalidates cache once
    */
-  batchUpdate(updates: Array<{ nodeId: NodeId; bounds: Bounds }>): void {
+  batchUpdate(updates: Array<{ nodeId: TId; bounds: Bounds }>): void {
     for (const { nodeId, bounds } of updates) {
-      this.quadTree.update(nodeId, bounds)
+      this.quadTree.update(String(nodeId), bounds)
     }
     this.invalidateCache()
   }
@@ -69,15 +69,15 @@ export class SpatialIndexManager {
   /**
    * Remove a node from the spatial index
    */
-  remove(nodeId: NodeId): void {
-    this.quadTree.remove(nodeId)
+  remove(nodeId: TId): void {
+    this.quadTree.remove(String(nodeId))
     this.invalidateCache()
   }
 
   /**
    * Query nodes within the given bounds
    */
-  query(bounds: Bounds): NodeId[] {
+  query(bounds: Bounds): TId[] {
     const cacheKey = this.getCacheKey(bounds)
     const cached = this.queryCache.get(cacheKey)
 
@@ -137,7 +137,7 @@ export class SpatialIndexManager {
   /**
    * Add result to cache with LRU eviction
    */
-  private addToCache(key: string, result: NodeId[]): void {
+  private addToCache(key: string, result: TId[]): void {
     // Evict oldest entries if cache is full
     if (this.cacheSize >= PERFORMANCE_CONFIG.SPATIAL_CACHE_MAX_SIZE) {
       const oldestKey = this.findOldestCacheEntry()
diff --git a/src/renderer/extensions/minimap/data/LayoutStoreDataSource.ts b/src/renderer/extensions/minimap/data/LayoutStoreDataSource.ts
index 725c268132..c544c3155d 100644
--- a/src/renderer/extensions/minimap/data/LayoutStoreDataSource.ts
+++ b/src/renderer/extensions/minimap/data/LayoutStoreDataSource.ts
@@ -1,5 +1,6 @@
 import { layoutStore } from '@/renderer/core/layout/store/layoutStore'
 import { useExecutionStore } from '@/stores/executionStore'
+import { createNodeLocatorId } from '@/types/nodeIdentification'
 
 import type { MinimapNodeData } from '../types'
 import { AbstractMinimapDataSource } from './AbstractMinimapDataSource'
@@ -25,7 +26,8 @@ export class LayoutStoreDataSource extends AbstractMinimapDataSource {
       // Find corresponding LiteGraph node for additional properties
       const graphNode = this.graph?._nodes?.find((n) => String(n.id) === nodeId)
 
-      const executionState = nodeProgressStates[nodeId]?.state ?? null
+      const executionState =
+        nodeProgressStates[createNodeLocatorId(null, nodeId)]?.state ?? null
 
       nodes.push({
         id: nodeId,
diff --git a/src/renderer/extensions/vueNodes/components/ImagePreview.test.ts b/src/renderer/extensions/vueNodes/components/ImagePreview.test.ts
index 4d7865c89c..3f71da658a 100644
--- a/src/renderer/extensions/vueNodes/components/ImagePreview.test.ts
+++ b/src/renderer/extensions/vueNodes/components/ImagePreview.test.ts
@@ -15,6 +15,10 @@ vi.mock('@/base/common/downloadUtil', () => ({
   downloadFile: vi.fn()
 }))
 
+vi.mock('@/services/hdrViewerService', () => ({
+  openHdrViewer: vi.fn()
+}))
+
 const i18n = createI18n({
   legacy: false,
   locale: 'en',
@@ -36,6 +40,10 @@ const i18n = createI18n({
         loading: 'Loading',
         viewGrid: 'Grid view',
         galleryThumbnail: 'Gallery thumbnail'
+      },
+      hdrViewer: {
+        hdrImage: 'HDR image',
+        openInHdrViewer: 'Open in HDR Viewer'
       }
     }
   }
@@ -86,6 +94,15 @@ describe('ImagePreview', () => {
     expect(container.querySelector('.image-preview')).not.toBeInTheDocument()
   })
 
+  it('offers the HDR viewer instead of an <img> for exr outputs', () => {
+    renderImagePreview({
+      imageUrls: ['/api/view?filename=out.exr&type=output']
+    })
+
+    expect(screen.getByTestId('hdr-open-button')).toBeInTheDocument()
+    expect(screen.queryByTestId('main-image')).not.toBeInTheDocument()
+  })
+
   it('displays calculating dimensions text in gallery mode', async () => {
     renderImagePreview({
       imageUrls: [defaultProps.imageUrls[0]]
diff --git a/src/renderer/extensions/vueNodes/components/ImagePreview.vue b/src/renderer/extensions/vueNodes/components/ImagePreview.vue
index 3a71f47a8d..92efe69ca9 100644
--- a/src/renderer/extensions/vueNodes/components/ImagePreview.vue
+++ b/src/renderer/extensions/vueNodes/components/ImagePreview.vue
@@ -23,15 +23,23 @@
             total: imageUrls.length
           })
         "
-        @click="openImageInGallery(index)"
+        @click="handleGridClick(index)"
       >
         <img
+          v-if="!isHdrImageUrl(imageUrls[index])"
           :src="url"
           :alt="`${$t('g.galleryThumbnail')} ${index + 1}`"
           draggable="false"
           class="pointer-events-none size-full object-contain"
           @load="updateAspectRatio($event, index)"
         />
+        <div
+          v-else
+          class="flex size-full flex-col items-center justify-center gap-1 text-base-foreground"
+        >
+          <i class="icon-[lucide--sun] size-6" />
+          <span class="text-xs">{{ $t('hdrViewer.hdrImage') }}</span>
+        </div>
       </Button>
     </div>
 
@@ -61,12 +69,30 @@
         </p>
       </div>
       <!-- Loading State -->
-      <div v-if="showLoader && !imageError" class="size-full">
+      <div
+        v-if="showLoader && !imageError && !currentImageIsHdr"
+        class="size-full"
+      >
         <Skeleton class="size-full rounded-sm" />
       </div>
+      <button
+        v-if="!imageError && currentImageIsHdr"
+        type="button"
+        data-testid="hdr-open-button"
+        class="absolute inset-0 flex cursor-pointer flex-col items-center justify-center gap-3 border-0 bg-transparent text-base-foreground"
+        @click="openHdrViewer(currentImageUrl)"
+      >
+        <i class="icon-[lucide--sun] size-12" />
+        <span class="text-sm">{{ $t('hdrViewer.hdrImage') }}</span>
+        <span
+          class="rounded-md bg-base-foreground px-3 py-1.5 text-sm text-base-background"
+        >
+          {{ $t('hdrViewer.openInHdrViewer') }}
+        </span>
+      </button>
       <!-- Main Image -->
       <img
-        v-if="!imageError"
+        v-if="!imageError && !currentImageIsHdr"
         data-testid="main-image"
         :src="currentImageUrl"
         :alt="imageAltText"
@@ -82,7 +108,7 @@
       >
         <!-- Mask/Edit Button -->
         <button
-          v-if="!hasMultipleImages && !imageError"
+          v-if="!hasMultipleImages && !imageError && !currentImageIsHdr"
           :class="actionButtonClass"
           :title="$t('g.editOrMaskImage')"
           :aria-label="$t('g.editOrMaskImage')"
@@ -117,7 +143,7 @@
 
     <!-- Image Dimensions (gallery mode only) -->
     <div
-      v-if="viewMode === 'gallery'"
+      v-if="viewMode === 'gallery' && !currentImageIsHdr"
       class="pt-2 text-center text-xs text-base-foreground"
     >
       <span
@@ -178,7 +204,9 @@ import Button from '@/components/ui/button/Button.vue'
 import Skeleton from '@/components/ui/skeleton/Skeleton.vue'
 import { useMaskEditor } from '@/composables/maskeditor/useMaskEditor'
 import { useToastStore } from '@/platform/updates/common/toastStore'
+import { openHdrViewer } from '@/services/hdrViewerService'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
+import { isHdrImageUrl } from '@/utils/hdrFormatUtil'
 import { getGridThumbnailUrl } from '@/utils/imageUtil'
 import { resolveNode } from '@/utils/litegraphUtil'
 import { cn } from '@comfyorg/tailwind-utils'
@@ -228,6 +256,7 @@ const { start: startDelayedLoader, stop: stopDelayedLoader } = useTimeoutFn(
 )
 
 const currentImageUrl = computed(() => imageUrls[currentIndex.value] ?? '')
+const currentImageIsHdr = computed(() => isHdrImageUrl(currentImageUrl.value))
 const gridImageUrls = computed(() => imageUrls.map(getGridThumbnailUrl))
 const hasMultipleImages = computed(() => imageUrls.length > 1)
 const imageAltText = computed(() =>
@@ -333,6 +362,15 @@ async function openImageInGallery(index: number) {
   galleryPanelEl.value?.focus()
 }
 
+function handleGridClick(index: number) {
+  const url = imageUrls[index]
+  if (isHdrImageUrl(url)) {
+    openHdrViewer(url)
+    return
+  }
+  void openImageInGallery(index)
+}
+
 function getNavigationDotClass(index: number) {
   return cn(
     'size-2 cursor-pointer rounded-full border-0 p-0 transition-all duration-200',
diff --git a/src/renderer/extensions/vueNodes/components/LGraphNode.vue b/src/renderer/extensions/vueNodes/components/LGraphNode.vue
index 3f1b4251fb..09e30402cd 100644
--- a/src/renderer/extensions/vueNodes/components/LGraphNode.vue
+++ b/src/renderer/extensions/vueNodes/components/LGraphNode.vue
@@ -48,7 +48,7 @@
         nodeData.mode === LGraphEventMode.ALWAYS &&
         !nodeData.hasErrors
       "
-      :id="nodeData.id"
+      :id="nodeId"
     />
     <div
       v-if="isSelected || executing"
@@ -340,11 +340,13 @@ const { handleNodeCollapse, handleNodeTitleUpdate, handleNodeRightClick } =
   useNodeEventHandlers()
 const { bringNodeToFront } = useNodeZIndex()
 
-useVueElementTracking(String(nodeData.id), 'node')
+const nodeId = computed(() => String(nodeData.id))
+
+useVueElementTracking(nodeId.value, 'node')
 
 const { selectedNodeIds, isGhostPlacing } = storeToRefs(useCanvasStore())
 const isSelected = computed(() => {
-  return selectedNodeIds.value.has(nodeData.id)
+  return selectedNodeIds.value.has(nodeId.value)
 })
 
 const nodeLocatorId = computed(() => getLocatorIdFromNodeData(nodeData))
@@ -353,7 +355,7 @@ const executionErrorStore = useExecutionErrorStore()
 const missingModelStore = useMissingModelStore()
 const missingNodesErrorStore = useMissingNodesErrorStore()
 const hasExecutionError = computed(
-  () => executionErrorStore.lastExecutionErrorNodeId === nodeData.id
+  () => executionErrorStore.lastExecutionErrorNodeId === nodeId.value
 )
 
 const hasAnyError = computed((): boolean => {
diff --git a/src/renderer/extensions/vueNodes/components/LGraphNodePreview.test.ts b/src/renderer/extensions/vueNodes/components/LGraphNodePreview.test.ts
new file mode 100644
index 0000000000..93b4bb3927
--- /dev/null
+++ b/src/renderer/extensions/vueNodes/components/LGraphNodePreview.test.ts
@@ -0,0 +1,95 @@
+import { render, screen } from '@testing-library/vue'
+import { describe, expect, it, vi } from 'vitest'
+
+import type { ComfyNodeDef as ComfyNodeDefV2 } from '@/schemas/nodeDef/nodeDefSchemaV2'
+import LGraphNodePreview from '@/renderer/extensions/vueNodes/components/LGraphNodePreview.vue'
+import { fromPartial } from '@total-typescript/shoehorn'
+
+vi.mock('@/stores/widgetStore', () => ({
+  useWidgetStore: () => ({ inputIsWidget: () => true })
+}))
+
+// Serializes the nodeData prop so tests can assert on the data contract
+// LGraphNodePreview hands to NodeWidgets. How that data renders is covered
+// by NodeWidgets.test.ts and browser_tests/tests/sidebar/modelLibrary.spec.ts.
+const NodeWidgetsProbe = {
+  props: ['nodeData'],
+  template: '<div data-testid="node-data">{{ JSON.stringify(nodeData) }}</div>'
+}
+
+interface ProbedWidget {
+  name: string
+  value?: unknown
+  options?: { values?: string[] }
+}
+
+const nodeDef = fromPartial<ComfyNodeDefV2>({
+  name: 'CheckpointLoaderSimple',
+  display_name: 'Load Checkpoint',
+  inputs: {
+    ckpt_name: { type: 'COMBO', options: ['a.safetensors', 'b.safetensors'] }
+  },
+  outputs: []
+})
+
+function renderedWidgets(
+  def: ComfyNodeDefV2,
+  props: { widgetValues?: Record<string, string> } = {}
+) {
+  render(LGraphNodePreview, {
+    props: { nodeDef: def, ...props },
+    global: {
+      stubs: {
+        NodeHeader: true,
+        NodeSlots: true,
+        NodeWidgets: NodeWidgetsProbe
+      }
+    }
+  })
+  const nodeData: { widgets?: ProbedWidget[] } = JSON.parse(
+    screen.getByTestId('node-data').textContent ?? ''
+  )
+  return nodeData.widgets ?? []
+}
+
+function renderedComboWidget(
+  props: { widgetValues?: Record<string, string> } = {}
+) {
+  return renderedWidgets(nodeDef, props).find((w) => w.name === 'ckpt_name')
+}
+
+describe('LGraphNodePreview', () => {
+  it('leads the combo options with the provided widget value', () => {
+    const widget = renderedComboWidget({
+      widgetValues: { ckpt_name: 'sd_xl_base_1.0.safetensors' }
+    })
+
+    expect(widget?.options?.values).toEqual([
+      'sd_xl_base_1.0.safetensors',
+      'a.safetensors',
+      'b.safetensors'
+    ])
+  })
+
+  it('keeps the combo options untouched when no value is provided', () => {
+    const widget = renderedComboWidget()
+
+    expect(widget?.options?.values).toEqual(['a.safetensors', 'b.safetensors'])
+  })
+
+  it('uses the input default when defined and empty string otherwise', () => {
+    const widgets = renderedWidgets(
+      fromPartial<ComfyNodeDefV2>({
+        name: 'TestNode',
+        inputs: {
+          steps: { type: 'INT', default: 20 },
+          text: { type: 'STRING' }
+        },
+        outputs: []
+      })
+    )
+
+    expect(widgets.find((w) => w.name === 'steps')?.value).toBe(20)
+    expect(widgets.find((w) => w.name === 'text')?.value).toBe('')
+  })
+})
diff --git a/src/renderer/extensions/vueNodes/components/LGraphNodePreview.vue b/src/renderer/extensions/vueNodes/components/LGraphNodePreview.vue
index 220b14d875..c6fd60c44f 100644
--- a/src/renderer/extensions/vueNodes/components/LGraphNodePreview.vue
+++ b/src/renderer/extensions/vueNodes/components/LGraphNodePreview.vue
@@ -45,9 +45,14 @@ import type { ComfyNodeDef as ComfyNodeDefV2 } from '@/schemas/nodeDef/nodeDefSc
 import { useWidgetStore } from '@/stores/widgetStore'
 import { cn } from '@comfyorg/tailwind-utils'
 
-const { nodeDef, position = 'absolute' } = defineProps<{
+const {
+  nodeDef,
+  position = 'absolute',
+  widgetValues
+} = defineProps<{
   nodeDef: ComfyNodeDefV2
   position?: 'absolute' | 'relative'
+  widgetValues?: Record<string, string>
 }>()
 
 const widgetStore = useWidgetStore()
@@ -56,27 +61,32 @@ const widgetStore = useWidgetStore()
 const nodeData = computed<VueNodeData>(() => {
   const widgets = Object.entries(nodeDef.inputs || {})
     .filter(([_, input]) => widgetStore.inputIsWidget(input))
-    .map(([name, input]) => ({
-      nodeId: '-1',
-      name,
-      type: input.widgetType || input.type,
-      value:
-        input.default !== undefined
-          ? input.default
-          : input.type === 'COMBO' &&
-              Array.isArray(input.options) &&
-              input.options.length > 0
-            ? input.options[0]
-            : '',
-      options: {
-        hidden: input.hidden,
-        advanced: input.advanced,
-        values:
-          input.type === 'COMBO' && Array.isArray(input.options)
-            ? input.options
-            : undefined
-      } satisfies IWidgetOptions
-    }))
+    .map(([name, input]) => {
+      const comboValues =
+        input.type === 'COMBO' && Array.isArray(input.options)
+          ? input.options
+          : undefined
+      // Preview nodes have no widget-value store entry, so combo widgets
+      // render their first option; lead with the requested value to show it.
+      const leadValue = widgetValues?.[name]
+      return {
+        nodeId: '-1',
+        name,
+        type: input.widgetType || input.type,
+        value:
+          input.default !== undefined
+            ? input.default
+            : (comboValues?.[0] ?? ''),
+        options: {
+          hidden: input.hidden,
+          advanced: input.advanced,
+          values:
+            leadValue && comboValues
+              ? [leadValue, ...comboValues.filter((o) => o !== leadValue)]
+              : comboValues
+        } satisfies IWidgetOptions
+      }
+    })
 
   const inputs: INodeInputSlot[] = Object.entries(nodeDef.inputs || {})
     .filter(([_, input]) => !widgetStore.inputIsWidget(input))
diff --git a/src/renderer/extensions/vueNodes/components/NodeSlots.test.ts b/src/renderer/extensions/vueNodes/components/NodeSlots.test.ts
index e88f492900..c4fb9872ba 100644
--- a/src/renderer/extensions/vueNodes/components/NodeSlots.test.ts
+++ b/src/renderer/extensions/vueNodes/components/NodeSlots.test.ts
@@ -16,6 +16,7 @@ import enMessages from '@/locales/en/main.json' with { type: 'json' }
 import type { NodeId as VueNodeId } from '@/renderer/core/layout/types'
 import { app } from '@/scripts/app'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
 import { seedRequiredInputMissingNodeError } from '@/utils/__tests__/executionErrorTestUtils'
 import {
   createMockNodeInputSlot,
@@ -270,7 +271,7 @@ describe('NodeSlots.vue', () => {
     const { container } = renderSlots(nodeData)
     seedRequiredInputMissingNodeError(
       useExecutionErrorStore(),
-      nodeData.id,
+      createNodeExecutionId([nodeData.id]),
       'model'
     )
     await nextTick()
@@ -300,7 +301,7 @@ describe('NodeSlots.vue', () => {
     const { container } = renderSlots(nodeData)
     seedRequiredInputMissingNodeError(
       useExecutionErrorStore(),
-      '65:70',
+      createNodeExecutionId([65, 70]),
       'model'
     )
     await nextTick()
@@ -337,7 +338,7 @@ describe('NodeSlots.vue', () => {
     const { container } = renderSlots(nodeData)
     seedRequiredInputMissingNodeError(
       useExecutionErrorStore(),
-      '65:70:63',
+      createNodeExecutionId([65, 70, 63]),
       'mask'
     )
     await nextTick()
diff --git a/src/renderer/extensions/vueNodes/components/NodeWidgets.test.ts b/src/renderer/extensions/vueNodes/components/NodeWidgets.test.ts
index b2767fe2d1..fb46663d42 100644
--- a/src/renderer/extensions/vueNodes/components/NodeWidgets.test.ts
+++ b/src/renderer/extensions/vueNodes/components/NodeWidgets.test.ts
@@ -12,6 +12,8 @@ import type {
 } from '@/composables/graph/useGraphNodeManager'
 import NodeWidgets from '@/renderer/extensions/vueNodes/components/NodeWidgets.vue'
 import { useWidgetValueStore } from '@/stores/widgetValueStore'
+import type { NodeId } from '@/platform/workflow/validation/schemas/workflowSchema'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
 import { widgetId } from '@/types/widgetId'
 
 const GRAPH_ID = 'graph-test'
@@ -64,7 +66,7 @@ describe('NodeWidgets', () => {
   const createMockNodeData = (
     nodeType: string = 'TestNode',
     widgets: SafeWidgetData[] = [],
-    id: string = '1'
+    id: NodeId = 1
   ): VueNodeData => ({
     id,
     type: nodeType,
@@ -231,13 +233,13 @@ describe('NodeWidgets', () => {
       nodeId: undefined,
       name: 'string_a',
       type: 'text',
-      sourceExecutionId: '65:18'
+      sourceExecutionId: createNodeExecutionId([65, 18])
     })
     const secondTransientEntry = createMockWidget({
       nodeId: undefined,
       name: 'string_a',
       type: 'text',
-      sourceExecutionId: '65:19'
+      sourceExecutionId: createNodeExecutionId([65, 19])
     })
     const nodeData = createMockNodeData('SubgraphNode', [
       firstTransientEntry,
diff --git a/src/renderer/extensions/vueNodes/composables/useNodeEventHandlers.ts b/src/renderer/extensions/vueNodes/composables/useNodeEventHandlers.ts
index df80284cfb..455a8b5e57 100644
--- a/src/renderer/extensions/vueNodes/composables/useNodeEventHandlers.ts
+++ b/src/renderer/extensions/vueNodes/composables/useNodeEventHandlers.ts
@@ -23,6 +23,10 @@ function useNodeEventHandlersIndividual() {
   const { bringNodeToFront } = useNodeZIndex()
   const { shouldHandleNodePointerEvents } = useCanvasInteractions()
 
+  function getNode(nodeId: NodeId) {
+    return nodeManager.value?.getNode(String(nodeId))
+  }
+
   /**
    * Handle node selection events
    * Supports single selection and multi-select with Ctrl/Cmd
@@ -30,9 +34,9 @@ function useNodeEventHandlersIndividual() {
   function handleNodeSelect(event: PointerEvent, nodeId: NodeId) {
     if (!shouldHandleNodePointerEvents.value) return
 
-    if (!canvasStore.canvas || !nodeManager.value) return
+    if (!canvasStore.canvas) return
 
-    const node = nodeManager.value.getNode(nodeId)
+    const node = getNode(nodeId)
     if (!node) return
 
     const multiSelect = isMultiSelectKey(event)
@@ -67,9 +71,7 @@ function useNodeEventHandlersIndividual() {
   function handleNodeCollapse(nodeId: NodeId, collapsed: boolean) {
     if (!shouldHandleNodePointerEvents.value) return
 
-    if (!nodeManager.value) return
-
-    const node = nodeManager.value.getNode(nodeId)
+    const node = getNode(nodeId)
     if (!node) return
 
     // Use LiteGraph's collapse method if the state needs to change
@@ -86,9 +88,7 @@ function useNodeEventHandlersIndividual() {
   function handleNodeTitleUpdate(nodeId: NodeId, newTitle: string) {
     if (!shouldHandleNodePointerEvents.value) return
 
-    if (!nodeManager.value) return
-
-    const node = nodeManager.value.getNode(nodeId)
+    const node = getNode(nodeId)
     if (!node) return
 
     // Update the node title in LiteGraph for persistence
@@ -107,9 +107,9 @@ function useNodeEventHandlersIndividual() {
   function handleNodeRightClick(event: PointerEvent, nodeId: NodeId) {
     if (!shouldHandleNodePointerEvents.value) return
 
-    if (!canvasStore.canvas || !nodeManager.value) return
+    if (!canvasStore.canvas) return
 
-    const node = nodeManager.value.getNode(nodeId)
+    const node = getNode(nodeId)
     if (!node) return
 
     // Prevent default context menu
@@ -130,9 +130,9 @@ function useNodeEventHandlersIndividual() {
   ) {
     if (!shouldHandleNodePointerEvents.value) return
 
-    if (!canvasStore.canvas || !nodeManager.value) return
+    if (!canvasStore.canvas) return
 
-    const node = nodeManager.value.getNode(nodeId)
+    const node = getNode(nodeId)
     if (!node) return
 
     if (!multiSelect) {
diff --git a/src/renderer/extensions/vueNodes/composables/useNodePointerInteractions.ts b/src/renderer/extensions/vueNodes/composables/useNodePointerInteractions.ts
index 14081b41df..465fa247a4 100644
--- a/src/renderer/extensions/vueNodes/composables/useNodePointerInteractions.ts
+++ b/src/renderer/extensions/vueNodes/composables/useNodePointerInteractions.ts
@@ -10,12 +10,13 @@ import { useClickDragGuard } from '@/composables/useClickDragGuard'
 import { useVueNodeLifecycle } from '@/composables/graph/useVueNodeLifecycle'
 import { useCanvasInteractions } from '@/renderer/core/canvas/useCanvasInteractions'
 import { layoutStore } from '@/renderer/core/layout/store/layoutStore'
+import type { NodeId } from '@/renderer/core/layout/types'
 import { useNodeEventHandlers } from '@/renderer/extensions/vueNodes/composables/useNodeEventHandlers'
 import { isMultiSelectKey } from '@/renderer/extensions/vueNodes/utils/selectionUtils'
 import { useNodeDrag } from '@/renderer/extensions/vueNodes/layout/useNodeDrag'
 
 export function useNodePointerInteractions(
-  nodeIdRef: MaybeRefOrGetter<string>
+  nodeIdRef: MaybeRefOrGetter<NodeId>
 ) {
   const { startDrag, endDrag, handleDrag } = useNodeDrag()
   // Use canvas interactions for proper wheel event handling and pointer event capture control
@@ -25,6 +26,10 @@ export function useNodePointerInteractions(
     useNodeEventHandlers()
   const { nodeManager } = useVueNodeLifecycle()
 
+  function isPinnedNode(nodeId: NodeId): boolean {
+    return nodeManager.value?.getNode(String(nodeId))?.flags?.pinned ?? false
+  }
+
   const forwardMiddlePointerIfNeeded = (
     event: PointerEvent,
     isMiddleInput: (event: PointerEvent) => boolean
@@ -59,7 +64,7 @@ export function useNodePointerInteractions(
     }
 
     // IMPORTANT: Read from actual LGraphNode to get correct state
-    if (nodeManager.value?.getNode(nodeId)?.flags?.pinned) {
+    if (isPinnedNode(nodeId)) {
       return
     }
 
@@ -76,7 +81,7 @@ export function useNodePointerInteractions(
 
     const nodeId = toValue(nodeIdRef)
 
-    if (nodeManager.value?.getNode(nodeId)?.flags?.pinned) {
+    if (isPinnedNode(nodeId)) {
       return
     }
 
@@ -111,7 +116,7 @@ export function useNodePointerInteractions(
     layoutStore.isDraggingVueNodes.value = false
   }
 
-  function safeDragStart(event: PointerEvent, nodeId: string) {
+  function safeDragStart(event: PointerEvent, nodeId: NodeId) {
     try {
       startDrag(event, nodeId)
     } finally {
diff --git a/src/renderer/extensions/vueNodes/composables/useProcessedWidgets.test.ts b/src/renderer/extensions/vueNodes/composables/useProcessedWidgets.test.ts
index ef5fffe774..698710b3af 100644
--- a/src/renderer/extensions/vueNodes/composables/useProcessedWidgets.test.ts
+++ b/src/renderer/extensions/vueNodes/composables/useProcessedWidgets.test.ts
@@ -13,6 +13,10 @@ import {
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
 import { useMissingModelStore } from '@/platform/missingModel/missingModelStore'
 import { useWidgetValueStore } from '@/stores/widgetValueStore'
+import {
+  createNodeExecutionId,
+  createNodeLocatorId
+} from '@/types/nodeIdentification'
 import { widgetId } from '@/types/widgetId'
 
 const GRAPH_ID = 'graph-test'
@@ -83,7 +87,7 @@ describe('getWidgetIdentity', () => {
   it('uses sourceExecutionId for identity when no nodeId', () => {
     const widget = createMockWidget({
       nodeId: undefined,
-      sourceExecutionId: '65:18'
+      sourceExecutionId: createNodeExecutionId([65, 18])
     })
     const { dedupeIdentity } = getWidgetIdentity(widget, '1', 0)
     expect(dedupeIdentity).toBe('exec:65:18:test_widget:combo')
@@ -131,7 +135,7 @@ describe('hasWidgetError', () => {
     expect(
       hasWidgetError(
         widget,
-        '1',
+        createNodeExecutionId([1]),
         undefined,
         executionErrorStore,
         missingModelStore
@@ -147,7 +151,7 @@ describe('hasWidgetError', () => {
     expect(
       hasWidgetError(
         widget,
-        '1',
+        createNodeExecutionId([1]),
         nodeErrors,
         executionErrorStore,
         missingModelStore
@@ -158,7 +162,7 @@ describe('hasWidgetError', () => {
   it('returns true via sourceExecutionId when execution store has matching error', () => {
     const widget = createMockWidget({
       name: 'seed',
-      sourceExecutionId: '65:18'
+      sourceExecutionId: createNodeExecutionId([65, 18])
     })
     executionErrorStore.lastNodeErrors = {
       '65:18': {
@@ -177,7 +181,7 @@ describe('hasWidgetError', () => {
     expect(
       hasWidgetError(
         widget,
-        '1',
+        createNodeExecutionId([1]),
         undefined,
         executionErrorStore,
         missingModelStore
@@ -191,7 +195,7 @@ describe('hasWidgetError', () => {
     expect(
       hasWidgetError(
         widget,
-        '1',
+        createNodeExecutionId([1]),
         undefined,
         executionErrorStore,
         missingModelStore
@@ -210,7 +214,7 @@ describe('hasWidgetError', () => {
     expect(
       hasWidgetError(
         widget,
-        '1',
+        createNodeExecutionId([1]),
         nodeErrors,
         executionErrorStore,
         missingModelStore
@@ -221,7 +225,7 @@ describe('hasWidgetError', () => {
   it('matches missing models by the interior source widget name', () => {
     const widget = createMockWidget({
       name: 'display_slot',
-      sourceExecutionId: '65:18',
+      sourceExecutionId: createNodeExecutionId([65, 18]),
       sourceWidgetName: 'ckpt_name'
     })
     const spy = vi
@@ -230,7 +234,7 @@ describe('hasWidgetError', () => {
     expect(
       hasWidgetError(
         widget,
-        '1',
+        createNodeExecutionId([1]),
         undefined,
         executionErrorStore,
         missingModelStore
@@ -399,6 +403,37 @@ describe('computeProcessedWidgets borderStyle', () => {
     })
   })
 
+  it('uses widget nodeId for simplified widget locator when present', () => {
+    const widget = createMockWidget({
+      name: 'text',
+      type: 'combo',
+      nodeId: 'inner-node'
+    })
+
+    const result = computeProcessedWidgets({
+      nodeData: {
+        id: 'host-node',
+        type: 'SubgraphNode',
+        widgets: [widget],
+        title: 'Test',
+        mode: 0,
+        selected: false,
+        executing: false,
+        inputs: [],
+        outputs: [],
+        subgraphId: 'subgraph-node'
+      },
+      graphId: GRAPH_ID,
+      showAdvanced: false,
+      isGraphReady: false,
+      rootGraph: null,
+      ui: noopUi
+    })
+
+    expect(result[0].simplified.nodeLocatorId).toBe(
+      createNodeLocatorId('subgraph-node', 'inner-node')
+    )
+  })
   it('deduplication keeps visible widget over hidden duplicate', () => {
     const sharedWidgetId = widgetId(GRAPH_ID, '1', 'text')
     const hiddenWidget = createMockWidget({
@@ -480,7 +515,7 @@ describe('computeProcessedWidgets borderStyle', () => {
 
 describe('createWidgetUpdateHandler (via computeProcessedWidgets)', () => {
   const GRAPH_ID = 'graph-test'
-  const NODE_ID = '1'
+  const NODE_ID = 1
 
   beforeEach(() => {
     setActivePinia(createTestingPinia({ stubActions: false }))
@@ -591,7 +626,7 @@ describe('createWidgetUpdateHandler (via computeProcessedWidgets)', () => {
     expect(
       hasWidgetError(
         widget,
-        NODE_ID,
+        createNodeExecutionId([NODE_ID]),
         executionErrorStore.lastNodeErrors[NODE_ID],
         executionErrorStore,
         missingModelStore
@@ -603,7 +638,7 @@ describe('createWidgetUpdateHandler (via computeProcessedWidgets)', () => {
     expect(
       hasWidgetError(
         widget,
-        NODE_ID,
+        createNodeExecutionId([NODE_ID]),
         executionErrorStore.lastNodeErrors?.[NODE_ID],
         executionErrorStore,
         missingModelStore
diff --git a/src/renderer/extensions/vueNodes/composables/useProcessedWidgets.ts b/src/renderer/extensions/vueNodes/composables/useProcessedWidgets.ts
index a3b261a0c0..8cf9ea8704 100644
--- a/src/renderer/extensions/vueNodes/composables/useProcessedWidgets.ts
+++ b/src/renderer/extensions/vueNodes/composables/useProcessedWidgets.ts
@@ -30,6 +30,8 @@ import {
 } from '@/stores/widgetValueStore'
 import { useMissingModelStore } from '@/platform/missingModel/missingModelStore'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
+import type { NodeExecutionId } from '@/types/nodeIdentification'
 import type { WidgetId } from '@/types/widgetId'
 import { widgetId } from '@/types/widgetId'
 import type { WidgetState } from '@/types/widgetState'
@@ -81,7 +83,7 @@ interface ComputeProcessedWidgetsOptions {
 function createWidgetUpdateHandler(
   widgetState: WidgetState | undefined,
   widget: SafeWidgetData,
-  nodeExecId: string,
+  nodeExecId: NodeExecutionId,
   widgetOptions: IWidgetOptions | Record<string, never>,
   executionErrorStore: ReturnType<typeof useExecutionErrorStore>
 ): (newValue: WidgetValue) => void {
@@ -101,7 +103,7 @@ function createWidgetUpdateHandler(
 
 export function hasWidgetError(
   widget: SafeWidgetData,
-  nodeExecId: string,
+  nodeExecId: NodeExecutionId,
   nodeErrors:
     | { errors: { extra_info?: { input_name?: string } }[] }
     | undefined,
@@ -178,7 +180,7 @@ export function computeProcessedWidgets({
   const nodeExecId =
     isGraphReady && rootGraph
       ? getExecutionIdFromNodeData(rootGraph, nodeData)
-      : String(nodeData.id ?? '')
+      : createNodeExecutionId([nodeData.id])
 
   const nodeErrors = executionErrorStore.lastNodeErrors?.[nodeExecId]
 
@@ -288,11 +290,12 @@ export function computeProcessedWidgets({
           }
         : undefined
 
-    const nodeLocatorId = widget.nodeId
-      ? widget.nodeId
-      : nodeData
-        ? getLocatorIdFromNodeData(nodeData)
-        : undefined
+    const nodeLocatorId = nodeData
+      ? getLocatorIdFromNodeData({
+          ...nodeData,
+          id: widget.nodeId ?? nodeData.id
+        })
+      : undefined
 
     const simplified: SimplifiedWidget = {
       name: widgetState?.name ?? widget.name,
@@ -320,7 +323,7 @@ export function computeProcessedWidgets({
     const handleContextMenu = (e: PointerEvent) => {
       e.preventDefault()
       e.stopPropagation()
-      if (nodeId !== undefined) ui.handleNodeRightClick(e, nodeId)
+      if (nodeId !== undefined) ui.handleNodeRightClick(e, String(nodeId))
       showNodeOptions(
         e,
         widget.name,
diff --git a/src/renderer/extensions/vueNodes/composables/useSlotLinkInteraction.ts b/src/renderer/extensions/vueNodes/composables/useSlotLinkInteraction.ts
index f941a870f6..2c58b78409 100644
--- a/src/renderer/extensions/vueNodes/composables/useSlotLinkInteraction.ts
+++ b/src/renderer/extensions/vueNodes/composables/useSlotLinkInteraction.ts
@@ -141,7 +141,7 @@ export function useSlotLinkInteraction({
     const nodeId = link.node.id
     if (nodeId != null) {
       const isInputFrom = link.toType === 'output'
-      const key = getSlotKey(String(nodeId), link.fromSlotIndex, isInputFrom)
+      const key = getSlotKey(nodeId, link.fromSlotIndex, isInputFrom)
       const layout = layoutStore.getSlotLayout(key)
       if (layout) return layout.position
     }
@@ -218,7 +218,7 @@ export function useSlotLinkInteraction({
   ): { position: Point; direction: LinkDirection } | null => {
     if (!link) return null
 
-    const slotKey = getSlotKey(String(link.origin_id), link.origin_slot, false)
+    const slotKey = getSlotKey(link.origin_id, link.origin_slot, false)
     const layout = layoutStore.getSlotLayout(slotKey)
     if (!layout) return null
 
diff --git a/src/renderer/extensions/vueNodes/composables/useVueNodeResizeTracking.test.ts b/src/renderer/extensions/vueNodes/composables/useVueNodeResizeTracking.test.ts
index e0a7e6d50e..231b581bf6 100644
--- a/src/renderer/extensions/vueNodes/composables/useVueNodeResizeTracking.test.ts
+++ b/src/renderer/extensions/vueNodes/composables/useVueNodeResizeTracking.test.ts
@@ -98,7 +98,7 @@ function createResizeEntry(options?: {
   } = options ?? {}
 
   const element = document.createElement('div')
-  element.dataset.nodeId = nodeId
+  element.dataset.nodeId = String(nodeId)
   if (collapsed) {
     element.dataset.collapsed = ''
   }
diff --git a/src/renderer/extensions/vueNodes/composables/useVueNodeResizeTracking.ts b/src/renderer/extensions/vueNodes/composables/useVueNodeResizeTracking.ts
index 1534e76c6e..8d921bd23a 100644
--- a/src/renderer/extensions/vueNodes/composables/useVueNodeResizeTracking.ts
+++ b/src/renderer/extensions/vueNodes/composables/useVueNodeResizeTracking.ts
@@ -131,7 +131,7 @@ const resizeObserver = new ResizeObserver((entries) => {
     // slot-layout pipeline and skip bounds processing entirely.
     const widgetsGridParentNodeId = element.dataset.widgetsGridNodeId
     if (widgetsGridParentNodeId) {
-      scheduleSlotLayoutSync(widgetsGridParentNodeId as NodeId)
+      scheduleSlotLayoutSync(widgetsGridParentNodeId)
       continue
     }
 
@@ -259,7 +259,7 @@ const resizeObserver = new ResizeObserver((entries) => {
   // After node bounds are updated, refresh slot cached offsets and layouts
   if (nodesNeedingSlotResync.size > 0) {
     for (const nodeId of nodesNeedingSlotResync) {
-      syncNodeSlotLayoutsFromDOM(nodeId)
+      syncNodeSlotLayoutsFromDOM(String(nodeId))
     }
   }
 })
diff --git a/src/renderer/extensions/vueNodes/execution/useNodeExecutionState.ts b/src/renderer/extensions/vueNodes/execution/useNodeExecutionState.ts
index 136f268121..2513c0d6d1 100644
--- a/src/renderer/extensions/vueNodes/execution/useNodeExecutionState.ts
+++ b/src/renderer/extensions/vueNodes/execution/useNodeExecutionState.ts
@@ -3,6 +3,7 @@ import { computed, toValue } from 'vue'
 import type { MaybeRefOrGetter } from 'vue'
 
 import { useExecutionStore } from '@/stores/executionStore'
+import type { NodeLocatorId } from '@/types/nodeIdentification'
 
 /**
  * Composable for managing execution state of Vue-based nodes
@@ -14,7 +15,7 @@ import { useExecutionStore } from '@/stores/executionStore'
  * @returns Object containing reactive execution state and progress
  */
 export const useNodeExecutionState = (
-  nodeLocatorIdMaybe: MaybeRefOrGetter<string | undefined>
+  nodeLocatorIdMaybe: MaybeRefOrGetter<NodeLocatorId | undefined>
 ) => {
   const locatorId = computed(() => toValue(nodeLocatorIdMaybe) ?? '')
   const { nodeLocationProgressStates, isIdle } =
diff --git a/src/renderer/extensions/vueNodes/layout/useNodeDrag.test.ts b/src/renderer/extensions/vueNodes/layout/useNodeDrag.test.ts
index 5cab691a22..9c455270ae 100644
--- a/src/renderer/extensions/vueNodes/layout/useNodeDrag.test.ts
+++ b/src/renderer/extensions/vueNodes/layout/useNodeDrag.test.ts
@@ -113,7 +113,8 @@ vi.mock('@/utils/litegraphUtil', () => ({
 }))
 
 vi.mock('@vueuse/core', () => ({
-  createSharedComposable: (fn: () => unknown) => fn
+  createSharedComposable: (fn: () => unknown) => fn,
+  whenever: vi.fn()
 }))
 
 import { useNodeDrag } from '@/renderer/extensions/vueNodes/layout/useNodeDrag'
diff --git a/src/renderer/extensions/vueNodes/layout/useNodeDrag.ts b/src/renderer/extensions/vueNodes/layout/useNodeDrag.ts
index 67610ae1ec..4f1ab3a10a 100644
--- a/src/renderer/extensions/vueNodes/layout/useNodeDrag.ts
+++ b/src/renderer/extensions/vueNodes/layout/useNodeDrag.ts
@@ -1,3 +1,4 @@
+import { createSharedComposable, whenever } from '@vueuse/core'
 import { storeToRefs } from 'pinia'
 import { toValue } from 'vue'
 
@@ -16,7 +17,6 @@ import { useNodeSnap } from '@/renderer/extensions/vueNodes/composables/useNodeS
 import { useShiftKeySync } from '@/renderer/extensions/vueNodes/composables/useShiftKeySync'
 import { useTransformState } from '@/renderer/core/layout/transform/useTransformState'
 import { isLGraphGroup } from '@/utils/litegraphUtil'
-import { createSharedComposable } from '@vueuse/core'
 
 export const useNodeDrag = createSharedComposable(useNodeDragIndividual)
 
@@ -65,17 +65,18 @@ function useNodeDragIndividual() {
     lastPointerY = event.clientY
 
     const selectedNodes = toValue(selectedNodeIds)
+    const nodeIdKey = String(nodeId)
 
     // capture the starting positions of all other selected nodes
     // Only move other selected items if the dragged node is part of the selection
-    const isDraggedNodeInSelection = selectedNodes?.has(nodeId)
+    const isDraggedNodeInSelection = selectedNodes?.has(nodeIdKey)
 
     if (isDraggedNodeInSelection && selectedNodes.size > 1) {
       otherSelectedNodesStartPositions = new Map()
 
       for (const id of selectedNodes) {
         // Skip the current node being dragged
-        if (id === nodeId) continue
+        if (id === nodeIdKey) continue
 
         const nodeLayout = layoutStore.getNodeLayoutRef(id).value
         if (nodeLayout) {
@@ -281,27 +282,29 @@ function useNodeDragIndividual() {
       }
     }
 
+    resetDragState()
+  }
+
+  function resetDragState() {
     dragStartPos = null
     dragStartMouse = null
     otherSelectedNodesStartPositions = null
     selectedGroups = null
     lastCanvasDelta = null
 
-    // Stop auto-pan
     autoPan?.stop()
     autoPan = null
 
-    // Stop tracking shift key state
     stopShiftSync?.()
     stopShiftSync = null
 
-    // Cancel any pending animation frame
     if (rafId !== null) {
       cancelAnimationFrame(rafId)
       rafId = null
     }
   }
 
+  whenever(() => !layoutStore.isDraggingVueNodes.value, resetDragState)
   return {
     startDrag,
     handleDrag,
diff --git a/src/renderer/extensions/vueNodes/layout/useNodeLayout.ts b/src/renderer/extensions/vueNodes/layout/useNodeLayout.ts
index 3e1341cd85..51b92086f0 100644
--- a/src/renderer/extensions/vueNodes/layout/useNodeLayout.ts
+++ b/src/renderer/extensions/vueNodes/layout/useNodeLayout.ts
@@ -4,13 +4,13 @@ import type { MaybeRefOrGetter } from 'vue'
 import { useLayoutMutations } from '@/renderer/core/layout/operations/layoutMutations'
 import { layoutStore } from '@/renderer/core/layout/store/layoutStore'
 import { LayoutSource } from '@/renderer/core/layout/types'
-import type { Point } from '@/renderer/core/layout/types'
+import type { NodeId, Point } from '@/renderer/core/layout/types'
 
 /**
  * Composable for individual Vue node components
  * Uses customRef for shared write access with Canvas renderer
  */
-export function useNodeLayout(nodeIdMaybe: MaybeRefOrGetter<string>) {
+export function useNodeLayout(nodeIdMaybe: MaybeRefOrGetter<NodeId>) {
   const nodeId = toValue(nodeIdMaybe)
   const mutations = useLayoutMutations()
 
diff --git a/src/renderer/extensions/vueNodes/preview/useNodePreviewState.ts b/src/renderer/extensions/vueNodes/preview/useNodePreviewState.ts
index 88dba2aaac..daa8eb8ff5 100644
--- a/src/renderer/extensions/vueNodes/preview/useNodePreviewState.ts
+++ b/src/renderer/extensions/vueNodes/preview/useNodePreviewState.ts
@@ -3,10 +3,11 @@ import { computed, toValue } from 'vue'
 import type { MaybeRefOrGetter, Ref } from 'vue'
 
 import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
+import type { NodeId } from '@/renderer/core/layout/types'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
 
 export const useNodePreviewState = (
-  nodeIdMaybe: MaybeRefOrGetter<string>,
+  nodeIdMaybe: MaybeRefOrGetter<NodeId>,
   options?: {
     isCollapsed?: Ref<boolean>
   }
diff --git a/src/renderer/extensions/vueNodes/widgets/composables/useBoundingBoxesWidget.test.ts b/src/renderer/extensions/vueNodes/widgets/composables/useBoundingBoxesWidget.test.ts
new file mode 100644
index 0000000000..bc17c995fc
--- /dev/null
+++ b/src/renderer/extensions/vueNodes/widgets/composables/useBoundingBoxesWidget.test.ts
@@ -0,0 +1,79 @@
+import { describe, expect, it, vi } from 'vitest'
+
+import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type { InputSpec } from '@/schemas/nodeDef/nodeDefSchemaV2'
+
+import { useBoundingBoxesWidget } from './useBoundingBoxesWidget'
+
+const widgetOptions = { serialize: true, canvasOnly: false }
+
+function mockNode() {
+  return { addWidget: vi.fn(() => ({})) } as unknown as LGraphNode & {
+    addWidget: ReturnType<typeof vi.fn>
+  }
+}
+
+describe('useBoundingBoxesWidget', () => {
+  it('adds a boundingboxes widget seeded with the spec default', () => {
+    const node = mockNode()
+    const boxes = [
+      {
+        x: 0,
+        y: 0,
+        width: 1,
+        height: 1,
+        metadata: { type: 'obj', text: '', desc: '', palette: [] }
+      }
+    ]
+    useBoundingBoxesWidget()(node, {
+      type: 'BOUNDING_BOXES',
+      name: 'editor_state',
+      default: boxes
+    } as InputSpec)
+    expect(node.addWidget).toHaveBeenCalledWith(
+      'boundingboxes',
+      'editor_state',
+      boxes,
+      null,
+      widgetOptions
+    )
+  })
+
+  it('defaults to an empty box list', () => {
+    const node = mockNode()
+    useBoundingBoxesWidget()(node, {
+      type: 'BOUNDING_BOXES',
+      name: 'editor_state'
+    } as InputSpec)
+    expect(node.addWidget).toHaveBeenCalledWith(
+      'boundingboxes',
+      'editor_state',
+      [],
+      null,
+      widgetOptions
+    )
+  })
+
+  it('deep-clones the spec default so edits never leak into shared state', () => {
+    const node = mockNode()
+    const shared = [
+      {
+        x: 0,
+        y: 0,
+        width: 1,
+        height: 1,
+        metadata: { type: 'obj', text: '', desc: '', palette: ['#fff'] }
+      }
+    ]
+    useBoundingBoxesWidget()(node, {
+      type: 'BOUNDING_BOXES',
+      name: 'editor_state',
+      default: shared
+    } as InputSpec)
+    const passed = node.addWidget.mock.calls[0][2] as typeof shared
+    expect(passed).not.toBe(shared)
+    expect(passed[0]).not.toBe(shared[0])
+    expect(passed[0].metadata.palette).not.toBe(shared[0].metadata.palette)
+    expect(passed).toEqual(shared)
+  })
+})
diff --git a/src/renderer/extensions/vueNodes/widgets/composables/useBoundingBoxesWidget.ts b/src/renderer/extensions/vueNodes/widgets/composables/useBoundingBoxesWidget.ts
new file mode 100644
index 0000000000..1df02b30d7
--- /dev/null
+++ b/src/renderer/extensions/vueNodes/widgets/composables/useBoundingBoxesWidget.ts
@@ -0,0 +1,23 @@
+import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
+import type {
+  BoundingBoxesInputSpec,
+  InputSpec as InputSpecV2
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+import type { BoundingBox } from '@/types/boundingBoxes'
+
+export const useBoundingBoxesWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): IBaseWidget => {
+    const spec = inputSpec as BoundingBoxesInputSpec
+    const defaultValue: BoundingBox[] =
+      spec.default?.map((box) => ({
+        ...box,
+        metadata: { ...box.metadata, palette: [...box.metadata.palette] }
+      })) ?? []
+    return node.addWidget('boundingboxes', spec.name, defaultValue, null, {
+      serialize: true,
+      canvasOnly: false
+    }) as IBaseWidget
+  }
+}
diff --git a/src/renderer/extensions/vueNodes/widgets/composables/useColorsWidget.test.ts b/src/renderer/extensions/vueNodes/widgets/composables/useColorsWidget.test.ts
new file mode 100644
index 0000000000..72bb0978f5
--- /dev/null
+++ b/src/renderer/extensions/vueNodes/widgets/composables/useColorsWidget.test.ts
@@ -0,0 +1,55 @@
+import { describe, expect, it, vi } from 'vitest'
+
+import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type { InputSpec } from '@/schemas/nodeDef/nodeDefSchemaV2'
+
+import { useColorsWidget } from './useColorsWidget'
+
+const widgetOptions = { serialize: true, canvasOnly: false }
+
+function mockNode() {
+  return { addWidget: vi.fn(() => ({})) } as unknown as LGraphNode & {
+    addWidget: ReturnType<typeof vi.fn>
+  }
+}
+
+describe('useColorsWidget', () => {
+  it('adds a colors widget seeded with the spec default', () => {
+    const node = mockNode()
+    useColorsWidget()(node, {
+      type: 'COLORS',
+      name: 'palette',
+      default: ['#fff']
+    } as InputSpec)
+    expect(node.addWidget).toHaveBeenCalledWith(
+      'colors',
+      'palette',
+      ['#fff'],
+      null,
+      widgetOptions
+    )
+  })
+
+  it('defaults to an empty palette', () => {
+    const node = mockNode()
+    useColorsWidget()(node, { type: 'COLORS', name: 'palette' } as InputSpec)
+    expect(node.addWidget).toHaveBeenCalledWith(
+      'colors',
+      'palette',
+      [],
+      null,
+      widgetOptions
+    )
+  })
+
+  it('copies the spec default so widgets never share its reference', () => {
+    const node = mockNode()
+    const shared = ['#fff']
+    useColorsWidget()(node, {
+      type: 'COLORS',
+      name: 'palette',
+      default: shared
+    } as InputSpec)
+    expect(node.addWidget.mock.calls[0][2]).not.toBe(shared)
+  })
+})
diff --git a/src/renderer/extensions/vueNodes/widgets/composables/useColorsWidget.ts b/src/renderer/extensions/vueNodes/widgets/composables/useColorsWidget.ts
new file mode 100644
index 0000000000..a98c0b7b6c
--- /dev/null
+++ b/src/renderer/extensions/vueNodes/widgets/composables/useColorsWidget.ts
@@ -0,0 +1,18 @@
+import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
+import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
+import type {
+  ColorsInputSpec,
+  InputSpec as InputSpecV2
+} from '@/schemas/nodeDef/nodeDefSchemaV2'
+import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
+
+export const useColorsWidget = (): ComfyWidgetConstructorV2 => {
+  return (node: LGraphNode, inputSpec: InputSpecV2): IBaseWidget => {
+    const spec = inputSpec as ColorsInputSpec
+    const defaultValue: string[] = spec.default ? [...spec.default] : []
+    return node.addWidget('colors', spec.name, defaultValue, null, {
+      serialize: true,
+      canvasOnly: false
+    }) as IBaseWidget
+  }
+}
diff --git a/src/renderer/extensions/vueNodes/widgets/composables/useComboWidget.ts b/src/renderer/extensions/vueNodes/widgets/composables/useComboWidget.ts
index 646cfbf594..5941793221 100644
--- a/src/renderer/extensions/vueNodes/widgets/composables/useComboWidget.ts
+++ b/src/renderer/extensions/vueNodes/widgets/composables/useComboWidget.ts
@@ -171,10 +171,7 @@ function createAssetBrowserWidget(
     widgetName: inputSpec.name,
     nodeTypeForBrowser: node.comfyClass ?? '',
     inputNameForBrowser: inputSpec.name,
-    defaultValue,
-    onValueChange: (widget, newValue, oldValue) => {
-      node.onWidgetChanged?.(widget.name, newValue, oldValue, widget)
-    }
+    defaultValue
   })
 }
 
diff --git a/src/renderer/extensions/vueNodes/widgets/registry/widgetRegistry.ts b/src/renderer/extensions/vueNodes/widgets/registry/widgetRegistry.ts
index b44a7ae476..a4abd0d6f0 100644
--- a/src/renderer/extensions/vueNodes/widgets/registry/widgetRegistry.ts
+++ b/src/renderer/extensions/vueNodes/widgets/registry/widgetRegistry.ts
@@ -69,6 +69,12 @@ const WidgetPainter = defineAsyncComponent(
 const WidgetRange = defineAsyncComponent(
   () => import('@/components/range/WidgetRange.vue')
 )
+const WidgetBoundingBoxes = defineAsyncComponent(
+  () => import('@/components/boundingBoxes/WidgetBoundingBoxes.vue')
+)
+const WidgetColors = defineAsyncComponent(
+  () => import('@/components/palette/WidgetColors.vue')
+)
 
 export const FOR_TESTING = {
   WidgetButton,
@@ -219,6 +225,22 @@ const coreWidgetDefinitions: Array<[string, WidgetDefinition]> = [
       aliases: ['RANGE'],
       essential: false
     }
+  ],
+  [
+    'boundingboxes',
+    {
+      component: WidgetBoundingBoxes,
+      aliases: ['BOUNDING_BOXES'],
+      essential: false
+    }
+  ],
+  [
+    'colors',
+    {
+      component: WidgetColors,
+      aliases: ['COLORS'],
+      essential: false
+    }
   ]
 ]
 
@@ -258,7 +280,8 @@ const EXPANDING_TYPES = [
   'curve',
   'painter',
   'imagecompare',
-  'range'
+  'range',
+  'boundingboxes'
 ] as const
 
 export function shouldExpand(type: string): boolean {
diff --git a/src/renderer/hdr/colorGamut.test.ts b/src/renderer/hdr/colorGamut.test.ts
new file mode 100644
index 0000000000..42899d2e81
--- /dev/null
+++ b/src/renderer/hdr/colorGamut.test.ts
@@ -0,0 +1,90 @@
+import { describe, expect, it } from 'vitest'
+
+import {
+  GAMUT_NAMES,
+  detectGamutFromChromaticities,
+  gamutToSrgbMatrix
+} from './colorGamut'
+
+const IDENTITY = [1, 0, 0, 0, 1, 0, 0, 0, 1]
+
+describe('gamutToSrgbMatrix', () => {
+  it('returns identity for sRGB source', () => {
+    expect(gamutToSrgbMatrix('sRGB')).toEqual(IDENTITY)
+  })
+
+  it('matches the published linear Rec.2020 to sRGB matrix', () => {
+    const expected = [
+      1.6605, -0.5876, -0.0728, -0.1246, 1.1329, -0.0083, -0.0182, -0.1006,
+      1.1187
+    ]
+    const actual = gamutToSrgbMatrix('Rec.2020')
+    for (let i = 0; i < 9; i++) {
+      expect(actual[i]).toBeCloseTo(expected[i], 3)
+    }
+  })
+
+  it('maps the Rec.2020 white point to equal-energy sRGB (rows sum to ~1)', () => {
+    const m = gamutToSrgbMatrix('Rec.2020')
+    for (let row = 0; row < 3; row++) {
+      const sum = m[row * 3] + m[row * 3 + 1] + m[row * 3 + 2]
+      expect(sum).toBeCloseTo(1, 3)
+    }
+  })
+
+  it('exposes the supported gamut names', () => {
+    expect(GAMUT_NAMES).toContain('sRGB')
+    expect(GAMUT_NAMES).toContain('Rec.2020')
+  })
+})
+
+describe('detectGamutFromChromaticities', () => {
+  it('falls back to sRGB when the attribute is absent', () => {
+    expect(detectGamutFromChromaticities(undefined)).toBe('sRGB')
+  })
+
+  it('detects Rec.2020 primaries from the EXR header', () => {
+    expect(
+      detectGamutFromChromaticities({
+        redX: 0.708,
+        redY: 0.292,
+        greenX: 0.17,
+        greenY: 0.797,
+        blueX: 0.131,
+        blueY: 0.046,
+        whiteX: 0.3127,
+        whiteY: 0.329
+      })
+    ).toBe('Rec.2020')
+  })
+
+  it('does not match Rec.2020 when the white point differs', () => {
+    expect(
+      detectGamutFromChromaticities({
+        redX: 0.708,
+        redY: 0.292,
+        greenX: 0.17,
+        greenY: 0.797,
+        blueX: 0.131,
+        blueY: 0.046,
+        whiteX: 0.314,
+        whiteY: 0.351
+      })
+    ).toBe('sRGB')
+  })
+
+  it('detects Rec.709/sRGB primaries from the EXR header', () => {
+    expect(
+      detectGamutFromChromaticities({
+        redX: 0.64,
+        redY: 0.33,
+        greenX: 0.3,
+        greenY: 0.6,
+        blueX: 0.15,
+        blueY: 0.06,
+        whiteX: 0.3127,
+        whiteY: 0.329
+      })
+    ).toBe('sRGB')
+  })
+})
diff --git a/src/renderer/hdr/colorGamut.ts b/src/renderer/hdr/colorGamut.ts
new file mode 100644
index 0000000000..78f568a653
--- /dev/null
+++ b/src/renderer/hdr/colorGamut.ts
@@ -0,0 +1,144 @@
+interface Chromaticities {
+  red: readonly [number, number]
+  green: readonly [number, number]
+  blue: readonly [number, number]
+  white: readonly [number, number]
+}
+
+const D65: readonly [number, number] = [0.3127, 0.329]
+
+const CHROMATICITIES = {
+  sRGB: {
+    red: [0.64, 0.33],
+    green: [0.3, 0.6],
+    blue: [0.15, 0.06],
+    white: D65
+  },
+  'Rec.2020': {
+    red: [0.708, 0.292],
+    green: [0.17, 0.797],
+    blue: [0.131, 0.046],
+    white: D65
+  }
+} satisfies Record<string, Chromaticities>
+
+export type GamutName = keyof typeof CHROMATICITIES
+
+export const GAMUT_NAMES = Object.keys(CHROMATICITIES) as GamutName[]
+
+type Mat3 = readonly number[]
+
+const IDENTITY: Mat3 = [1, 0, 0, 0, 1, 0, 0, 0, 1]
+
+function rgbToXyz(c: Chromaticities): Mat3 {
+  const [rx, ry] = c.red
+  const [gx, gy] = c.green
+  const [bx, by] = c.blue
+  const [wx, wy] = c.white
+
+  const xWhite = wx / wy
+  const zWhite = (1 - wx - wy) / wy
+
+  const d = rx * (by - gy) + bx * (gy - ry) + gx * (ry - by)
+
+  const srN =
+    xWhite * (by - gy) -
+    gx * (by - 1 + by * (xWhite + zWhite)) +
+    bx * (gy - 1 + gy * (xWhite + zWhite))
+  const sgN =
+    xWhite * (ry - by) +
+    rx * (by - 1 + by * (xWhite + zWhite)) -
+    bx * (ry - 1 + ry * (xWhite + zWhite))
+  const sbN =
+    xWhite * (gy - ry) -
+    rx * (gy - 1 + gy * (xWhite + zWhite)) +
+    gx * (ry - 1 + ry * (xWhite + zWhite))
+
+  const sr = srN / d
+  const sg = sgN / d
+  const sb = sbN / d
+
+  return [
+    sr * rx,
+    sg * gx,
+    sb * bx,
+    sr * ry,
+    sg * gy,
+    sb * by,
+    sr * (1 - rx - ry),
+    sg * (1 - gx - gy),
+    sb * (1 - bx - by)
+  ]
+}
+
+function multiply(a: Mat3, b: Mat3): Mat3 {
+  const result = new Array<number>(9).fill(0)
+  for (let row = 0; row < 3; row++) {
+    for (let col = 0; col < 3; col++) {
+      let sum = 0
+      for (let k = 0; k < 3; k++) sum += a[row * 3 + k] * b[k * 3 + col]
+      result[row * 3 + col] = sum
+    }
+  }
+  return result
+}
+
+function invert(m: Mat3): Mat3 {
+  const [a, b, c, d, e, f, g, h, i] = m
+  const det = a * (e * i - f * h) - b * (d * i - f * g) + c * (d * h - e * g)
+  if (det === 0) return IDENTITY
+
+  const invDet = 1 / det
+  return [
+    (e * i - f * h) * invDet,
+    (c * h - b * i) * invDet,
+    (b * f - c * e) * invDet,
+    (f * g - d * i) * invDet,
+    (a * i - c * g) * invDet,
+    (c * d - a * f) * invDet,
+    (d * h - e * g) * invDet,
+    (b * g - a * h) * invDet,
+    (a * e - b * d) * invDet
+  ]
+}
+
+const SRGB_TO_XYZ = rgbToXyz(CHROMATICITIES.sRGB)
+const XYZ_TO_SRGB = invert(SRGB_TO_XYZ)
+
+export function gamutToSrgbMatrix(gamut: GamutName): Mat3 {
+  if (gamut === 'sRGB') return IDENTITY
+  return multiply(XYZ_TO_SRGB, rgbToXyz(CHROMATICITIES[gamut]))
+}
+
+export interface ChromaticityCoords {
+  redX: number
+  redY: number
+  greenX: number
+  greenY: number
+  blueX: number
+  blueY: number
+  whiteX: number
+  whiteY: number
+}
+
+function matchesGamut(c: ChromaticityCoords, gamut: GamutName): boolean {
+  const ref = CHROMATICITIES[gamut]
+  const tol = 0.01
+  return (
+    Math.abs(c.redX - ref.red[0]) < tol &&
+    Math.abs(c.redY - ref.red[1]) < tol &&
+    Math.abs(c.greenX - ref.green[0]) < tol &&
+    Math.abs(c.greenY - ref.green[1]) < tol &&
+    Math.abs(c.blueX - ref.blue[0]) < tol &&
+    Math.abs(c.blueY - ref.blue[1]) < tol &&
+    Math.abs(c.whiteX - ref.white[0]) < tol &&
+    Math.abs(c.whiteY - ref.white[1]) < tol
+  )
+}
+
+export function detectGamutFromChromaticities(
+  c: ChromaticityCoords | undefined
+): GamutName {
+  if (!c) return 'sRGB'
+  return GAMUT_NAMES.find((name) => matchesGamut(c, name)) ?? 'sRGB'
+}
diff --git a/src/renderer/hdr/hdrStats.test.ts b/src/renderer/hdr/hdrStats.test.ts
new file mode 100644
index 0000000000..a2a063cb61
--- /dev/null
+++ b/src/renderer/hdr/hdrStats.test.ts
@@ -0,0 +1,91 @@
+import { describe, expect, it } from 'vitest'
+
+import { computeChannelHistograms, computeImageStats } from './hdrStats'
+
+function reader(values: number[]) {
+  return (i: number) => values[i]
+}
+
+describe('computeImageStats', () => {
+  it('computes min/max/mean over RGB, skipping alpha', () => {
+    const data = [0, 0.5, 1, 1, 0.2, 0.4, 0.6, 1]
+    const stats = computeImageStats(reader(data), data.length, 4)
+    expect(stats.min).toBe(0)
+    expect(stats.max).toBe(1)
+    expect(stats.mean).toBeCloseTo((0 + 0.5 + 1 + 0.2 + 0.4 + 0.6) / 6, 6)
+  })
+
+  it('counts NaN and Inf and excludes them from min/max/mean', () => {
+    const data = [0.5, NaN, Infinity, -Infinity, 0.25]
+    const stats = computeImageStats(reader(data), data.length, 3)
+    expect(stats.nanCount).toBe(1)
+    expect(stats.infCount).toBe(2)
+    expect(stats.min).toBe(0.25)
+    expect(stats.max).toBe(0.5)
+    expect(stats.mean).toBeCloseTo(0.375, 6)
+  })
+
+  it('counts NaN/Inf in alpha but keeps alpha out of min/max/mean', () => {
+    const data = [0.1, 0.2, 0.3, NaN, 0.4, 0.5, 0.6, Infinity]
+    const stats = computeImageStats(reader(data), data.length, 4)
+    expect(stats.nanCount).toBe(1)
+    expect(stats.infCount).toBe(1)
+    expect(stats.min).toBe(0.1)
+    expect(stats.max).toBe(0.6)
+    expect(stats.mean).toBeCloseTo((0.1 + 0.2 + 0.3 + 0.4 + 0.5 + 0.6) / 6, 6)
+  })
+
+  it('reports HDR values above one', () => {
+    const data = [2, 4, 8]
+    const stats = computeImageStats(reader(data), data.length, 3)
+    expect(stats.max).toBe(8)
+    expect(stats.mean).toBeCloseTo(14 / 3, 6)
+  })
+
+  it('returns zeros when there are no finite samples', () => {
+    const data = [NaN, Infinity]
+    const stats = computeImageStats(reader(data), data.length, 3)
+    expect(stats).toEqual({
+      min: 0,
+      max: 0,
+      mean: 0,
+      stdDev: 0,
+      nanCount: 1,
+      infCount: 1
+    })
+  })
+})
+
+describe('computeChannelHistograms', () => {
+  it('bins each channel independently', () => {
+    const data = [0, 0.5, 1, 0.5, 0.5, 0.5]
+    const hist = computeChannelHistograms(reader(data), data.length, 3, 4)
+    expect(hist.r[0]).toBe(1)
+    expect(hist.r[2]).toBe(1)
+    expect(hist.g[2]).toBe(2)
+    expect(hist.b[3]).toBe(1)
+    expect(hist.a).toBeNull()
+  })
+
+  it('builds an alpha histogram for RGBA data', () => {
+    const data = [0, 0, 0, 1, 1, 1, 1, 0]
+    const hist = computeChannelHistograms(reader(data), data.length, 4, 4)
+    expect(hist.a).not.toBeNull()
+    expect(hist.a![3]).toBe(1)
+    expect(hist.a![0]).toBe(1)
+  })
+
+  it('clamps HDR values above one into the last bin', () => {
+    const data = [8, 8, 8]
+    const hist = computeChannelHistograms(reader(data), data.length, 3, 4)
+    expect(hist.luminance[3]).toBe(1)
+    expect(hist.r[3]).toBe(1)
+  })
+
+  it('skips NaN samples per channel', () => {
+    const data = [NaN, 0.5, 0.5]
+    const hist = computeChannelHistograms(reader(data), data.length, 3, 4)
+    expect(hist.r.reduce((a, b) => a + b, 0)).toBe(0)
+    expect(hist.g.reduce((a, b) => a + b, 0)).toBe(1)
+  })
+})
diff --git a/src/renderer/hdr/hdrStats.ts b/src/renderer/hdr/hdrStats.ts
new file mode 100644
index 0000000000..7febfdd668
--- /dev/null
+++ b/src/renderer/hdr/hdrStats.ts
@@ -0,0 +1,92 @@
+export interface ImageStats {
+  min: number
+  max: number
+  mean: number
+  stdDev: number
+  nanCount: number
+  infCount: number
+}
+
+export function computeImageStats(
+  read: (index: number) => number,
+  length: number,
+  channels: number
+): ImageStats {
+  let min = Infinity
+  let max = -Infinity
+  let sum = 0
+  let sumSq = 0
+  let count = 0
+  let nanCount = 0
+  let infCount = 0
+
+  for (let i = 0; i < length; i++) {
+    const value = read(i)
+    if (Number.isNaN(value)) {
+      nanCount++
+      continue
+    }
+    if (!Number.isFinite(value)) {
+      infCount++
+      continue
+    }
+    if (channels === 4 && i % channels === 3) continue
+    if (value < min) min = value
+    if (value > max) max = value
+    sum += value
+    sumSq += value * value
+    count++
+  }
+
+  if (count === 0) {
+    return { min: 0, max: 0, mean: 0, stdDev: 0, nanCount, infCount }
+  }
+
+  const mean = sum / count
+  const variance = Math.max(0, sumSq / count - mean * mean)
+  return { min, max, mean, stdDev: Math.sqrt(variance), nanCount, infCount }
+}
+
+export interface ChannelHistograms {
+  r: Uint32Array
+  g: Uint32Array
+  b: Uint32Array
+  a: Uint32Array | null
+  luminance: Uint32Array
+}
+
+export function computeChannelHistograms(
+  read: (index: number) => number,
+  length: number,
+  channels: number,
+  bins = 256
+): ChannelHistograms {
+  const last = bins - 1
+  const r = new Uint32Array(bins)
+  const g = new Uint32Array(bins)
+  const b = new Uint32Array(bins)
+  const luminance = new Uint32Array(bins)
+  const a = channels === 4 ? new Uint32Array(bins) : null
+
+  const accumulate = (target: Uint32Array, value: number) => {
+    if (Number.isNaN(value)) return
+    const bin = Math.floor(Math.max(0, value) * bins)
+    target[bin > last ? last : bin]++
+  }
+
+  for (let i = 0; i + channels - 1 < length; i += channels) {
+    const rv = read(i)
+    const gv = channels >= 3 ? read(i + 1) : rv
+    const bv = channels >= 3 ? read(i + 2) : rv
+    accumulate(r, rv)
+    accumulate(g, gv)
+    accumulate(b, bv)
+    if (a) accumulate(a, read(i + 3))
+    accumulate(
+      luminance,
+      channels >= 3 ? 0.2126 * rv + 0.7152 * gv + 0.0722 * bv : rv
+    )
+  }
+
+  return { r, g, b, a, luminance }
+}
diff --git a/src/renderer/hdr/hdrViewerShader.ts b/src/renderer/hdr/hdrViewerShader.ts
new file mode 100644
index 0000000000..d7737acaf7
--- /dev/null
+++ b/src/renderer/hdr/hdrViewerShader.ts
@@ -0,0 +1,79 @@
+export const HDR_VIEWER_VERTEX_SHADER = `
+out vec2 vUv;
+
+void main() {
+  vUv = uv;
+  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
+}
+`
+
+export const HDR_VIEWER_FRAGMENT_SHADER = `
+in vec2 vUv;
+out vec4 frag_color;
+
+uniform sampler2D uImage;
+uniform mat3 uGamutToSRGB;
+uniform float uGain;
+uniform int uChannel;
+uniform bool uDither;
+uniform bool uClipWarnings;
+uniform vec2 uClipRange;
+
+float linearToS(float a) {
+  float s = sign(a);
+  a = abs(a);
+  return s * (a < 0.0031308 ? 12.92 * a : 1.055 * pow(a, 1.0 / 2.4) - 0.055);
+}
+
+vec3 linearToSRGB(vec3 c) {
+  return vec3(linearToS(c.r), linearToS(c.g), linearToS(c.b));
+}
+
+float ign(vec2 p) {
+  return fract(52.9829189 * fract(0.06711056 * p.x + 0.00583715 * p.y));
+}
+
+float tent(float r) {
+  float rp = sqrt(2.0 * r);
+  float rn = sqrt(2.0 * r + 1.0) - 1.0;
+  return (r < 0.0) ? 0.5 * rn : 0.5 * rp;
+}
+
+void main() {
+  vec4 texel = texture(uImage, vUv);
+  vec3 mapped = uGamutToSRGB * texel.rgb;
+
+  vec3 selected;
+  if (uChannel == 1) selected = vec3(mapped.r);
+  else if (uChannel == 2) selected = vec3(mapped.g);
+  else if (uChannel == 3) selected = vec3(mapped.b);
+  else if (uChannel == 4) selected = vec3(texel.a);
+  else if (uChannel == 5)
+    selected = vec3(dot(mapped, vec3(0.2126, 0.7152, 0.0722)));
+  else selected = mapped;
+
+  vec3 exposed = selected * uGain;
+
+  vec3 display = linearToSRGB(exposed);
+
+  if (uDither) {
+    float r = ign(gl_FragCoord.xy) - 0.5;
+    display += vec3(tent(r) / 255.0);
+  }
+
+  display = clamp(display, 0.0, 1.0);
+
+  if (uClipWarnings) {
+    float zebra1 =
+      mod(floor((gl_FragCoord.x + gl_FragCoord.y) / 8.0), 2.0) == 0.0 ? 0.0 : 1.0;
+    float zebra2 =
+      mod(floor((gl_FragCoord.x - gl_FragCoord.y) / 8.0), 2.0) == 0.0 ? 0.0 : 1.0;
+    bvec3 over = greaterThan(exposed, vec3(uClipRange.y));
+    bvec3 under = lessThan(exposed, vec3(uClipRange.x));
+    display = mix(display, vec3(zebra1), vec3(over));
+    display = mix(display, vec3(zebra2), vec3(under));
+  }
+
+  frag_color = vec4(display, 1.0);
+}
+`
diff --git a/src/renderer/three/WebGLViewport.test.ts b/src/renderer/three/WebGLViewport.test.ts
new file mode 100644
index 0000000000..3f8e529860
--- /dev/null
+++ b/src/renderer/three/WebGLViewport.test.ts
@@ -0,0 +1,52 @@
+import type * as THREE from 'three'
+import { afterEach, describe, expect, it, vi } from 'vitest'
+
+import { WebGLViewport } from './WebGLViewport'
+
+function fakeRenderer() {
+  const domElement = document.createElement('canvas')
+  return {
+    forceContextLoss: vi.fn(),
+    dispose: vi.fn(),
+    domElement
+  } as unknown as THREE.WebGLRenderer
+}
+
+describe('WebGLViewport', () => {
+  afterEach(() => vi.unstubAllGlobals())
+
+  it('releases the context via forceContextLoss before disposing', () => {
+    const renderer = fakeRenderer()
+    const dispatchSpy = vi.spyOn(renderer.domElement, 'dispatchEvent')
+    const removeSpy = vi.spyOn(renderer.domElement, 'remove')
+
+    new WebGLViewport(renderer).disposeRenderer()
+
+    expect(renderer.forceContextLoss).toHaveBeenCalledOnce()
+    expect(renderer.dispose).toHaveBeenCalledOnce()
+    expect(removeSpy).toHaveBeenCalledOnce()
+    expect(dispatchSpy.mock.calls[0][0].type).toBe('webglcontextlost')
+  })
+
+  it('observes the resize target and disconnects on dispose', () => {
+    const observe = vi.fn()
+    const disconnect = vi.fn()
+    vi.stubGlobal(
+      'ResizeObserver',
+      class {
+        observe = observe
+        disconnect = disconnect
+        unobserve = vi.fn()
+      }
+    )
+    const target = document.createElement('div')
+    const onResize = vi.fn()
+    const viewport = new WebGLViewport(fakeRenderer())
+
+    viewport.observeResize(target, onResize)
+    expect(observe).toHaveBeenCalledWith(target)
+
+    viewport.disposeRenderer()
+    expect(disconnect).toHaveBeenCalledOnce()
+  })
+})
diff --git a/src/renderer/three/WebGLViewport.ts b/src/renderer/three/WebGLViewport.ts
new file mode 100644
index 0000000000..3ecb955db2
--- /dev/null
+++ b/src/renderer/three/WebGLViewport.ts
@@ -0,0 +1,29 @@
+import type * as THREE from 'three'
+
+export class WebGLViewport {
+  renderer: THREE.WebGLRenderer
+  private resizeObserver: ResizeObserver | null = null
+
+  constructor(renderer: THREE.WebGLRenderer) {
+    this.renderer = renderer
+  }
+
+  observeResize(target: Element, onResize: () => void): void {
+    if (typeof ResizeObserver === 'undefined') return
+    this.resizeObserver?.disconnect()
+    this.resizeObserver = new ResizeObserver(() => onResize())
+    this.resizeObserver.observe(target)
+  }
+
+  disposeRenderer(): void {
+    this.resizeObserver?.disconnect()
+    this.resizeObserver = null
+
+    this.renderer.forceContextLoss()
+    this.renderer.domElement.dispatchEvent(
+      new Event('webglcontextlost', { bubbles: true, cancelable: true })
+    )
+    this.renderer.dispose()
+    this.renderer.domElement.remove()
+  }
+}
diff --git a/src/router.ts b/src/router.ts
index b653140d69..13ed87e904 100644
--- a/src/router.ts
+++ b/src/router.ts
@@ -18,6 +18,7 @@ import LayoutDefault from '@/views/layouts/LayoutDefault.vue'
 import { captureOAuthRequestId } from '@/platform/cloud/oauth/oauthState'
 import { installPreservedQueryTracker } from '@/platform/navigation/preservedQueryTracker'
 import { PRESERVED_QUERY_NAMESPACES } from '@/platform/navigation/preservedQueryNamespaces'
+import { preserveLoggedOutShareAuthAttribution } from '@/platform/workflow/sharing/utils/shareAuthAttribution'
 
 const cloudOnboardingRoutes = isCloud
   ? (await import('./platform/cloud/onboarding/onboardingCloudRoutes'))
@@ -42,8 +43,6 @@ function getBasePath(): string {
 const basePath = getBasePath()
 
 function trackPageView(): void {
-  if (!isCloud || typeof window === 'undefined') return
-
   useTelemetry()?.trackPageView(document.title, {
     path: window.location.href
   })
@@ -169,6 +168,7 @@ if (isCloud) {
     // Pass authenticated users
     const authHeader = await authStore.getAuthHeader()
     const isLoggedIn = !!authHeader
+    preserveLoggedOutShareAuthAttribution(to.query, isLoggedIn)
 
     // Allow public routes
     if (isPublicRoute(to)) {
diff --git a/src/schemas/nodeDef/nodeDefSchemaV2.ts b/src/schemas/nodeDef/nodeDefSchemaV2.ts
index a783f2edf0..e08d37dd8d 100644
--- a/src/schemas/nodeDef/nodeDefSchemaV2.ts
+++ b/src/schemas/nodeDef/nodeDefSchemaV2.ts
@@ -114,6 +114,35 @@ const zGalleriaInputSpec = zBaseInputOptions.extend({
     .optional()
 })
 
+const zColorsInputSpec = zBaseInputOptions.extend({
+  type: z.literal('COLORS'),
+  name: z.string(),
+  isOptional: z.boolean().optional(),
+  default: z.array(z.string()).optional()
+})
+
+const zBoundingBoxesInputSpec = zBaseInputOptions.extend({
+  type: z.literal('BOUNDING_BOXES'),
+  name: z.string(),
+  isOptional: z.boolean().optional(),
+  default: z
+    .array(
+      z.object({
+        x: z.number(),
+        y: z.number(),
+        width: z.number(),
+        height: z.number(),
+        metadata: z.object({
+          type: z.enum(['obj', 'text']),
+          text: z.string(),
+          desc: z.string(),
+          palette: z.array(z.string())
+        })
+      })
+    )
+    .optional()
+})
+
 const zTextareaInputSpec = zBaseInputOptions.extend({
   type: z.literal('TEXTAREA'),
   name: z.string(),
@@ -179,6 +208,8 @@ const zInputSpec = z.union([
   zMarkdownInputSpec,
   zChartInputSpec,
   zGalleriaInputSpec,
+  zColorsInputSpec,
+  zBoundingBoxesInputSpec,
   zTextareaInputSpec,
   zCurveInputSpec,
   zRangeInputSpec,
@@ -225,6 +256,8 @@ export type ImageCompareInputSpec = z.infer<typeof zImageCompareInputSpec>
 export type BoundingBoxInputSpec = z.infer<typeof zBoundingBoxInputSpec>
 export type ChartInputSpec = z.infer<typeof zChartInputSpec>
 export type GalleriaInputSpec = z.infer<typeof zGalleriaInputSpec>
+export type ColorsInputSpec = z.infer<typeof zColorsInputSpec>
+export type BoundingBoxesInputSpec = z.infer<typeof zBoundingBoxesInputSpec>
 export type TextareaInputSpec = z.infer<typeof zTextareaInputSpec>
 export type CurveInputSpec = z.infer<typeof zCurveInputSpec>
 export type RangeInputSpec = z.infer<typeof zRangeInputSpec>
diff --git a/src/scripts/api.eventListeners.test.ts b/src/scripts/api.eventListeners.test.ts
new file mode 100644
index 0000000000..c9a117de05
--- /dev/null
+++ b/src/scripts/api.eventListeners.test.ts
@@ -0,0 +1,110 @@
+import { afterEach, describe, expect, it, vi } from 'vitest'
+
+import { ComfyApi } from '@/scripts/api'
+
+describe('ComfyApi event listener error isolation', () => {
+  afterEach(() => {
+    vi.restoreAllMocks()
+  })
+
+  it('does not let a throwing listener abort dispatch to other listeners', () => {
+    const api = new ComfyApi()
+    const warn = vi.spyOn(console, 'warn').mockImplementation(() => {})
+    const calls: string[] = []
+
+    api.addEventListener('reconnected', () => {
+      calls.push('a')
+      throw new Error('boom from a custom node')
+    })
+    api.addEventListener('reconnected', () => {
+      calls.push('b')
+    })
+
+    expect(() => api.dispatchCustomEvent('reconnected')).not.toThrow()
+    // The second listener still runs even though the first threw.
+    expect(calls).toEqual(['a', 'b'])
+    expect(warn).toHaveBeenCalledOnce()
+    expect(String(warn.mock.calls[0][0])).toContain('reconnected')
+    // The thrown error itself is logged (second arg) for debugging.
+    expect(warn.mock.calls[0][1]).toBeInstanceOf(Error)
+  })
+
+  it('preserves the native `this` binding when invoking listeners', () => {
+    const api = new ComfyApi()
+    let receivedThis: unknown
+    api.addEventListener('reconnected', function (this: unknown) {
+      receivedThis = this
+    })
+    api.dispatchCustomEvent('reconnected')
+    // Native EventTarget binds `this` to the target; the wrapper must too.
+    expect(receivedThis).toBe(api)
+  })
+
+  it('guards async listener rejections and logs the error object', async () => {
+    const api = new ComfyApi()
+    const warn = vi.spyOn(console, 'warn').mockImplementation(() => {})
+    const err = new Error('async boom')
+
+    api.addEventListener('reconnected', () => Promise.reject(err))
+    api.dispatchCustomEvent('reconnected')
+
+    await vi.waitFor(() => expect(warn).toHaveBeenCalled())
+    expect(warn.mock.calls[0][1]).toBe(err)
+  })
+
+  it('guards bare PromiseLike thenables (no .catch method) without throwing', async () => {
+    const api = new ComfyApi()
+    const warn = vi.spyOn(console, 'warn').mockImplementation(() => {})
+    const err = new Error('thenable boom')
+
+    api.addEventListener('reconnected', () => ({
+      then(_onFulfilled: unknown, onRejected: (e: unknown) => void) {
+        onRejected(err)
+        return this
+      }
+    }))
+    expect(() => api.dispatchCustomEvent('reconnected')).not.toThrow()
+
+    await vi.waitFor(() => expect(warn).toHaveBeenCalled())
+    expect(warn.mock.calls[0][1]).toBe(err)
+  })
+
+  it('supports EventListenerObject ({ handleEvent }) listeners', () => {
+    const api = new ComfyApi()
+    const handleEvent = vi.fn()
+
+    api.addEventListener('reconnected', {
+      handleEvent
+    } as unknown as () => void)
+    api.dispatchCustomEvent('reconnected')
+
+    expect(handleEvent).toHaveBeenCalledOnce()
+  })
+
+  it('logs at warn, not error (RUM collects console.error by default)', () => {
+    const api = new ComfyApi()
+    vi.spyOn(console, 'warn').mockImplementation(() => {})
+    const error = vi.spyOn(console, 'error').mockImplementation(() => {})
+
+    api.addEventListener('reconnected', () => {
+      throw new Error('boom')
+    })
+    api.dispatchCustomEvent('reconnected')
+
+    expect(error).not.toHaveBeenCalled()
+  })
+
+  it('removeEventListener still removes a guarded listener', () => {
+    const api = new ComfyApi()
+    const handler = vi.fn()
+
+    api.addEventListener('reconnected', handler)
+    api.dispatchCustomEvent('reconnected')
+    expect(handler).toHaveBeenCalledTimes(1)
+
+    api.removeEventListener('reconnected', handler)
+    api.dispatchCustomEvent('reconnected')
+    // Not called a second time — the wrapper was matched and removed.
+    expect(handler).toHaveBeenCalledTimes(1)
+  })
+})
diff --git a/src/scripts/api.ts b/src/scripts/api.ts
index 38b1719f05..1ed54a2c28 100644
--- a/src/scripts/api.ts
+++ b/src/scripts/api.ts
@@ -318,6 +318,15 @@ export class PromptExecutionError extends Error {
 
 export class ComfyApi extends EventTarget {
   private _registered = new Set()
+  /**
+   * Maps an original event listener to its error-guarded wrapper, so that
+   * {@link removeEventListener} can match the wrapper installed by
+   * {@link addEventListener}. Keyed weakly so wrappers are GC'd with listeners.
+   */
+  private _listenerWrappers = new WeakMap<
+    EventListenerOrEventListenerObject,
+    EventListener
+  >()
   api_host: string
   api_base: string
   /**
@@ -469,13 +478,79 @@ export class ComfyApi extends EventTarget {
     })
   }
 
+  /**
+   * Wraps an event listener so an exception thrown by it — most often from a
+   * third-party custom node — is caught and logged instead of surfacing as an
+   * unhandled error in global telemetry (which RUM captures as a high-volume,
+   * non-actionable error). Native EventTarget already isolates listeners from
+   * one another; this only changes where the error goes.
+   *
+   * The same original listener always maps to the same wrapper, so
+   * {@link removeEventListener} still matches. Logged at `warn` level on
+   * purpose: RUM collects `console.error` by default, which would re-introduce
+   * the noise this guard removes.
+   */
+  private wrapListener(
+    callback: EventListenerOrEventListenerObject | null
+  ): EventListenerOrEventListenerObject | null {
+    if (!callback) return callback
+    let wrapped = this._listenerWrappers.get(callback)
+    if (!wrapped) {
+      const logError = (event: Event, error: unknown) =>
+        console.warn(
+          `[ComfyApi] Uncaught error in "${event.type}" event listener:`,
+          error
+        )
+      // Regular function (not arrow) so the listener keeps the native
+      // `this === currentTarget` binding that EventTarget provides.
+      wrapped = function (this: unknown, event: Event) {
+        try {
+          const result: unknown =
+            typeof callback === 'function'
+              ? callback.call(this, event)
+              : callback.handleEvent(event)
+          // Async listeners: route a rejected promise through the same guard so
+          // it does not escape as an unhandled rejection (which RUM also logs).
+          if (
+            result != null &&
+            typeof (result as PromiseLike<unknown>).then === 'function'
+          ) {
+            void Promise.resolve(result).catch((error: unknown) =>
+              logError(event, error)
+            )
+          }
+        } catch (error) {
+          logError(event, error)
+        }
+      }
+      this._listenerWrappers.set(callback, wrapped)
+    }
+    return wrapped
+  }
+
+  /**
+   * Looks up the guarded wrapper for a listener without creating one — used on
+   * the remove path so a never-registered callback does not leave a stray
+   * WeakMap entry. Falls back to the original callback (a harmless no-op).
+   */
+  private getWrappedListener(
+    callback: EventListenerOrEventListenerObject | null
+  ): EventListenerOrEventListenerObject | null {
+    if (!callback) return callback
+    return this._listenerWrappers.get(callback) ?? callback
+  }
+
   override addEventListener<TEvent extends keyof ApiEvents>(
     type: TEvent,
     callback: ((event: ApiEvents[TEvent]) => void) | null,
     options?: AddEventListenerOptions | boolean
   ) {
     // Type assertion: strictFunctionTypes.  So long as we emit events in a type-safe fashion, this is safe.
-    super.addEventListener(type, callback as EventListener, options)
+    super.addEventListener(
+      type,
+      this.wrapListener(callback as EventListener),
+      options
+    )
     this._registered.add(type)
   }
 
@@ -484,7 +559,11 @@ export class ComfyApi extends EventTarget {
     callback: ((event: ApiEvents[TEvent]) => void) | null,
     options?: EventListenerOptions | boolean
   ): void {
-    super.removeEventListener(type, callback as EventListener, options)
+    super.removeEventListener(
+      type,
+      this.getWrappedListener(callback as EventListener),
+      options
+    )
   }
 
   addCustomEventListener(
@@ -492,7 +571,11 @@ export class ComfyApi extends EventTarget {
     callback: ((event: CustomEvent<unknown>) => void) | null,
     options?: AddEventListenerOptions | boolean
   ) {
-    super.addEventListener(type, callback as EventListener, options)
+    super.addEventListener(
+      type,
+      this.wrapListener(callback as EventListener),
+      options
+    )
     this._registered.add(type)
   }
 
@@ -501,7 +584,11 @@ export class ComfyApi extends EventTarget {
     callback: ((event: CustomEvent<unknown>) => void) | null,
     options?: EventListenerOptions | boolean
   ) {
-    super.removeEventListener(type, callback as EventListener, options)
+    super.removeEventListener(
+      type,
+      this.getWrappedListener(callback as EventListener),
+      options
+    )
   }
 
   /**
diff --git a/src/scripts/app.ts b/src/scripts/app.ts
index 59d3ef4b07..9e2399c99b 100644
--- a/src/scripts/app.ts
+++ b/src/scripts/app.ts
@@ -77,6 +77,10 @@ import { useExtensionStore } from '@/stores/extensionStore'
 import { useAuthStore } from '@/stores/authStore'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
 import { useJobPreviewStore } from '@/stores/jobPreviewStore'
+import {
+  getAncestorExecutionIds,
+  tryNormalizeNodeExecutionId
+} from '@/types/nodeIdentification'
 import { KeyComboImpl } from '@/platform/keybindings/keyCombo'
 import { useKeybindingStore } from '@/platform/keybindings/keybindingStore'
 import { SYSTEM_NODE_DEFS, useNodeDefStore } from '@/stores/nodeDefStore'
@@ -772,7 +776,10 @@ export class ComfyApp {
 
     api.addEventListener('executed', ({ detail }) => {
       const nodeOutputStore = useNodeOutputStore()
-      const executionId = String(detail.display_node || detail.node)
+      const executionId = tryNormalizeNodeExecutionId(
+        detail.display_node || detail.node
+      )
+      if (!executionId) return
 
       nodeOutputStore.setNodeOutputsByExecutionId(executionId, detail.output, {
         merge: detail.merge
@@ -810,16 +817,17 @@ export class ComfyApp {
       const { blob, displayNodeId, jobId } = detail
       const { setNodePreviewsByExecutionId, revokePreviewsByExecutionId } =
         useNodeOutputStore()
+      const displayNodeExecutionId = tryNormalizeNodeExecutionId(displayNodeId)
+      if (!displayNodeExecutionId) return
       const blobUrl = createSharedObjectUrl(blob)
       useJobPreviewStore().setPreviewUrl(jobId, blobUrl, displayNodeId)
       // Ensure clean up if `executing` event is missed.
-      revokePreviewsByExecutionId(displayNodeId)
+      revokePreviewsByExecutionId(displayNodeExecutionId)
       // Preview cleanup is handled in progress_state event to support multiple concurrent previews
-      const nodeParents = displayNodeId.split(':')
-      for (let i = 1; i <= nodeParents.length; i++) {
-        setNodePreviewsByExecutionId(nodeParents.slice(0, i).join(':'), [
-          blobUrl
-        ])
+      for (const executionId of getAncestorExecutionIds(
+        displayNodeExecutionId
+      )) {
+        setNodePreviewsByExecutionId(executionId, [blobUrl])
       }
       releaseSharedObjectUrl(blobUrl)
     })
diff --git a/src/scripts/widgets.ts b/src/scripts/widgets.ts
index 1b34ca34dc..eda40525ba 100644
--- a/src/scripts/widgets.ts
+++ b/src/scripts/widgets.ts
@@ -16,6 +16,8 @@ import { useColorWidget } from '@/renderer/extensions/vueNodes/widgets/composabl
 import { useComboWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useComboWidget'
 import { useFloatWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useFloatWidget'
 import { useGalleriaWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useGalleriaWidget'
+import { useBoundingBoxesWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useBoundingBoxesWidget'
+import { useColorsWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useColorsWidget'
 import { useImageCompareWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useImageCompareWidget'
 import { useImageUploadWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useImageUploadWidget'
 import { useIntWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useIntWidget'
@@ -234,6 +236,8 @@ export const ComfyWidgets = {
   TEXTAREA: transformWidgetConstructorV2ToV1(useTextareaWidget()),
   CURVE: transformWidgetConstructorV2ToV1(useCurveWidget()),
   RANGE: transformWidgetConstructorV2ToV1(useRangeWidget()),
+  BOUNDING_BOXES: transformWidgetConstructorV2ToV1(useBoundingBoxesWidget()),
+  COLORS: transformWidgetConstructorV2ToV1(useColorsWidget()),
   ...dynamicWidgets
 } as const
 
diff --git a/src/services/customerEventsService.test.ts b/src/services/customerEventsService.test.ts
index d07b4b198b..8342e407fd 100644
--- a/src/services/customerEventsService.test.ts
+++ b/src/services/customerEventsService.test.ts
@@ -32,7 +32,8 @@ vi.mock('@/stores/authStore', () => ({
 }))
 
 vi.mock('@/i18n', () => ({
-  d: mockI18n.d
+  d: mockI18n.d,
+  t: (key: string) => key
 }))
 
 vi.mock('@/utils/typeGuardUtil', () => ({
@@ -197,16 +198,19 @@ describe('useCustomerEventsService', () => {
   })
 
   describe('formatEventType', () => {
-    it('should format known event types correctly', () => {
-      expect(service.formatEventType(EventType.CREDIT_ADDED)).toBe(
-        'Credits Added'
-      )
-      expect(service.formatEventType(EventType.ACCOUNT_CREATED)).toBe(
-        'Account Created'
-      )
-      expect(service.formatEventType(EventType.API_USAGE_COMPLETED)).toBe(
-        'API Usage'
-      )
+    const expectedByType: Record<string, string> = {
+      credit_added: 'credits.eventTypes.creditAdded',
+      topup_completed: 'credits.eventTypes.creditAdded',
+      account_created: 'credits.eventTypes.accountCreated',
+      api_usage_completed: 'credits.eventTypes.apiUsage',
+      gpu_usage: 'credits.eventTypes.gpuUsage',
+      api_node_usage: 'credits.eventTypes.apiNodeUsage'
+    }
+
+    it('maps known legacy and unified event types to expected i18n keys', () => {
+      for (const [eventType, expectedKey] of Object.entries(expectedByType)) {
+        expect(service.formatEventType(eventType)).toBe(expectedKey)
+      }
     })
 
     it('should return the original string for unknown event types', () => {
@@ -223,6 +227,15 @@ describe('useCustomerEventsService', () => {
       )
     })
 
+    it('returns success for the unified topup_completed event', () => {
+      expect(service.getEventSeverity('topup_completed')).toBe('success')
+    })
+
+    it('returns warning for unified usage events', () => {
+      expect(service.getEventSeverity('gpu_usage')).toBe('warning')
+      expect(service.getEventSeverity('api_node_usage')).toBe('warning')
+    })
+
     it('should return default severity for unknown event types', () => {
       expect(service.getEventSeverity('unknown_event')).toBe('info')
     })
diff --git a/src/services/customerEventsService.ts b/src/services/customerEventsService.ts
index 38d1a74bec..78ea7fef4e 100644
--- a/src/services/customerEventsService.ts
+++ b/src/services/customerEventsService.ts
@@ -3,7 +3,7 @@ import axios from 'axios'
 import { ref, watch } from 'vue'
 
 import { getComfyApiBaseUrl } from '@/config/comfyApi'
-import { d } from '@/i18n'
+import { d, t } from '@/i18n'
 import { useAuthStore } from '@/stores/authStore'
 import type { components, operations } from '@/types/comfyRegistryTypes'
 import { isAbortError } from '@/utils/typeGuardUtil'
@@ -93,11 +93,16 @@ export const useCustomerEventsService = () => {
   function formatEventType(eventType: string) {
     switch (eventType) {
       case 'credit_added':
-        return 'Credits Added'
+      case 'topup_completed':
+        return t('credits.eventTypes.creditAdded')
       case 'account_created':
-        return 'Account Created'
+        return t('credits.eventTypes.accountCreated')
       case 'api_usage_completed':
-        return 'API Usage'
+        return t('credits.eventTypes.apiUsage')
+      case 'gpu_usage':
+        return t('credits.eventTypes.gpuUsage')
+      case 'api_node_usage':
+        return t('credits.eventTypes.apiNodeUsage')
       default:
         return eventType
     }
@@ -137,10 +142,13 @@ export const useCustomerEventsService = () => {
   function getEventSeverity(eventType: string) {
     switch (eventType) {
       case 'credit_added':
+      case 'topup_completed':
         return 'success'
       case 'account_created':
         return 'info'
       case 'api_usage_completed':
+      case 'gpu_usage':
+      case 'api_node_usage':
         return 'warning'
       default:
         return 'info'
diff --git a/src/services/hdrViewerService.test.ts b/src/services/hdrViewerService.test.ts
new file mode 100644
index 0000000000..4d303527f5
--- /dev/null
+++ b/src/services/hdrViewerService.test.ts
@@ -0,0 +1,23 @@
+import { describe, expect, it, vi } from 'vitest'
+
+const { showDialog } = vi.hoisted(() => ({ showDialog: vi.fn() }))
+
+vi.mock('@/stores/dialogStore', () => ({
+  useDialogStore: () => ({ showDialog })
+}))
+vi.mock('@/i18n', () => ({ t: (key: string) => key }))
+
+import { openHdrViewer } from './hdrViewerService'
+
+describe('openHdrViewer', () => {
+  it('opens a full-screen dialog with the full-resolution url and filename title', () => {
+    openHdrViewer('/api/view?filename=out.exr&preview=webp;75&rand=1')
+
+    expect(showDialog).toHaveBeenCalledOnce()
+    const options = showDialog.mock.calls[0][0]
+    expect(options.key).toBe('hdr-viewer')
+    expect(options.title).toBe('out.exr')
+    expect(options.props.imageUrl).toBe('/api/view?filename=out.exr&rand=1')
+    expect(options.dialogComponentProps.size).toBe('full')
+  })
+})
diff --git a/src/services/hdrViewerService.ts b/src/services/hdrViewerService.ts
new file mode 100644
index 0000000000..210a76dca1
--- /dev/null
+++ b/src/services/hdrViewerService.ts
@@ -0,0 +1,28 @@
+import { defineAsyncComponent } from 'vue'
+
+import { t } from '@/i18n'
+import { useDialogStore } from '@/stores/dialogStore'
+import {
+  getImageFilenameFromUrl,
+  toFullResolutionUrl
+} from '@/utils/hdrFormatUtil'
+
+const HdrViewerContent = defineAsyncComponent(
+  () => import('@/components/hdr/HdrViewerContent.vue')
+)
+
+export function openHdrViewer(url: string) {
+  const fullResUrl = toFullResolutionUrl(url)
+  useDialogStore().showDialog({
+    key: 'hdr-viewer',
+    title: getImageFilenameFromUrl(fullResUrl) ?? t('hdrViewer.title'),
+    component: HdrViewerContent,
+    props: { imageUrl: fullResUrl },
+    dialogComponentProps: {
+      renderer: 'reka',
+      size: 'full',
+      contentClass: 'w-[80vw] h-[80vh] max-h-[80vh]',
+      maximizable: true
+    }
+  })
+}
diff --git a/src/stores/authStore.test.ts b/src/stores/authStore.test.ts
index f0b62c52c7..8fe82f1da9 100644
--- a/src/stores/authStore.test.ts
+++ b/src/stores/authStore.test.ts
@@ -6,7 +6,10 @@ import type { Mock } from 'vitest'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 import * as vuefire from 'vuefire'
 
-import { clearPreservedQuery } from '@/platform/navigation/preservedQueryManager'
+import {
+  capturePreservedQuery,
+  clearPreservedQuery
+} from '@/platform/navigation/preservedQueryManager'
 import { PRESERVED_QUERY_NAMESPACES } from '@/platform/navigation/preservedQueryNamespaces'
 import { useDialogService } from '@/services/dialogService'
 import { useAuthStore } from '@/stores/authStore'
@@ -687,31 +690,106 @@ describe('useAuthStore', () => {
           )
         }
       )
+    })
+  })
 
-      it('includes preserved share id on new-user social auth', async () => {
-        sessionStorage.setItem(
-          'Comfy.PreservedQuery.share_auth',
-          JSON.stringify({ share: 'share-1' })
-        )
-        vi.mocked(firebaseAuth.getAdditionalUserInfo).mockReturnValue({
-          isNewUser: true,
-          providerId: 'google.com',
-          profile: null
-        })
+  describe('share auth attribution', () => {
+    const mockUserCredential = {
+      user: mockUser,
+      providerId: null,
+      operationType: 'signIn'
+    } satisfies UserCredential
 
-        await store.loginWithGoogle()
+    const preserveShareAuth = () => {
+      capturePreservedQuery(
+        PRESERVED_QUERY_NAMESPACES.SHARE_AUTH,
+        { share: 'share-1' },
+        ['share']
+      )
+    }
 
-        expect(mockTrackAuth).toHaveBeenCalledWith(
-          expect.objectContaining({
-            is_new_user: true,
-            share_id: 'share-1'
-          })
-        )
-        expect(
-          sessionStorage.getItem('Comfy.PreservedQuery.share_auth')
-        ).toBeNull()
+    const expectShareAuthConsumed = () => {
+      expect(
+        sessionStorage.getItem('Comfy.PreservedQuery.share_auth')
+      ).toBeNull()
+    }
+
+    beforeEach(() => {
+      vi.mocked(firebaseAuth.signInWithEmailAndPassword).mockResolvedValue(
+        mockUserCredential
+      )
+      vi.mocked(firebaseAuth.createUserWithEmailAndPassword).mockResolvedValue(
+        mockUserCredential
+      )
+      vi.mocked(firebaseAuth.signInWithPopup).mockResolvedValue(
+        mockUserCredential
+      )
+      vi.mocked(firebaseAuth.getAdditionalUserInfo).mockReturnValue({
+        isNewUser: true,
+        providerId: 'google.com',
+        profile: null
       })
     })
+
+    it('includes share_id on email signup auth completion', async () => {
+      preserveShareAuth()
+
+      await store.register('new@example.com', 'password')
+
+      expect(mockTrackAuth).toHaveBeenCalledWith({
+        method: 'email',
+        is_new_user: true,
+        user_id: 'test-user-id',
+        email: 'test@example.com',
+        share_id: 'share-1'
+      })
+      expectShareAuthConsumed()
+    })
+
+    it('includes share_id on email login auth completion', async () => {
+      preserveShareAuth()
+
+      await store.login('test@example.com', 'password')
+
+      expect(mockTrackAuth).toHaveBeenCalledWith({
+        method: 'email',
+        is_new_user: false,
+        user_id: 'test-user-id',
+        email: 'test@example.com',
+        share_id: 'share-1'
+      })
+      expectShareAuthConsumed()
+    })
+
+    it('includes share_id on Google auth completion', async () => {
+      preserveShareAuth()
+
+      await store.loginWithGoogle()
+
+      expect(mockTrackAuth).toHaveBeenCalledWith({
+        method: 'google',
+        is_new_user: true,
+        user_id: 'test-user-id',
+        email: 'test@example.com',
+        share_id: 'share-1'
+      })
+      expectShareAuthConsumed()
+    })
+
+    it('includes share_id on GitHub auth completion', async () => {
+      preserveShareAuth()
+
+      await store.loginWithGithub()
+
+      expect(mockTrackAuth).toHaveBeenCalledWith({
+        method: 'github',
+        is_new_user: true,
+        user_id: 'test-user-id',
+        email: 'test@example.com',
+        share_id: 'share-1'
+      })
+      expectShareAuthConsumed()
+    })
   })
 
   describe('accessBillingPortal', () => {
diff --git a/src/stores/authStore.ts b/src/stores/authStore.ts
index 6f20ca79c8..534f222c56 100644
--- a/src/stores/authStore.ts
+++ b/src/stores/authStore.ts
@@ -361,15 +361,13 @@ export const useAuthStore = defineStore('auth', () => {
       { createCustomer: true }
     )
 
-    if (isCloud) {
-      useTelemetry()?.trackAuth({
-        method: 'email',
-        is_new_user: false,
-        user_id: result.user.uid,
-        email: result.user.email ?? undefined,
-        ...getShareAuthMetadata()
-      })
-    }
+    useTelemetry()?.trackAuth({
+      method: 'email',
+      is_new_user: false,
+      user_id: result.user.uid,
+      email: result.user.email ?? undefined,
+      ...getShareAuthMetadata()
+    })
 
     return result
   }
@@ -384,15 +382,13 @@ export const useAuthStore = defineStore('auth', () => {
       { createCustomer: true }
     )
 
-    if (isCloud) {
-      useTelemetry()?.trackAuth({
-        method: 'email',
-        is_new_user: true,
-        user_id: result.user.uid,
-        email: result.user.email ?? undefined,
-        ...getShareAuthMetadata()
-      })
-    }
+    useTelemetry()?.trackAuth({
+      method: 'email',
+      is_new_user: true,
+      user_id: result.user.uid,
+      email: result.user.email ?? undefined,
+      ...getShareAuthMetadata()
+    })
 
     return result
   }
@@ -405,17 +401,14 @@ export const useAuthStore = defineStore('auth', () => {
       { createCustomer: true }
     )
 
-    if (isCloud) {
-      const additionalUserInfo = getAdditionalUserInfo(result)
-      useTelemetry()?.trackAuth({
-        method: 'google',
-        is_new_user:
-          options?.isNewUser || additionalUserInfo?.isNewUser || false,
-        user_id: result.user.uid,
-        email: result.user.email ?? undefined,
-        ...getShareAuthMetadata()
-      })
-    }
+    const additionalUserInfo = getAdditionalUserInfo(result)
+    useTelemetry()?.trackAuth({
+      method: 'google',
+      is_new_user: options?.isNewUser || additionalUserInfo?.isNewUser || false,
+      user_id: result.user.uid,
+      email: result.user.email ?? undefined,
+      ...getShareAuthMetadata()
+    })
 
     return result
   }
@@ -428,17 +421,14 @@ export const useAuthStore = defineStore('auth', () => {
       { createCustomer: true }
     )
 
-    if (isCloud) {
-      const additionalUserInfo = getAdditionalUserInfo(result)
-      useTelemetry()?.trackAuth({
-        method: 'github',
-        is_new_user:
-          options?.isNewUser || additionalUserInfo?.isNewUser || false,
-        user_id: result.user.uid,
-        email: result.user.email ?? undefined,
-        ...getShareAuthMetadata()
-      })
-    }
+    const additionalUserInfo = getAdditionalUserInfo(result)
+    useTelemetry()?.trackAuth({
+      method: 'github',
+      is_new_user: options?.isNewUser || additionalUserInfo?.isNewUser || false,
+      user_id: result.user.uid,
+      email: result.user.email ?? undefined,
+      ...getShareAuthMetadata()
+    })
 
     return result
   }
diff --git a/src/stores/executionErrorStore.test.ts b/src/stores/executionErrorStore.test.ts
index c793510425..39af439330 100644
--- a/src/stores/executionErrorStore.test.ts
+++ b/src/stores/executionErrorStore.test.ts
@@ -3,6 +3,7 @@ import { createPinia, setActivePinia } from 'pinia'
 import { beforeEach, describe, expect, it, vi } from 'vitest'
 
 import type { MissingNodeType } from '@/types/comfy'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
 
 // Mock dependencies
 vi.mock('@/i18n', () => ({
@@ -47,7 +48,7 @@ describe('executionErrorStore — node error operations', () => {
       const store = useExecutionErrorStore()
       store.lastNodeErrors = null
       // Should not error
-      store.clearSimpleNodeErrors('123', 'widgetName')
+      store.clearSimpleNodeErrors(createNodeExecutionId([123]), 'widgetName')
       expect(store.lastNodeErrors).toBeNull()
     })
 
@@ -68,7 +69,7 @@ describe('executionErrorStore — node error operations', () => {
         }
       }
 
-      store.clearSimpleNodeErrors('123', 'testSlot')
+      store.clearSimpleNodeErrors(createNodeExecutionId([123]), 'testSlot')
 
       // Should be entirely removed (empty object becomes null)
       expect(store.lastNodeErrors).toBeNull()
@@ -97,7 +98,7 @@ describe('executionErrorStore — node error operations', () => {
         }
       }
 
-      store.clearSimpleNodeErrors('123', 'testSlot')
+      store.clearSimpleNodeErrors(createNodeExecutionId([123]), 'testSlot')
 
       // otherSlot error should still exist
       expect(store.lastNodeErrors).not.toBeNull()
@@ -124,7 +125,7 @@ describe('executionErrorStore — node error operations', () => {
         }
       }
 
-      store.clearSimpleNodeErrors('999', 'testSlot')
+      store.clearSimpleNodeErrors(createNodeExecutionId([999]), 'testSlot')
 
       // Original error should remain untouched
       expect(store.lastNodeErrors?.['123'].errors).toHaveLength(1)
@@ -153,7 +154,7 @@ describe('executionErrorStore — node error operations', () => {
         }
       }
 
-      store.clearSimpleNodeErrors('123', 'testSlot')
+      store.clearSimpleNodeErrors(createNodeExecutionId([123]), 'testSlot')
 
       // Mixed simple+complex: not all are simple, so none are cleared
       expect(store.lastNodeErrors?.['123'].errors).toHaveLength(2)
@@ -188,7 +189,7 @@ describe('executionErrorStore — node error operations', () => {
         }
       }
 
-      store.clearSimpleNodeErrors('123', 'steps')
+      store.clearSimpleNodeErrors(createNodeExecutionId([123]), 'steps')
 
       // Node 123 cleared, node 456 remains
       expect(store.lastNodeErrors?.['123']).toBeUndefined()
@@ -218,7 +219,7 @@ describe('executionErrorStore — node error operations', () => {
         }
       }
 
-      store.clearSimpleNodeErrors('123')
+      store.clearSimpleNodeErrors(createNodeExecutionId([123]))
 
       expect(store.lastNodeErrors).toBeNull()
     })
@@ -246,7 +247,7 @@ describe('executionErrorStore — node error operations', () => {
         }
       }
 
-      store.clearSimpleNodeErrors('123')
+      store.clearSimpleNodeErrors(createNodeExecutionId([123]))
 
       expect(store.lastNodeErrors?.['123'].errors).toHaveLength(2)
     })
@@ -268,7 +269,7 @@ describe('executionErrorStore — node error operations', () => {
         }
       }
 
-      store.clearSimpleNodeErrors('123', 'testSlot')
+      store.clearSimpleNodeErrors(createNodeExecutionId([123]), 'testSlot')
 
       // Error should remain
       expect(store.lastNodeErrors?.['123'].errors).toHaveLength(1)
@@ -294,9 +295,15 @@ describe('executionErrorStore — node error operations', () => {
       }
 
       // Valid value (5 < 10)
-      store.clearWidgetRelatedErrors('123', 'testWidget', 'testWidget', 5, {
-        max: 10
-      })
+      store.clearWidgetRelatedErrors(
+        createNodeExecutionId([123]),
+        'testWidget',
+        'testWidget',
+        5,
+        {
+          max: 10
+        }
+      )
 
       expect(store.lastNodeErrors).toBeNull()
     })
@@ -318,7 +325,12 @@ describe('executionErrorStore — node error operations', () => {
         }
       }
 
-      store.clearWidgetRelatedErrors('123', 'sampler', 'sampler', 'euler_a')
+      store.clearWidgetRelatedErrors(
+        createNodeExecutionId([123]),
+        'sampler',
+        'sampler',
+        'euler_a'
+      )
 
       expect(store.lastNodeErrors).toBeNull()
     })
@@ -341,9 +353,15 @@ describe('executionErrorStore — node error operations', () => {
       }
 
       // Invalid value (15 > 10)
-      store.clearWidgetRelatedErrors('123', 'testWidget', 'testWidget', 15, {
-        max: 10
-      })
+      store.clearWidgetRelatedErrors(
+        createNodeExecutionId([123]),
+        'testWidget',
+        'testWidget',
+        15,
+        {
+          max: 10
+        }
+      )
 
       expect(store.lastNodeErrors).not.toBeNull()
       expect(store.lastNodeErrors?.['123'].errors).toHaveLength(1)
diff --git a/src/stores/executionErrorStore.ts b/src/stores/executionErrorStore.ts
index 259542a9ab..99b149479a 100644
--- a/src/stores/executionErrorStore.ts
+++ b/src/stores/executionErrorStore.ts
@@ -84,7 +84,10 @@ export const useExecutionErrorStore = defineStore('executionError', () => {
    * Removes a node's errors if they consist entirely of simple, auto-resolvable
    * types. When `slotName` is provided, only errors for that slot are checked.
    */
-  function clearSimpleNodeErrors(executionId: string, slotName?: string): void {
+  function clearSimpleNodeErrors(
+    executionId: NodeExecutionId,
+    slotName?: string
+  ): void {
     if (!lastNodeErrors.value) return
     const nodeError = lastNodeErrors.value[executionId]
     if (!nodeError) return
@@ -131,7 +134,7 @@ export const useExecutionErrorStore = defineStore('executionError', () => {
    * (asset system vs objectInfo) making runtime validation non-trivial.
    */
   function clearSlotErrorsWithRangeCheck(
-    executionId: string,
+    executionId: NodeExecutionId,
     widgetName: string,
     newValue: unknown,
     options?: { min?: number; max?: number }
@@ -157,7 +160,7 @@ export const useExecutionErrorStore = defineStore('executionError', () => {
    *   At the legacy canvas call site both names are identical (`widget.name`).
    */
   function clearWidgetRelatedErrors(
-    executionId: string,
+    executionId: NodeExecutionId,
     errorInputName: string,
     widgetName: string,
     newValue: unknown,
diff --git a/src/stores/executionStore.test.ts b/src/stores/executionStore.test.ts
index ea66782682..9ca8383d71 100644
--- a/src/stores/executionStore.test.ts
+++ b/src/stores/executionStore.test.ts
@@ -6,6 +6,7 @@ import { app } from '@/scripts/app'
 import { MAX_PROGRESS_JOBS, useExecutionStore } from '@/stores/executionStore'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
 import { useMissingNodesErrorStore } from '@/platform/nodeReplacement/missingNodesErrorStore'
+import { createNodeLocatorId } from '@/types/nodeIdentification'
 import { executionIdToNodeLocatorId } from '@/utils/graphTraversalUtil'
 import type * as DistributionTypes from '@/platform/distribution/types'
 import type { LGraphCanvas } from '@/lib/litegraph/src/LGraphCanvas'
@@ -13,9 +14,9 @@ import type * as WorkflowStoreModule from '@/platform/workflow/management/stores
 import type { NodeProgressState } from '@/schemas/apiSchema'
 
 const {
-  mockNodeExecutionIdToNodeLocatorId,
   mockNodeIdToNodeLocatorId,
   mockNodeLocatorIdToNodeExecutionId,
+  mockExecutionIdToCurrentId,
   mockActiveWorkflow,
   mockOpenWorkflows,
   mockShowTextPreview,
@@ -25,9 +26,9 @@ const {
 } = await vi.hoisted(async () => {
   const { shallowRef } = await import('vue')
   return {
-    mockNodeExecutionIdToNodeLocatorId: vi.fn(),
     mockNodeIdToNodeLocatorId: vi.fn(),
     mockNodeLocatorIdToNodeExecutionId: vi.fn(),
+    mockExecutionIdToCurrentId: vi.fn(),
     mockActiveWorkflow: shallowRef<{ path?: string } | null>(null),
     mockOpenWorkflows: shallowRef<{ path: string }[]>([]),
     mockShowTextPreview: vi.fn(),
@@ -65,9 +66,9 @@ vi.mock('@/platform/workflow/management/stores/workflowStore', async () => {
   return {
     ComfyWorkflow,
     useWorkflowStore: vi.fn(() => ({
-      nodeExecutionIdToNodeLocatorId: mockNodeExecutionIdToNodeLocatorId,
       nodeIdToNodeLocatorId: mockNodeIdToNodeLocatorId,
       nodeLocatorIdToNodeExecutionId: mockNodeLocatorIdToNodeExecutionId,
+      executionIdToCurrentId: mockExecutionIdToCurrentId,
       get activeWorkflow() {
         return mockActiveWorkflow.value
       },
@@ -180,9 +181,9 @@ describe('useExecutionStore - NodeLocatorId conversions', () => {
   beforeEach(() => {
     vi.clearAllMocks()
     // Reset mock implementations
-    mockNodeExecutionIdToNodeLocatorId.mockReset()
     mockNodeIdToNodeLocatorId.mockReset()
     mockNodeLocatorIdToNodeExecutionId.mockReset()
+    mockExecutionIdToCurrentId.mockReset()
 
     setActivePinia(createTestingPinia({ stubActions: false }))
     store = useExecutionStore()
@@ -235,23 +236,24 @@ describe('useExecutionStore - NodeLocatorId conversions', () => {
 
   describe('nodeLocatorIdToExecutionId', () => {
     it('should convert NodeLocatorId to execution ID', () => {
+      const locatorId = createNodeLocatorId(
+        'a1b2c3d4-e5f6-7890-abcd-ef1234567890',
+        456
+      )
       const mockExecutionId = '123:456'
       mockNodeLocatorIdToNodeExecutionId.mockReturnValue(mockExecutionId)
 
-      const result = store.nodeLocatorIdToExecutionId(
-        'a1b2c3d4-e5f6-7890-abcd-ef1234567890:456'
-      )
+      const result = store.nodeLocatorIdToExecutionId(locatorId)
 
-      expect(mockNodeLocatorIdToNodeExecutionId).toHaveBeenCalledWith(
-        'a1b2c3d4-e5f6-7890-abcd-ef1234567890:456'
-      )
+      expect(mockNodeLocatorIdToNodeExecutionId).toHaveBeenCalledWith(locatorId)
       expect(result).toBe(mockExecutionId)
     })
 
     it('should return null when conversion fails', () => {
+      const locatorId = createNodeLocatorId('unknown-subgraph-id', 456)
       mockNodeLocatorIdToNodeExecutionId.mockReturnValue(null)
 
-      const result = store.nodeLocatorIdToExecutionId('invalid:format')
+      const result = store.nodeLocatorIdToExecutionId(locatorId)
 
       expect(result).toBeNull()
     })
@@ -263,9 +265,9 @@ describe('useExecutionStore - nodeLocationProgressStates caching', () => {
 
   beforeEach(() => {
     vi.clearAllMocks()
-    mockNodeExecutionIdToNodeLocatorId.mockReset()
     mockNodeIdToNodeLocatorId.mockReset()
     mockNodeLocatorIdToNodeExecutionId.mockReset()
+    mockExecutionIdToCurrentId.mockReset()
 
     setActivePinia(createTestingPinia({ stubActions: false }))
     store = useExecutionStore()
@@ -296,8 +298,10 @@ describe('useExecutionStore - nodeLocationProgressStates caching', () => {
 
     const result = store.nodeLocationProgressStates
 
-    expect(result['123']).toBeDefined()
-    expect(result['a1b2c3d4-e5f6-7890-abcd-ef1234567890:456']).toBeDefined()
+    expect(result[createNodeLocatorId(null, 123)]).toBeDefined()
+    expect(
+      result[createNodeLocatorId('a1b2c3d4-e5f6-7890-abcd-ef1234567890', 456)]
+    ).toBeDefined()
   })
 
   it('should not re-traverse graph for same execution IDs across progress updates', () => {
@@ -324,7 +328,9 @@ describe('useExecutionStore - nodeLocationProgressStates caching', () => {
     }
 
     // First evaluation triggers graph traversal
-    expect(store.nodeLocationProgressStates['123']).toBeDefined()
+    expect(
+      store.nodeLocationProgressStates[createNodeLocatorId(null, 123)]
+    ).toBeDefined()
     const callCountAfterFirst = vi.mocked(app.rootGraph.getNodeById).mock.calls
       .length
 
@@ -340,7 +346,9 @@ describe('useExecutionStore - nodeLocationProgressStates caching', () => {
       }
     }
 
-    expect(store.nodeLocationProgressStates['123']).toBeDefined()
+    expect(
+      store.nodeLocationProgressStates[createNodeLocatorId(null, 123)]
+    ).toBeDefined()
 
     // getNodeById should NOT be called again for the same execution ID
     expect(vi.mocked(app.rootGraph.getNodeById).mock.calls.length).toBe(
@@ -383,12 +391,16 @@ describe('useExecutionStore - nodeLocationProgressStates caching', () => {
     const result = store.nodeLocationProgressStates
 
     // Both sibling nodes should be resolved with the correct subgraph UUID
-    expect(result['a1b2c3d4-e5f6-7890-abcd-ef1234567890:456']).toBeDefined()
-    expect(result['a1b2c3d4-e5f6-7890-abcd-ef1234567890:789']).toBeDefined()
+    expect(
+      result[createNodeLocatorId('a1b2c3d4-e5f6-7890-abcd-ef1234567890', 456)]
+    ).toBeDefined()
+    expect(
+      result[createNodeLocatorId('a1b2c3d4-e5f6-7890-abcd-ef1234567890', 789)]
+    ).toBeDefined()
 
     // The shared parent "123" should also have a merged state
-    expect(result['123']).toBeDefined()
-    expect(result['123'].state).toBe('running')
+    expect(result[createNodeLocatorId(null, 123)]).toBeDefined()
+    expect(result[createNodeLocatorId(null, 123)].state).toBe('running')
   })
 })
 
@@ -867,6 +879,21 @@ describe('useExecutionStore - progress_text startup guard', () => {
 
     expect(mockShowTextPreview).toHaveBeenCalledWith(mockNode, 'warming up')
   })
+  it('should ignore nested progress_text when the execution ID cannot be mapped', async () => {
+    const { useCanvasStore } =
+      await import('@/renderer/core/canvas/canvasStore')
+    useCanvasStore().canvas = {
+      graph: { getNodeById: vi.fn() }
+    } as unknown as LGraphCanvas
+    mockExecutionIdToCurrentId.mockReturnValue(undefined)
+
+    expect(() =>
+      fireProgressText({ nodeId: '1:2', text: 'warming up' })
+    ).not.toThrow()
+
+    expect(mockExecutionIdToCurrentId).toHaveBeenCalledWith('1:2')
+    expect(mockShowTextPreview).not.toHaveBeenCalled()
+  })
 })
 
 describe('useExecutionErrorStore - Node Error Lookups', () => {
@@ -880,7 +907,7 @@ describe('useExecutionErrorStore - Node Error Lookups', () => {
 
   describe('getNodeErrors', () => {
     it('should return undefined when no errors exist', () => {
-      const result = store.getNodeErrors('123')
+      const result = store.getNodeErrors(createNodeLocatorId(null, 123))
       expect(result).toBeUndefined()
     })
 
@@ -900,7 +927,7 @@ describe('useExecutionErrorStore - Node Error Lookups', () => {
         }
       }
 
-      const result = store.getNodeErrors('123')
+      const result = store.getNodeErrors(createNodeLocatorId(null, 123))
       expect(result).toBeDefined()
       expect(result?.errors).toHaveLength(1)
       expect(result?.errors[0].message).toBe('Invalid input')
@@ -937,7 +964,7 @@ describe('useExecutionErrorStore - Node Error Lookups', () => {
         }
       }
 
-      const locatorId = `${subgraphUuid}:456`
+      const locatorId = createNodeLocatorId(subgraphUuid, 456)
       const result = store.getNodeErrors(locatorId)
       expect(result).toBeDefined()
       expect(result?.errors[0].message).toBe('Invalid subgraph input')
@@ -946,7 +973,7 @@ describe('useExecutionErrorStore - Node Error Lookups', () => {
 
   describe('slotHasError', () => {
     it('should return false when node has no errors', () => {
-      const result = store.slotHasError('123', 'width')
+      const result = store.slotHasError(createNodeLocatorId(null, 123), 'width')
       expect(result).toBe(false)
     })
 
@@ -966,7 +993,10 @@ describe('useExecutionErrorStore - Node Error Lookups', () => {
         }
       }
 
-      const result = store.slotHasError('123', 'height')
+      const result = store.slotHasError(
+        createNodeLocatorId(null, 123),
+        'height'
+      )
       expect(result).toBe(false)
     })
 
@@ -986,7 +1016,7 @@ describe('useExecutionErrorStore - Node Error Lookups', () => {
         }
       }
 
-      const result = store.slotHasError('123', 'width')
+      const result = store.slotHasError(createNodeLocatorId(null, 123), 'width')
       expect(result).toBe(true)
     })
 
@@ -1012,7 +1042,7 @@ describe('useExecutionErrorStore - Node Error Lookups', () => {
         }
       }
 
-      const result = store.slotHasError('123', 'width')
+      const result = store.slotHasError(createNodeLocatorId(null, 123), 'width')
       expect(result).toBe(true)
     })
 
@@ -1031,7 +1061,7 @@ describe('useExecutionErrorStore - Node Error Lookups', () => {
         }
       }
 
-      const result = store.slotHasError('123', 'width')
+      const result = store.slotHasError(createNodeLocatorId(null, 123), 'width')
       expect(result).toBe(false)
     })
   })
diff --git a/src/stores/executionStore.ts b/src/stores/executionStore.ts
index 2a5dd764d9..1339a8d56d 100644
--- a/src/stores/executionStore.ts
+++ b/src/stores/executionStore.ts
@@ -33,6 +33,7 @@ import { app } from '@/scripts/app'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
 import { useJobPreviewStore } from '@/stores/jobPreviewStore'
 import { useExecutionErrorStore } from '@/stores/executionErrorStore'
+import { tryNormalizeNodeExecutionId } from '@/types/nodeIdentification'
 import type { NodeLocatorId } from '@/types/nodeIdentification'
 import { classifyCloudValidationError } from '@/utils/executionErrorUtil'
 import { executionIdToNodeLocatorId } from '@/utils/graphTraversalUtil'
@@ -487,7 +488,8 @@ export const useExecutionStore = defineStore('execution', () => {
         // here intentionally. That way, we don't clear the preview every time a new node
         // within an expanded graph starts executing.
         const { revokePreviewsByExecutionId } = useNodeOutputStore()
-        revokePreviewsByExecutionId(nodeId)
+        const executionId = tryNormalizeNodeExecutionId(nodeId)
+        if (executionId) revokePreviewsByExecutionId(executionId)
       }
     }
 
@@ -788,7 +790,7 @@ export const useExecutionStore = defineStore('execution', () => {
    * @returns The execution ID or null if conversion fails
    */
   const nodeLocatorIdToExecutionId = (
-    locatorId: NodeLocatorId | string
+    locatorId: NodeLocatorId
   ): string | null => {
     const executionId = workflowStore.nodeLocatorIdToNodeExecutionId(locatorId)
     return executionId
diff --git a/src/stores/nodeOutputStore.test.ts b/src/stores/nodeOutputStore.test.ts
index 80cb5b2c68..6c47d443e0 100644
--- a/src/stores/nodeOutputStore.test.ts
+++ b/src/stores/nodeOutputStore.test.ts
@@ -8,6 +8,7 @@ import { LiteGraph } from '@/lib/litegraph/src/litegraph'
 import type { ExecutedWsMessage } from '@/schemas/apiSchema'
 import { app } from '@/scripts/app'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
+import { createNodeExecutionId } from '@/types/nodeIdentification'
 import * as litegraphUtil from '@/utils/litegraphUtil'
 
 const mockResolveNode = vi.fn()
@@ -66,11 +67,21 @@ describe('nodeOutputStore setNodeOutputsByExecutionId with merge', () => {
     const firstOutput = createMockOutputs([{ filename: 'first.png' }])
     const secondOutput = createMockOutputs([{ filename: 'second.png' }])
 
-    store.setNodeOutputsByExecutionId('11:20:10', firstOutput)
-    store.setNodeOutputsByExecutionId('12:20:10', secondOutput)
+    store.setNodeOutputsByExecutionId(
+      createNodeExecutionId([11, 20, 10]),
+      firstOutput
+    )
+    store.setNodeOutputsByExecutionId(
+      createNodeExecutionId([12, 20, 10]),
+      secondOutput
+    )
 
-    expect(store.getNodeOutputByExecutionId('11:20:10')).toEqual(firstOutput)
-    expect(store.getNodeOutputByExecutionId('12:20:10')).toEqual(secondOutput)
+    expect(
+      store.getNodeOutputByExecutionId(createNodeExecutionId([11, 20, 10]))
+    ).toEqual(firstOutput)
+    expect(
+      store.getNodeOutputByExecutionId(createNodeExecutionId([12, 20, 10]))
+    ).toEqual(secondOutput)
   })
 
   it('merges execution-keyed outputs when merge is true', () => {
@@ -78,32 +89,49 @@ describe('nodeOutputStore setNodeOutputsByExecutionId with merge', () => {
     const initialOutput = createMockOutputs([{ filename: 'first.png' }])
     const nextOutput = createMockOutputs([{ filename: 'second.png' }])
 
-    store.setNodeOutputsByExecutionId('11:20:10', initialOutput)
-    store.setNodeOutputsByExecutionId('11:20:10', nextOutput, { merge: true })
+    store.setNodeOutputsByExecutionId(
+      createNodeExecutionId([11, 20, 10]),
+      initialOutput
+    )
+    store.setNodeOutputsByExecutionId(
+      createNodeExecutionId([11, 20, 10]),
+      nextOutput,
+      {
+        merge: true
+      }
+    )
 
-    expect(store.getNodeOutputByExecutionId('11:20:10')?.images).toEqual([
-      { filename: 'first.png' },
-      { filename: 'second.png' }
-    ])
+    expect(
+      store.getNodeOutputByExecutionId(createNodeExecutionId([11, 20, 10]))
+        ?.images
+    ).toEqual([{ filename: 'first.png' }, { filename: 'second.png' }])
   })
 
   it('keeps execution-keyed previews distinct from locator-keyed previews', () => {
     const store = useNodeOutputStore()
 
-    store.setNodePreviewsByExecutionId('11:20:10', ['blob:first'])
-    store.setNodePreviewsByExecutionId('12:20:10', ['blob:second'])
-
-    expect(store.getNodePreviewImagesByExecutionId('11:20:10')).toEqual([
+    store.setNodePreviewsByExecutionId(createNodeExecutionId([11, 20, 10]), [
       'blob:first'
     ])
-    expect(store.getNodePreviewImagesByExecutionId('12:20:10')).toEqual([
+    store.setNodePreviewsByExecutionId(createNodeExecutionId([12, 20, 10]), [
       'blob:second'
     ])
+
+    expect(
+      store.getNodePreviewImagesByExecutionId(
+        createNodeExecutionId([11, 20, 10])
+      )
+    ).toEqual(['blob:first'])
+    expect(
+      store.getNodePreviewImagesByExecutionId(
+        createNodeExecutionId([12, 20, 10])
+      )
+    ).toEqual(['blob:second'])
   })
 
   it('should update reactive nodeOutputs.value when merging outputs', () => {
     const store = useNodeOutputStore()
-    const executionId = '1'
+    const executionId = createNodeExecutionId([1])
 
     const initialOutput = createMockOutputs([{ filename: 'a.png' }])
     store.setNodeOutputsByExecutionId(executionId, initialOutput)
@@ -120,7 +148,7 @@ describe('nodeOutputStore setNodeOutputsByExecutionId with merge', () => {
 
   it('should assign to reactive ref after merge for Vue reactivity', () => {
     const store = useNodeOutputStore()
-    const executionId = '1'
+    const executionId = createNodeExecutionId([1])
 
     const initialOutput = createMockOutputs([{ filename: 'a.png' }])
     store.setNodeOutputsByExecutionId(executionId, initialOutput)
@@ -137,7 +165,7 @@ describe('nodeOutputStore setNodeOutputsByExecutionId with merge', () => {
 
   it('should create a new object reference on merge so Vue detects the change', () => {
     const store = useNodeOutputStore()
-    const executionId = '1'
+    const executionId = createNodeExecutionId([1])
 
     const initialOutput = createMockOutputs([{ filename: 'a.png' }])
     store.setNodeOutputsByExecutionId(executionId, initialOutput)
@@ -184,7 +212,7 @@ describe('nodeOutputStore restoreOutputs', () => {
     const widgetOutput = createMockOutputs([
       { filename: 'example.png', subfolder: '', type: 'input' }
     ])
-    store.setNodeOutputsByExecutionId('3', widgetOutput)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([3]), widgetOutput)
 
     // The reactive store must reflect the new output.
     // Before the fix, the raw write to app.nodeOutputs would mutate the
@@ -205,7 +233,7 @@ describe('nodeOutputStore input preview preservation', () => {
 
   it('should preserve input preview when execution sends empty output', () => {
     const store = useNodeOutputStore()
-    const executionId = '3'
+    const executionId = createNodeExecutionId([3])
 
     const inputPreview = createMockOutputs([
       { filename: 'example.png', subfolder: '', type: 'input' }
@@ -225,7 +253,7 @@ describe('nodeOutputStore input preview preservation', () => {
 
   it('should preserve input preview when execution sends output with empty images array', () => {
     const store = useNodeOutputStore()
-    const executionId = '3'
+    const executionId = createNodeExecutionId([3])
 
     const inputPreview = createMockOutputs([
       { filename: 'example.png', subfolder: '', type: 'input' }
@@ -241,7 +269,7 @@ describe('nodeOutputStore input preview preservation', () => {
 
   it('should allow execution output with images to overwrite input preview', () => {
     const store = useNodeOutputStore()
-    const executionId = '3'
+    const executionId = createNodeExecutionId([3])
 
     const inputPreview = createMockOutputs([
       { filename: 'example.png', subfolder: '', type: 'input' }
@@ -261,7 +289,7 @@ describe('nodeOutputStore input preview preservation', () => {
 
   it('should not preserve non-input outputs from being overwritten', () => {
     const store = useNodeOutputStore()
-    const executionId = '4'
+    const executionId = createNodeExecutionId([4])
 
     const tempOutput = createMockOutputs([
       { filename: 'temp.png', subfolder: '', type: 'temp' }
@@ -276,7 +304,7 @@ describe('nodeOutputStore input preview preservation', () => {
 
   it('should pass through non-image fields while preserving input preview images', () => {
     const store = useNodeOutputStore()
-    const executionId = '5'
+    const executionId = createNodeExecutionId([5])
 
     const inputPreview = createMockOutputs([
       { filename: 'example.png', subfolder: '', type: 'input' }
@@ -392,12 +420,12 @@ describe('nodeOutputStore snapshotOutputs / restoreOutputs', () => {
     const inputOutput = createMockOutputs([
       { filename: 'example.png', subfolder: '', type: 'input' }
     ])
-    store.setNodeOutputsByExecutionId('3', inputOutput)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([3]), inputOutput)
 
     const execOutput = createMockOutputs([
       { filename: 'ComfyUI_00001.png', subfolder: '', type: 'temp' }
     ])
-    store.setNodeOutputsByExecutionId('4', execOutput)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([4]), execOutput)
 
     // Snapshot
     const snapshot = store.snapshotOutputs()
@@ -426,8 +454,8 @@ describe('nodeOutputStore snapshotOutputs / restoreOutputs', () => {
     const outputA2 = createMockOutputs([
       { filename: 'example.png', subfolder: '', type: 'input' }
     ])
-    store.setNodeOutputsByExecutionId('1', outputA1)
-    store.setNodeOutputsByExecutionId('3', outputA2)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([1]), outputA1)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([3]), outputA2)
 
     // --- Switch away: store() then clean ---
     const tabASnapshot = store.snapshotOutputs()
@@ -452,7 +480,7 @@ describe('nodeOutputStore snapshotOutputs / restoreOutputs', () => {
 
     // New execution should still work after restore
     const newOutput = createMockOutputs([{ filename: 'new.png' }])
-    store.setNodeOutputsByExecutionId('5', newOutput)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([5]), newOutput)
     expect(store.nodeOutputs['5']).toStrictEqual(newOutput)
   })
 
@@ -461,13 +489,13 @@ describe('nodeOutputStore snapshotOutputs / restoreOutputs', () => {
 
     // Tab A: execute
     const outputA = createMockOutputs([{ filename: 'tab_a.png' }])
-    store.setNodeOutputsByExecutionId('1', outputA)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([1]), outputA)
     const snapshotA = store.snapshotOutputs()
 
     // Switch to Tab B
     store.resetAllOutputsAndPreviews()
     const outputB = createMockOutputs([{ filename: 'tab_b.png' }])
-    store.setNodeOutputsByExecutionId('1', outputB)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([1]), outputB)
     const snapshotB = store.snapshotOutputs()
 
     // Switch back to Tab A
@@ -494,7 +522,7 @@ describe('nodeOutputStore snapshotOutputs / restoreOutputs', () => {
     const store = useNodeOutputStore()
 
     const output = createMockOutputs([{ filename: 'a.png' }])
-    store.setNodeOutputsByExecutionId('1', output)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([1]), output)
 
     const snapshot = store.snapshotOutputs()
 
@@ -521,15 +549,15 @@ describe('nodeOutputStore resetAllOutputsAndPreviews', () => {
     const store = useNodeOutputStore()
 
     store.setNodeOutputsByExecutionId(
-      '1',
+      createNodeExecutionId([1]),
       createMockOutputs([{ filename: 'a.png' }])
     )
     store.setNodeOutputsByExecutionId(
-      '2',
+      createNodeExecutionId([2]),
       createMockOutputs([{ filename: 'b.png' }])
     )
     store.setNodeOutputsByExecutionId(
-      '3',
+      createNodeExecutionId([3]),
       createMockOutputs([{ filename: 'c.png', type: 'input' }])
     )
 
@@ -570,7 +598,7 @@ describe('nodeOutputStore restoreOutputs + execution interaction', () => {
     const execOutput = createMockOutputs([
       { filename: 'ComfyUI_00001.png', subfolder: '', type: 'temp' }
     ])
-    store.setNodeOutputsByExecutionId('4', execOutput)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([4]), execOutput)
 
     // Both should be present
     expect(store.nodeOutputs['3']).toStrictEqual(inputOutput)
@@ -592,7 +620,7 @@ describe('nodeOutputStore restoreOutputs + execution interaction', () => {
     const execOutput = createMockOutputs([
       { filename: 'result.png', subfolder: '', type: 'temp' }
     ])
-    store.setNodeOutputsByExecutionId('3', execOutput)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([3]), execOutput)
 
     // On current main (without PR #9123 guard), execution overwrites
     expect(store.nodeOutputs['3']).toStrictEqual(execOutput)
@@ -615,13 +643,15 @@ describe('nodeOutputStore merge mode interactions', () => {
     const inputOutput = createMockOutputs([
       { filename: 'uploaded.png', subfolder: '', type: 'input' }
     ])
-    store.setNodeOutputsByExecutionId('3', inputOutput)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([3]), inputOutput)
 
     // Merge new execution images
     const execOutput = createMockOutputs([
       { filename: 'result.png', subfolder: '', type: 'temp' }
     ])
-    store.setNodeOutputsByExecutionId('3', execOutput, { merge: true })
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([3]), execOutput, {
+      merge: true
+    })
 
     // Should have both images concatenated
     expect(store.nodeOutputs['3']?.images).toHaveLength(2)
@@ -637,13 +667,15 @@ describe('nodeOutputStore merge mode interactions', () => {
     const inputOutput = createMockOutputs([
       { filename: 'uploaded.png', subfolder: '', type: 'input' }
     ])
-    store.setNodeOutputsByExecutionId('3', inputOutput)
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([3]), inputOutput)
 
     // Merge with empty images — the input-preview guard (lines 166-177)
     // copies existing input images into the incoming outputs before the
     // merge concat runs, resulting in duplication.
     const emptyOutput = createMockOutputs([])
-    store.setNodeOutputsByExecutionId('3', emptyOutput, { merge: true })
+    store.setNodeOutputsByExecutionId(createNodeExecutionId([3]), emptyOutput, {
+      merge: true
+    })
 
     expect(store.nodeOutputs['3']?.images).toHaveLength(2)
     expect(store.nodeOutputs['3']?.images?.[0]?.filename).toBe('uploaded.png')
diff --git a/src/stores/nodeOutputStore.ts b/src/stores/nodeOutputStore.ts
index f6a880209c..305b76cb97 100644
--- a/src/stores/nodeOutputStore.ts
+++ b/src/stores/nodeOutputStore.ts
@@ -14,7 +14,8 @@ import type {
 import { api } from '@/scripts/api'
 import { app } from '@/scripts/app'
 import { clone } from '@/scripts/utils'
-import type { NodeLocatorId } from '@/types/nodeIdentification'
+import { createNodeLocatorId } from '@/types/nodeIdentification'
+import type { NodeExecutionId, NodeLocatorId } from '@/types/nodeIdentification'
 import { parseFilePath } from '@/utils/formatUtil'
 import { executionIdToNodeLocatorId } from '@/utils/graphTraversalUtil'
 import {
@@ -127,7 +128,7 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => {
   }
 
   function getNodeOutputByExecutionId(
-    executionId: string
+    executionId: NodeExecutionId
   ): ExecutedWsMessage['output'] | undefined {
     const locatorId = executionIdToNodeLocatorId(app.rootGraph, executionId)
     if (!locatorId) return undefined
@@ -135,7 +136,7 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => {
   }
 
   function getNodePreviewImagesByExecutionId(
-    executionId: string
+    executionId: NodeExecutionId
   ): string[] | undefined {
     const locatorId = executionIdToNodeLocatorId(app.rootGraph, executionId)
     if (!locatorId) return undefined
@@ -143,7 +144,7 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => {
   }
 
   function getNodeImageUrlsByExecutionId(
-    executionId: string,
+    executionId: NodeExecutionId,
     node: LGraphNode
   ): string[] | undefined {
     const previews = getNodePreviewImagesByExecutionId(executionId)
@@ -188,7 +189,7 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => {
       if (existingOutput && outputs) {
         for (const k in outputs) {
           const existingValue = existingOutput[k]
-          const newValue = (outputs as Record<NodeLocatorId, unknown>)[k]
+          const newValue = (outputs as Record<string, unknown>)[k]
 
           if (Array.isArray(existingValue) && Array.isArray(newValue)) {
             existingOutput[k] = existingValue.concat(newValue)
@@ -232,7 +233,7 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => {
   }
 
   function setNodeOutputsByExecutionId(
-    executionId: string,
+    executionId: NodeExecutionId,
     outputs: ExecutedWsMessage['output'] | ResultItem,
     options: SetOutputOptions = {}
   ) {
@@ -242,7 +243,7 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => {
   }
 
   function setNodePreviewsByExecutionId(
-    executionId: string,
+    executionId: NodeExecutionId,
     previewImages: string[]
   ) {
     const nodeLocatorId = executionIdToNodeLocatorId(app.rootGraph, executionId)
@@ -279,7 +280,7 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => {
     setNodePreviewsByLocatorId(nodeIdToNodeLocatorId(nodeId), previewImages)
   }
 
-  function revokePreviewsByExecutionId(executionId: string) {
+  function revokePreviewsByExecutionId(executionId: NodeExecutionId) {
     const nodeLocatorId = executionIdToNodeLocatorId(app.rootGraph, executionId)
     if (!nodeLocatorId) return
     scheduleRevoke(nodeLocatorId, () =>
@@ -316,10 +317,13 @@ export const useNodeOutputStore = defineStore('nodeOutput', () => {
     const { graph } = subgraphNode
     if (!graph) return
 
-    const graphId = graph.isRootGraph ? '' : graph.id + ':'
-    revokePreviewsByLocatorId(graphId + subgraphNode.id)
+    revokePreviewsByLocatorId(
+      createNodeLocatorId(graph.isRootGraph ? null : graph.id, subgraphNode.id)
+    )
     for (const node of subgraphNode.subgraph.nodes) {
-      revokePreviewsByLocatorId(subgraphNode.subgraph.id + node.id)
+      revokePreviewsByLocatorId(
+        createNodeLocatorId(subgraphNode.subgraph.id, node.id)
+      )
     }
   }
 
diff --git a/src/stores/queueStore.ts b/src/stores/queueStore.ts
index d1a909fe09..d83ae684b2 100644
--- a/src/stores/queueStore.ts
+++ b/src/stores/queueStore.ts
@@ -21,6 +21,7 @@ import { useExtensionService } from '@/services/extensionService'
 import { getJobDetail } from '@/services/jobOutputCache'
 import { useNodeOutputStore } from '@/stores/nodeOutputStore'
 import { useExecutionStore } from '@/stores/executionStore'
+import { tryNormalizeNodeExecutionId } from '@/types/nodeIdentification'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import { getMediaTypeFromFilename } from '@/utils/formatUtil'
 
@@ -440,10 +441,12 @@ export class TaskItemImpl {
 
     const nodeOutputsStore = useNodeOutputStore()
     const rawOutputs = toRaw(outputsToLoad)
-    for (const nodeExecutionId in rawOutputs) {
+    for (const rawNodeExecutionId in rawOutputs) {
+      const nodeExecutionId = tryNormalizeNodeExecutionId(rawNodeExecutionId)
+      if (!nodeExecutionId) continue
       nodeOutputsStore.setNodeOutputsByExecutionId(
         nodeExecutionId,
-        rawOutputs[nodeExecutionId]
+        rawOutputs[rawNodeExecutionId]
       )
     }
     useExtensionService().invokeExtensions(
diff --git a/src/stores/workspace/favoritedWidgetsStore.ts b/src/stores/workspace/favoritedWidgetsStore.ts
index c852f2baaa..2c6c2f1e7d 100644
--- a/src/stores/workspace/favoritedWidgetsStore.ts
+++ b/src/stores/workspace/favoritedWidgetsStore.ts
@@ -6,6 +6,7 @@ import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets'
 import type { LGraphNode, NodeId } from '@/lib/litegraph/src/litegraph'
 import { app } from '@/scripts/app'
 import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
+import { isNodeLocatorId } from '@/types/nodeIdentification'
 import type { NodeLocatorId } from '@/types/nodeIdentification'
 import { getNodeByLocatorId } from '@/utils/graphTraversalUtil'
 import { resolveNodeDisplayName } from '@/utils/nodeTitleUtil'
@@ -84,14 +85,14 @@ export const useFavoritedWidgetsStore = defineStore('favoritedWidgets', () => {
   function parseFavoriteKey(key: string): FavoritedWidgetId | null {
     try {
       const [nodeLocatorId, widgetName] = JSON.parse(key) as [string, string]
-      if (!nodeLocatorId || !widgetName) return null
+      if (!isNodeLocatorId(nodeLocatorId) || !widgetName) return null
       return { nodeLocatorId, widgetName }
     } catch {
       const separatorIndex = key.indexOf(':')
       if (separatorIndex === -1) return null
       const nodeLocatorId = key.slice(0, separatorIndex)
       const widgetName = key.slice(separatorIndex + 1)
-      if (!nodeLocatorId || !widgetName) return null
+      if (!isNodeLocatorId(nodeLocatorId) || !widgetName) return null
       return { nodeLocatorId, widgetName }
     }
   }
@@ -102,8 +103,9 @@ export const useFavoritedWidgetsStore = defineStore('favoritedWidgets', () => {
     if (!id || !id.widgetName) return null
 
     if ('nodeLocatorId' in id && id.nodeLocatorId) {
+      if (!isNodeLocatorId(id.nodeLocatorId)) return null
       return {
-        nodeLocatorId: String(id.nodeLocatorId),
+        nodeLocatorId: id.nodeLocatorId,
         widgetName: String(id.widgetName)
       }
     }
diff --git a/src/storybook/mocks/useBillingContext.ts b/src/storybook/mocks/useBillingContext.ts
new file mode 100644
index 0000000000..e57a508217
--- /dev/null
+++ b/src/storybook/mocks/useBillingContext.ts
@@ -0,0 +1,50 @@
+import { computed, ref } from 'vue'
+
+import type { BillingContext } from '@/composables/billing/types'
+
+/**
+ * Storybook mock for `useBillingContext`.
+ *
+ * The real facade lazily instantiates the legacy billing adapter, which pulls
+ * in Firebase auth (`setPersistence`) and crashes in the Storybook environment
+ * (no Firebase). This static stub lets presentational billing components — e.g.
+ * UnifiedPricingTable — render against their `TIER_PRICING` / DES-197 fallbacks
+ * without any network or auth.
+ *
+ * Typed against `BillingContext` so the stub stays in lockstep with the real
+ * composable's return shape: drifted or removed keys fail to compile.
+ */
+export function useBillingContext(): BillingContext {
+  return {
+    type: computed(() => 'legacy' as const),
+    isInitialized: ref(true),
+    subscription: computed(() => null),
+    balance: computed(() => null),
+    plans: computed(() => []),
+    currentPlanSlug: computed(() => null),
+    teamCreditStops: computed(() => null),
+    currentTeamCreditStop: computed(() => null),
+    isLoading: ref(false),
+    error: ref<string | null>(null),
+    isActiveSubscription: computed(() => false),
+    isFreeTier: computed(() => false),
+    isLegacyTeamPlan: computed(() => false),
+    billingStatus: computed(() => null),
+    subscriptionStatus: computed(() => null),
+    tier: computed(() => null),
+    renewalDate: computed(() => null),
+    getMaxSeats: () => 1,
+    initialize: async () => {},
+    fetchStatus: async () => {},
+    fetchBalance: async () => {},
+    subscribe: async () => {},
+    previewSubscribe: async () => null,
+    manageSubscription: async () => {},
+    cancelSubscription: async () => {},
+    resubscribe: async () => {},
+    topup: async () => {},
+    fetchPlans: async () => {},
+    requireActiveSubscription: async () => {},
+    showSubscriptionDialog: () => {}
+  }
+}
diff --git a/src/types/boundingBoxes.ts b/src/types/boundingBoxes.ts
new file mode 100644
index 0000000000..e18e1b01d0
--- /dev/null
+++ b/src/types/boundingBoxes.ts
@@ -0,0 +1,16 @@
+type RegionType = 'obj' | 'text'
+
+export interface BoundingBoxMetadata {
+  type: RegionType
+  text: string
+  desc: string
+  palette: string[]
+}
+
+export interface BoundingBox {
+  x: number
+  y: number
+  width: number
+  height: number
+  metadata: BoundingBoxMetadata
+}
diff --git a/src/types/nodeIdentification.test.ts b/src/types/nodeIdentification.test.ts
index 20d0215414..13c7270213 100644
--- a/src/types/nodeIdentification.test.ts
+++ b/src/types/nodeIdentification.test.ts
@@ -10,15 +10,15 @@ import {
   isNodeExecutionId,
   isNodeLocatorId,
   parseNodeExecutionId,
-  parseNodeLocatorId
+  parseNodeLocatorId,
+  tryNormalizeNodeExecutionId
 } from '@/types/nodeIdentification'
-import type { NodeLocatorId } from '@/types/nodeIdentification'
 
 describe('nodeIdentification', () => {
   describe('NodeLocatorId', () => {
     const validUuid = 'a1b2c3d4-e5f6-7890-abcd-ef1234567890'
     const validNodeId = '123'
-    const validNodeLocatorId = `${validUuid}:${validNodeId}` as NodeLocatorId
+    const validNodeLocatorId = createNodeLocatorId(validUuid, validNodeId)
 
     describe('isNodeLocatorId', () => {
       it('should return true for valid NodeLocatorId', () => {
@@ -127,18 +127,35 @@ describe('nodeIdentification', () => {
         expect(isNodeExecutionId('123:456')).toBe(true)
         expect(isNodeExecutionId('123:456:789')).toBe(true)
         expect(isNodeExecutionId('node_1:node_2')).toBe(true)
+        expect(isNodeExecutionId('123')).toBe(true)
+        expect(isNodeExecutionId('node_1')).toBe(true)
       })
 
-      it('should return false for non-execution IDs', () => {
-        expect(isNodeExecutionId('123')).toBe(false)
-        expect(isNodeExecutionId('node_1')).toBe(false)
+      it('should return false for malformed execution IDs', () => {
         expect(isNodeExecutionId('')).toBe(false)
+        expect(isNodeExecutionId(':123')).toBe(false)
+        expect(isNodeExecutionId('123:')).toBe(false)
+        expect(isNodeExecutionId('123::456')).toBe(false)
         expect(isNodeExecutionId(123)).toBe(false)
         expect(isNodeExecutionId(null)).toBe(false)
         expect(isNodeExecutionId(undefined)).toBe(false)
       })
     })
 
+    describe('tryNormalizeNodeExecutionId', () => {
+      it('should return a branded ID for valid execution IDs', () => {
+        expect(tryNormalizeNodeExecutionId(123)).toBe('123')
+        expect(tryNormalizeNodeExecutionId('123:456')).toBe('123:456')
+      })
+
+      it('should return null for malformed execution IDs', () => {
+        expect(tryNormalizeNodeExecutionId('')).toBeNull()
+        expect(tryNormalizeNodeExecutionId(':123')).toBeNull()
+        expect(tryNormalizeNodeExecutionId('123:')).toBeNull()
+        expect(tryNormalizeNodeExecutionId('123::456')).toBeNull()
+      })
+    })
+
     describe('parseNodeExecutionId', () => {
       it('should parse execution IDs correctly', () => {
         expect(parseNodeExecutionId('123:456')).toEqual([123, 456])
@@ -152,11 +169,15 @@ describe('nodeIdentification', () => {
           'node_2',
           456
         ])
+        expect(parseNodeExecutionId('123')).toEqual([123])
+        expect(parseNodeExecutionId('node_1')).toEqual(['node_1'])
       })
 
-      it('should return null for non-execution IDs', () => {
-        expect(parseNodeExecutionId('123')).toBeNull()
+      it('should return null for malformed execution IDs', () => {
         expect(parseNodeExecutionId('')).toBeNull()
+        expect(parseNodeExecutionId(':123')).toBeNull()
+        expect(parseNodeExecutionId('123:')).toBeNull()
+        expect(parseNodeExecutionId('123::456')).toBeNull()
       })
     })
 
@@ -175,12 +196,19 @@ describe('nodeIdentification', () => {
       it('should handle single node ID', () => {
         const result = createNodeExecutionId([123])
         expect(result).toBe('123')
-        // Single node IDs are not execution IDs
-        expect(isNodeExecutionId(result)).toBe(false)
+        expect(isNodeExecutionId(result)).toBe(true)
       })
 
-      it('should handle empty array', () => {
-        expect(createNodeExecutionId([])).toBe('')
+      it('should reject an empty array', () => {
+        const emptyNodeIds = [] as NodeId[]
+        expect(() => createNodeExecutionId(emptyNodeIds)).toThrow(
+          'NodeExecutionId requires at least one node ID'
+        )
+      })
+
+      it('should preserve empty path segments', () => {
+        expect(createNodeExecutionId([''])).toBe('')
+        expect(createNodeExecutionId([123, ''])).toBe('123:')
       })
     })
   })
@@ -213,6 +241,10 @@ describe('nodeIdentification', () => {
       expect(getAncestorExecutionIds('65')).toEqual(['65'])
     })
 
+    it('returns an empty list for malformed execution IDs', () => {
+      expect(getAncestorExecutionIds('65::70')).toEqual([])
+    })
+
     it('returns all ancestors including self for nested IDs', () => {
       expect(getAncestorExecutionIds('65:70')).toEqual(['65', '65:70'])
       expect(getAncestorExecutionIds('65:70:63')).toEqual([
diff --git a/src/types/nodeIdentification.ts b/src/types/nodeIdentification.ts
index eb29525001..46e7f7affc 100644
--- a/src/types/nodeIdentification.ts
+++ b/src/types/nodeIdentification.ts
@@ -1,5 +1,7 @@
 import type { NodeId } from '@/platform/workflow/validation/schemas/workflowSchema'
 
+const NODE_EXECUTION_ID_PATTERN = /^[^:]+(?::[^:]+)*$/
+
 /**
  * A globally unique identifier for nodes that maintains consistency across
  * multiple instances of the same subgraph.
@@ -15,7 +17,7 @@ import type { NodeId } from '@/platform/workflow/validation/schemas/workflowSche
  * Unlike execution IDs which change based on the instance path,
  * NodeLocatorId remains the same for all instances of a particular node.
  */
-export type NodeLocatorId = string
+export type NodeLocatorId = string & { readonly __brand: 'NodeLocatorId' }
 
 /**
  * An execution identifier representing a node's position in nested subgraphs.
@@ -24,7 +26,17 @@ export type NodeLocatorId = string
  * Format: Colon-separated path of node IDs
  * Example: "123:456:789" (node 789 in subgraph 456 in subgraph 123)
  */
-export type NodeExecutionId = string
+export type NodeExecutionId = string & { readonly __brand: 'NodeExecutionId' }
+
+function parseNodeIdSegment(part: string): NodeId {
+  return isNaN(Number(part)) ? part : Number(part)
+}
+
+function nodeExecutionIdFromString(value: string): NodeExecutionId | null {
+  return NODE_EXECUTION_ID_PATTERN.test(value)
+    ? (value as NodeExecutionId)
+    : null
+}
 
 /**
  * Type guard to check if a value is a NodeLocatorId
@@ -55,9 +67,7 @@ export function isNodeLocatorId(value: unknown): value is NodeLocatorId {
  * Type guard to check if a value is a NodeExecutionId
  */
 export function isNodeExecutionId(value: unknown): value is NodeExecutionId {
-  if (typeof value !== 'string') return false
-  // Must contain at least one colon to be an execution ID
-  return value.includes(':')
+  return typeof value === 'string' && nodeExecutionIdFromString(value) !== null
 }
 
 /**
@@ -76,14 +86,14 @@ export function parseNodeLocatorId(
     // Simple node ID (root graph)
     return {
       subgraphUuid: null,
-      localNodeId: isNaN(Number(id)) ? id : Number(id)
+      localNodeId: parseNodeIdSegment(id)
     }
   }
 
   const [subgraphUuid, localNodeId] = parts
   return {
     subgraphUuid,
-    localNodeId: isNaN(Number(localNodeId)) ? localNodeId : Number(localNodeId)
+    localNodeId: parseNodeIdSegment(localNodeId)
   }
 }
 
@@ -94,10 +104,12 @@ export function parseNodeLocatorId(
  * @returns A properly formatted NodeLocatorId
  */
 export function createNodeLocatorId(
-  subgraphUuid: string,
+  subgraphUuid: string | null,
   localNodeId: NodeId
 ): NodeLocatorId {
-  return `${subgraphUuid}:${localNodeId}`
+  return (
+    subgraphUuid ? `${subgraphUuid}:${localNodeId}` : String(localNodeId)
+  ) as NodeLocatorId
 }
 
 /**
@@ -106,11 +118,10 @@ export function createNodeLocatorId(
  * @returns Array of node IDs from root to target, or null if not an execution ID
  */
 export function parseNodeExecutionId(id: string): NodeId[] | null {
-  if (!isNodeExecutionId(id)) return null
+  const executionId = tryNormalizeNodeExecutionId(id)
+  if (!executionId) return null
 
-  return id
-    .split(':')
-    .map((part) => (isNaN(Number(part)) ? part : Number(part)))
+  return executionId.split(':').map(parseNodeIdSegment)
 }
 
 /**
@@ -118,8 +129,26 @@ export function parseNodeExecutionId(id: string): NodeId[] | null {
  * @param nodeIds Array of node IDs from root to target
  * @returns A properly formatted NodeExecutionId
  */
-export function createNodeExecutionId(nodeIds: NodeId[]): NodeExecutionId {
-  return nodeIds.join(':')
+export function createNodeExecutionId<const T extends readonly NodeId[]>(
+  nodeIds: T & (T extends readonly [] ? never : unknown)
+): NodeExecutionId {
+  if (nodeIds.length === 0) {
+    throw new Error('NodeExecutionId requires at least one node ID')
+  }
+  return nodeIds.map(String).join(':') as NodeExecutionId
+}
+
+export function tryNormalizeNodeExecutionId(
+  value: string | number
+): NodeExecutionId | null {
+  return nodeExecutionIdFromString(String(value))
+}
+
+export function appendNodeExecutionId(
+  parentExecutionId: string,
+  childNodeId: NodeId
+): NodeExecutionId {
+  return createNodeExecutionId([...parentExecutionId.split(':'), childNodeId])
 }
 
 /**
@@ -128,11 +157,14 @@ export function createNodeExecutionId(nodeIds: NodeId[]): NodeExecutionId {
  * Example: "65:70:63" → ["65", "65:70", "65:70:63"]
  */
 export function getAncestorExecutionIds(
-  executionId: string | NodeExecutionId
+  executionId: string
 ): NodeExecutionId[] {
-  const parts = executionId.split(':')
+  const normalized = tryNormalizeNodeExecutionId(executionId)
+  if (!normalized) return []
+
+  const parts = normalized.split(':')
   return Array.from({ length: parts.length }, (_, i) =>
-    parts.slice(0, i + 1).join(':')
+    createNodeExecutionId(parts.slice(0, i + 1))
   )
 }
 
@@ -141,9 +173,7 @@ export function getAncestorExecutionIds(
  *
  * Example: "65:70:63" → ["65", "65:70"]
  */
-export function getParentExecutionIds(
-  executionId: string | NodeExecutionId
-): NodeExecutionId[] {
+export function getParentExecutionIds(executionId: string): NodeExecutionId[] {
   return getAncestorExecutionIds(executionId).slice(0, -1)
 }
 
diff --git a/src/types/simplifiedWidget.ts b/src/types/simplifiedWidget.ts
index fed470d65f..bbfa8d3933 100644
--- a/src/types/simplifiedWidget.ts
+++ b/src/types/simplifiedWidget.ts
@@ -4,6 +4,7 @@
  */
 import type { InputSpec as InputSpecV2 } from '@/schemas/nodeDef/nodeDefSchemaV2'
 import type { IWidgetOptions } from '@/lib/litegraph/src/types/widgets'
+import type { NodeLocatorId } from '@/types/nodeIdentification'
 
 /** Valid types for widget values */
 export type WidgetValue =
@@ -77,7 +78,7 @@ export interface SimplifiedWidget<
   serializeValue?: () => unknown
 
   /** NodeLocatorId for the node that owns this widget's execution outputs */
-  nodeLocatorId?: string
+  nodeLocatorId?: NodeLocatorId
 
   /** Optional input specification backing this widget */
   spec?: InputSpecV2
diff --git a/src/types/widgetId.ts b/src/types/widgetId.ts
index b8b1bd5bfd..f8af85598c 100644
--- a/src/types/widgetId.ts
+++ b/src/types/widgetId.ts
@@ -1,4 +1,4 @@
-type NodeId = number | string
+import type { NodeId } from '@/platform/workflow/validation/schemas/workflowSchema'
 type UUID = string
 
 export type WidgetId = string & { readonly __brand: 'WidgetId' }
diff --git a/src/utils/colorUtil.test.ts b/src/utils/colorUtil.test.ts
index c1a3746124..ca98cbe301 100644
--- a/src/utils/colorUtil.test.ts
+++ b/src/utils/colorUtil.test.ts
@@ -9,8 +9,11 @@ import {
   hsbToRgb,
   hsvaToHex,
   isTransparent,
+  luminance,
   parseToRgb,
+  readableTextColor,
   rgbToHex,
+  textOnColor,
   toHexFromFormat
 } from '@/utils/colorUtil'
 
@@ -284,6 +287,28 @@ describe('colorUtil conversions', () => {
       expect(toHexFromFormat('abcdef', 'hex')).toBe('#abcdef')
     })
   })
+
+  describe('luminance', () => {
+    it('computes perceptual luminance', () => {
+      expect(luminance({ r: 255, g: 0, b: 0 })).toBeCloseTo(76.245, 2)
+      expect(luminance({ r: 255, g: 255, b: 255 })).toBeCloseTo(255, 2)
+    })
+  })
+
+  describe('readableTextColor / textOnColor', () => {
+    it('lightens dark colors', () => {
+      expect(readableTextColor('#000000')).not.toBe('rgb(0,0,0)')
+    })
+
+    it('leaves already-light colors unchanged', () => {
+      expect(readableTextColor('#ffffff')).toBe('rgb(255,255,255)')
+    })
+
+    it('flips text color for contrast', () => {
+      expect(textOnColor('#ffffff')).toBe('#000')
+      expect(textOnColor('#000000')).toBe('#fff')
+    })
+  })
 })
 describe('colorUtil - adjustColor', () => {
   const runAdjustColorTests = (
diff --git a/src/utils/colorUtil.ts b/src/utils/colorUtil.ts
index 15b9db272a..8d07a3154e 100644
--- a/src/utils/colorUtil.ts
+++ b/src/utils/colorUtil.ts
@@ -95,6 +95,28 @@ export function rgbToHex({ r, g, b }: RGB): string {
   return `#${toHex(r)}${toHex(g)}${toHex(b)}`
 }
 
+export function luminance({ r, g, b }: RGB): number {
+  return 0.299 * r + 0.587 * g + 0.114 * b
+}
+
+export function readableTextColor(hex: string): string {
+  const rgb = hexToRgb(hex)
+  let { r, g, b } = rgb
+  const lum = luminance(rgb)
+  const MIN = 130
+  if (lum < MIN) {
+    const t = (MIN - lum) / (255 - lum)
+    r = Math.round(r + (255 - r) * t)
+    g = Math.round(g + (255 - g) * t)
+    b = Math.round(b + (255 - b) * t)
+  }
+  return `rgb(${r},${g},${b})`
+}
+
+export function textOnColor(hex: string): string {
+  return luminance(hexToRgb(hex)) > 140 ? '#000' : '#fff'
+}
+
 export function hsbToRgb({ h, s, b }: HSB): RGB {
   // Normalize
   const hh = ((h % 360) + 360) % 360
diff --git a/src/utils/graphTraversalUtil.ts b/src/utils/graphTraversalUtil.ts
index c9167bdebf..90422494a6 100644
--- a/src/utils/graphTraversalUtil.ts
+++ b/src/utils/graphTraversalUtil.ts
@@ -6,6 +6,7 @@ import type {
 import { LGraphEventMode } from '@/lib/litegraph/src/types/globalEnums'
 import type { NodeExecutionId, NodeLocatorId } from '@/types/nodeIdentification'
 import {
+  createNodeExecutionId,
   createNodeLocatorId,
   getParentExecutionIds,
   parseNodeLocatorId
@@ -22,10 +23,8 @@ import { isSubgraphIoNode } from './typeGuardUtil'
 export function getLocatorIdFromNodeData(nodeData: {
   id: string | number
   subgraphId?: string | null
-}): string {
-  return nodeData.subgraphId
-    ? `${nodeData.subgraphId}:${String(nodeData.id)}`
-    : String(nodeData.id)
+}): NodeLocatorId {
+  return createNodeLocatorId(nodeData.subgraphId ?? null, nodeData.id)
 }
 
 /**
@@ -352,7 +351,7 @@ export function getExecutionIdByNode(
   if (!node.graph) return null
 
   if (node.graph === rootGraph || node.graph.isRootGraph) {
-    return String(node.id)
+    return createNodeExecutionId([node.id])
   }
 
   const parentPath = findPartialExecutionPathToGraph(
@@ -361,7 +360,7 @@ export function getExecutionIdByNode(
   )
   if (parentPath === undefined) return null
 
-  return `${parentPath}:${node.id}`
+  return createNodeExecutionId([...parentPath.split(':'), node.id])
 }
 
 /**
@@ -431,10 +430,14 @@ export function getExecutionIdForNodeInGraph(
   rootGraph: LGraph,
   graph: LGraph | Subgraph,
   nodeId: string | number
-): string {
-  if (graph === rootGraph || graph.isRootGraph) return String(nodeId)
+): NodeExecutionId {
+  if (graph === rootGraph || graph.isRootGraph) {
+    return createNodeExecutionId([nodeId])
+  }
   const parentPath = findPartialExecutionPathToGraph(graph as LGraph, rootGraph)
-  return parentPath !== undefined ? `${parentPath}:${nodeId}` : String(nodeId)
+  return parentPath !== undefined
+    ? createNodeExecutionId([...parentPath.split(':'), nodeId])
+    : createNodeExecutionId([nodeId])
 }
 
 /**
@@ -449,12 +452,13 @@ export function getExecutionIdForNodeInGraph(
 export function getExecutionIdFromNodeData(
   rootGraph: LGraph,
   nodeData: { id: string | number; subgraphId?: string | null }
-): string {
+): NodeExecutionId {
   const locatorId = getLocatorIdFromNodeData(nodeData)
   const node = getNodeByLocatorId(rootGraph, locatorId)
   return node
-    ? (getExecutionIdByNode(rootGraph, node) ?? String(nodeData.id))
-    : String(nodeData.id)
+    ? (getExecutionIdByNode(rootGraph, node) ??
+        createNodeExecutionId([nodeData.id]))
+    : createNodeExecutionId([nodeData.id])
 }
 
 /**
@@ -467,7 +471,7 @@ export function getExecutionIdFromNodeData(
  */
 export function getNodeByLocatorId(
   rootGraph: LGraph,
-  locatorId: NodeLocatorId | string
+  locatorId: string
 ): LGraphNode | null {
   if (!rootGraph) return null
 
@@ -504,7 +508,7 @@ export function executionIdToNodeLocatorId(
 
   if (!nodeIdStr.includes(':')) {
     // It's a top-level node ID
-    return nodeIdStr
+    return createNodeLocatorId(null, nodeIdStr)
   }
 
   // It's an execution node ID — resolve subgraph path
@@ -734,7 +738,9 @@ export function getExecutionIdsForSelectedNodes(
 
   const buildExecId = (node: LGraphNode, parentExecutionId: string) => {
     const nodeId = String(node.id)
-    return parentExecutionId ? `${parentExecutionId}:${nodeId}` : nodeId
+    return parentExecutionId
+      ? createNodeExecutionId([...parentExecutionId.split(':'), nodeId])
+      : createNodeExecutionId([nodeId])
   }
   return collectFromNodes<NodeExecutionId, string>(selectedNodes, {
     collector: buildExecId,
diff --git a/src/utils/hdrFormatUtil.test.ts b/src/utils/hdrFormatUtil.test.ts
new file mode 100644
index 0000000000..c673b6e87b
--- /dev/null
+++ b/src/utils/hdrFormatUtil.test.ts
@@ -0,0 +1,76 @@
+import { describe, expect, it } from 'vitest'
+
+import {
+  getImageFilenameFromUrl,
+  isHdrImageFilename,
+  isHdrImageUrl,
+  toFullResolutionUrl
+} from './hdrFormatUtil'
+
+describe('isHdrImageFilename', () => {
+  it('detects exr and hdr regardless of case', () => {
+    expect(isHdrImageFilename('render.exr')).toBe(true)
+    expect(isHdrImageFilename('RENDER.EXR')).toBe(true)
+    expect(isHdrImageFilename('env.hdr')).toBe(true)
+  })
+
+  it('rejects non-hdr formats and empty input', () => {
+    expect(isHdrImageFilename('image.png')).toBe(false)
+    expect(isHdrImageFilename('image.webp')).toBe(false)
+    expect(isHdrImageFilename(undefined)).toBe(false)
+    expect(isHdrImageFilename('')).toBe(false)
+  })
+})
+
+describe('getImageFilenameFromUrl', () => {
+  it('reads the filename query parameter from a view url', () => {
+    expect(
+      getImageFilenameFromUrl('/api/view?filename=out.exr&type=output')
+    ).toBe('out.exr')
+  })
+
+  it('falls back to the last path segment', () => {
+    expect(getImageFilenameFromUrl('https://x.test/files/out.hdr')).toBe(
+      'out.hdr'
+    )
+  })
+
+  it('returns undefined for empty input', () => {
+    expect(getImageFilenameFromUrl('')).toBeUndefined()
+  })
+})
+
+describe('isHdrImageUrl edge cases', () => {
+  it('returns false for undefined', () => {
+    expect(isHdrImageUrl(undefined)).toBe(false)
+  })
+})
+
+describe('isHdrImageUrl', () => {
+  it('detects hdr outputs from view urls', () => {
+    expect(isHdrImageUrl('/api/view?filename=scene.exr&type=output')).toBe(true)
+    expect(isHdrImageUrl('/api/view?filename=scene.png&type=output')).toBe(
+      false
+    )
+  })
+})
+
+describe('toFullResolutionUrl', () => {
+  it('strips the preview parameter', () => {
+    expect(
+      toFullResolutionUrl('/api/view?filename=out.exr&preview=webp;75&rand=1')
+    ).toBe('/api/view?filename=out.exr&rand=1')
+  })
+
+  it('leaves urls without a preview parameter untouched', () => {
+    expect(toFullResolutionUrl('/api/view?filename=out.exr')).toBe(
+      '/api/view?filename=out.exr'
+    )
+  })
+
+  it('preserves absolute http urls while stripping preview', () => {
+    expect(
+      toFullResolutionUrl('https://x.test/api/view?filename=out.exr&preview=w')
+    ).toBe('https://x.test/api/view?filename=out.exr')
+  })
+})
diff --git a/src/utils/hdrFormatUtil.ts b/src/utils/hdrFormatUtil.ts
new file mode 100644
index 0000000000..91fae18b94
--- /dev/null
+++ b/src/utils/hdrFormatUtil.ts
@@ -0,0 +1,38 @@
+const HDR_EXTENSIONS = ['.exr', '.hdr'] as const
+
+export function isHdrImageFilename(filename: string | undefined): boolean {
+  if (!filename) return false
+  const lower = filename.toLowerCase()
+  return HDR_EXTENSIONS.some((ext) => lower.endsWith(ext))
+}
+
+export function getImageFilenameFromUrl(url: string): string | undefined {
+  if (!url) return undefined
+  try {
+    const parsed = new URL(url, window.location.origin)
+    return (
+      parsed.searchParams.get('filename') ??
+      parsed.pathname.split('/').pop() ??
+      undefined
+    )
+  } catch {
+    return url.split('/').pop()
+  }
+}
+
+export function isHdrImageUrl(url: string | undefined): boolean {
+  if (!url) return false
+  return isHdrImageFilename(getImageFilenameFromUrl(url))
+}
+
+export function toFullResolutionUrl(url: string): string {
+  try {
+    const parsed = new URL(url, window.location.origin)
+    parsed.searchParams.delete('preview')
+    return url.startsWith('http')
+      ? parsed.toString()
+      : `${parsed.pathname}${parsed.search}`
+  } catch {
+    return url
+  }
+}