@bleedingdev/modern-js-create 3.2.0-ultramodern.3 → 3.2.0-ultramodern.30

package/dist/index.js

@@ -453,8 +453,8 @@ const EN_LOCALE = {
         success: '✨ Created successfully!',
         nextSteps: '📋 Next steps:',
         step1: 'cd {projectName}',
-        step2: 'pnpm install',
-        step3: 'pnpm dev'
+        step2: 'mise exec -- pnpm install',
+        step3: 'mise exec -- pnpm dev'
     },
     help: {
         title: '🚀 Modern.js Project Creator',
@@ -468,12 +468,13 @@ const EN_LOCALE = {
         optionRouter: '  -r, --router   Select router framework (react-router or tanstack)',
         optionBff: '      --bff      Enable BFF scaffold (default runtime: effect)',
         optionBffRuntime: '      --bff-runtime Select BFF runtime (hono or effect)',
-        optionTailwind: '      --tailwind Enable Tailwind CSS v4 scaffold (PostCSS + starter styles)',
+        optionTailwind: '      --no-tailwind Disable default Tailwind CSS v4 scaffold',
         optionWorkspace: '      --workspace Use workspace protocol for @modern-js dependencies (for local monorepo testing)',
         optionUltramodernWorkspace: '      --ultramodern-workspace Generate the canonical UltraModern SuperApp workspace',
         optionUltramodernPackageSource: '      --ultramodern-package-source Select UltraModern package source (workspace or install)',
         optionUltramodernPackageScope: '      --ultramodern-package-scope Publish scope for npm alias installs (for example bleedingdev)',
         optionUltramodernPackageNamePrefix: '      --ultramodern-package-name-prefix Prefix for npm alias package names (default: modern-js-)',
+        optionMicroVertical: '      --microvertical Add a MicroVertical package to an existing UltraModern workspace (remote, horizontal-remote, service, shared)',
         optionSub: '  -s, --sub       Mark as a subproject (package in monorepo)',
         examples: '💡 Examples:',
         example1: '  create my-app',
@@ -481,11 +482,12 @@ const EN_LOCALE = {
         example3: '  create my-app --sub',
         example4: '  create --help',
         example5: '  create my-app --router tanstack',
-        example6: '  create my-app --router tanstack --tailwind',
+        example6: '  create my-app --router tanstack --no-tailwind',
         example7: '  create my-app --bff',
         example8: '  create my-app --router tanstack --bff-runtime effect',
         example9: '  create my-app --router tanstack --bff-runtime effect --workspace',
-        example10: '  create my-super-app --ultramodern-workspace --ultramodern-package-source install --ultramodern-package-scope bleedingdev',
+        example10: '  pnpm dlx @bleedingdev/modern-js-create my-super-app',
+        example11: '  create catalog --microvertical remote',
         moreInfo: '📚 Learn more: https://modernjs.dev'
     },
     version: {
@@ -508,8 +510,8 @@ const ZH_LOCALE = {
         success: '✨ 创建成功！',
         nextSteps: '📋 下一步：',
         step1: 'cd {projectName}',
-        step2: 'pnpm install',
-        step3: 'pnpm dev'
+        step2: 'mise exec -- pnpm install',
+        step3: 'mise exec -- pnpm dev'
     },
     help: {
         title: '🚀 Modern.js 项目创建工具',
@@ -523,12 +525,13 @@ const ZH_LOCALE = {
         optionRouter: '  -r, --router   选择路由框架 (react-router 或 tanstack)',
         optionBff: '      --bff      启用 BFF 模板（默认运行时：effect）',
         optionBffRuntime: '      --bff-runtime 选择 BFF 运行时（hono 或 effect）',
-        optionTailwind: '      --tailwind 启用 Tailwind CSS v4 模板（PostCSS + 示例样式）',
+        optionTailwind: '      --no-tailwind 禁用默认 Tailwind CSS v4 模板',
         optionWorkspace: '      --workspace 对 @modern-js 依赖使用 workspace 协议（用于本地 monorepo 联调）',
         optionUltramodernWorkspace: '      --ultramodern-workspace 生成标准 UltraModern SuperApp 工作区',
         optionUltramodernPackageSource: '      --ultramodern-package-source 选择 UltraModern 依赖来源（workspace 或 install）',
         optionUltramodernPackageScope: '      --ultramodern-package-scope npm alias 安装使用的发布 scope（例如 bleedingdev）',
         optionUltramodernPackageNamePrefix: '      --ultramodern-package-name-prefix npm alias 包名前缀（默认：modern-js-）',
+        optionMicroVertical: '      --microvertical 向现有 UltraModern 工作区添加 MicroVertical 包（remote、horizontal-remote、service、shared）',
         optionSub: '  -s, --sub       标记为子项目（monorepo 中的子包）',
         examples: '💡 示例:',
         example1: '  create my-app',
@@ -536,11 +539,12 @@ const ZH_LOCALE = {
         example3: '  create my-app --sub',
         example4: '  create --help',
         example5: '  create my-app --router tanstack',
-        example6: '  create my-app --router tanstack --tailwind',
+        example6: '  create my-app --router tanstack --no-tailwind',
         example7: '  create my-app --bff',
         example8: '  create my-app --router tanstack --bff-runtime effect',
         example9: '  create my-app --router tanstack --bff-runtime effect --workspace',
         example10: '  create my-super-app --ultramodern-workspace --ultramodern-package-source install --ultramodern-package-scope bleedingdev',
+        example11: '  create catalog --microvertical remote',
         moreInfo: '📚 更多信息: https://modernjs.dev'
     },
     version: {
@@ -554,15 +558,51 @@ const localeKeys = i18n.init('en', {
 });
 const ultramodern_workspace_dirname = node_path.dirname(fileURLToPath(import.meta.url));
 const workspaceTemplateDir = node_path.resolve(ultramodern_workspace_dirname, '..', 'template-workspace');
-const TANSTACK_ROUTER_VERSION = '1.170.1';
-const MODULE_FEDERATION_VERSION = '2.4.0';
+const TANSTACK_ROUTER_VERSION = '1.170.8';
+const MODULE_FEDERATION_VERSION = '2.5.0';
+const ZEPHYR_RSPACK_PLUGIN_VERSION = '1.1.1';
+const ZEPHYR_AGENT_VERSION = '1.1.1';
+const WRANGLER_VERSION = '4.95.0';
+const TAILWIND_VERSION = '4.3.0';
+const TAILWIND_POSTCSS_VERSION = '4.3.0';
+const EFFECT_TSGO_VERSION = '0.11.0';
 const TYPESCRIPT_VERSION = '6.0.3';
+const TYPESCRIPT_NATIVE_PREVIEW_VERSION = '7.0.0-dev.20260527.2';
+const OXLINT_VERSION = '1.66.0';
+const OXFMT_VERSION = '0.51.0';
+const ULTRACITE_VERSION = '7.7.0';
+const I18NEXT_VERSION = '26.2.0';
 const REACT_VERSION = '^19.2.6';
 const REACT_DOM_VERSION = '^19.2.6';
+const PNPM_VERSION = '11.4.0';
 const WORKSPACE_PACKAGE_VERSION = 'workspace:*';
+const GENERATED_CONTRACT_PATH = '.modernjs/ultramodern-generated-contract.json';
+const RSTACK_AGENT_SKILLS_COMMIT = '61c948b42512e223bad44b83af4080eba48b2677';
+const MODULE_FEDERATION_AGENT_SKILLS_COMMIT = '07bb5b6c43ad457609e00c081b72d4c42508ec76';
+const baselineAgentSkills = [
+    'rsbuild-best-practices',
+    'rspack-best-practices',
+    'rspack-tracing',
+    'rsdoctor-analysis',
+    'rslib-best-practices',
+    'rslib-modern-package',
+    'rstest-best-practices'
+];
+const moduleFederationAgentSkills = [
+    'mf'
+];
+const privateAgentSkills = [
+    'plan-graph',
+    'dag',
+    'subagent-graph',
+    'helm',
+    'debugger-mode'
+];
+const effectTsgoTypecheckCommand = "node -e \"const fs = require('node:fs'); const { execFileSync, spawnSync } = require('node:child_process'); const bin = execFileSync('effect-tsgo', ['get-exe-path'], { encoding: 'utf8' }).trim(); if (process.platform !== 'win32') fs.chmodSync(bin, 0o755); const result = spawnSync(bin, ['--noEmit', '-p', 'tsconfig.json'], { stdio: 'inherit' }); process.exit(result.status ?? 1);\"";
 const modernPackageNames = [
     '@modern-js/app-tools',
     '@modern-js/plugin-bff',
+    '@modern-js/plugin-i18n',
     '@modern-js/plugin-tanstack',
     '@modern-js/runtime'
 ];
@@ -609,7 +649,15 @@ const remoteApps = [
         mfName: 'remoteCommerce',
         exposes: {
             './Route': './src/remote-entry.tsx',
-            './Widget': './src/components/CommerceWidget.tsx'
+            './Widget': './src/components/commerce-widget.tsx'
+        },
+        effectApi: {
+            stem: 'recommendations',
+            prefix: '/commerce-api',
+            consumedBy: [
+                shellApp.id,
+                'remote-commerce'
+            ]
         },
         ownership: {
             team: 'commerce-experience',
@@ -638,7 +686,15 @@ const remoteApps = [
         mfName: 'remoteIdentity',
         exposes: {
             './Route': './src/remote-entry.tsx',
-            './Widget': './src/components/IdentityWidget.tsx'
+            './Widget': './src/components/identity-widget.tsx'
+        },
+        effectApi: {
+            stem: 'identity',
+            prefix: '/identity-api',
+            consumedBy: [
+                shellApp.id,
+                'remote-identity'
+            ]
         },
         ownership: {
             team: 'identity-platform',
@@ -666,7 +722,7 @@ const remoteApps = [
         port: 3023,
         mfName: 'remoteDesignSystem',
         exposes: {
-            './Button': './src/components/Button.tsx',
+            './Button': './src/components/button.tsx',
             './tokens': './src/tokens.ts'
         },
         ownership: {
@@ -706,6 +762,81 @@ const effectService = {
         }
     }
 };
+const effectDiagnostics = [
+    'anyUnknownInErrorContext',
+    'classSelfMismatch',
+    'duplicatePackage',
+    'effectFnImplicitAny',
+    'floatingEffect',
+    'genericEffectServices',
+    'missingEffectContext',
+    'missingEffectError',
+    'missingLayerContext',
+    'missingReturnYieldStar',
+    'missingStarInYieldEffectGen',
+    'nonObjectEffectServiceType',
+    'outdatedApi',
+    'overriddenSchemaConstructor',
+    'catchUnfailableEffect',
+    'effectFnIife',
+    'effectGenUsesAdapter',
+    'effectInFailure',
+    'effectInVoidSuccess',
+    'globalErrorInEffectCatch',
+    'globalErrorInEffectFailure',
+    'layerMergeAllWithDependencies',
+    'lazyPromiseInEffectSync',
+    'leakingRequirements',
+    'multipleEffectProvide',
+    'returnEffectInGen',
+    'runEffectInsideEffect',
+    'schemaSyncInEffect',
+    'scopeInLayerEffect',
+    'strictEffectProvide',
+    'tryCatchInEffectGen',
+    'unknownInEffectCatch',
+    'asyncFunction',
+    'cryptoRandomUUID',
+    'cryptoRandomUUIDInEffect',
+    'extendsNativeError',
+    'globalConsole',
+    'globalConsoleInEffect',
+    'globalDate',
+    'globalDateInEffect',
+    'globalFetch',
+    'globalFetchInEffect',
+    'globalRandom',
+    'globalRandomInEffect',
+    'globalTimers',
+    'globalTimersInEffect',
+    'instanceOfSchema',
+    'newPromise',
+    'nodeBuiltinImport',
+    'preferSchemaOverJson',
+    'processEnv',
+    'processEnvInEffect',
+    'unsafeEffectTypeAssertion',
+    'catchAllToMapError',
+    'deterministicKeys',
+    'effectDoNotation',
+    'effectFnOpportunity',
+    'effectMapFlatten',
+    'effectMapVoid',
+    'effectSucceedWithVoid',
+    'missedPipeableOpportunity',
+    'missingEffectServiceDependency',
+    'nestedEffectGenYield',
+    'redundantSchemaTagIdentifier',
+    'schemaStructWithTag',
+    'schemaUnionOfLiterals',
+    'serviceNotAsClass',
+    'strictBooleanExpressions',
+    'unnecessaryArrowBlock',
+    'unnecessaryEffectGen',
+    'unnecessaryFailYieldableError',
+    'unnecessaryPipe',
+    'unnecessaryPipeChain'
+];
 const sharedPackages = [
     {
         id: 'shared-contracts',
@@ -723,6 +854,89 @@ const sharedPackages = [
         description: 'Shared Effect API type placeholders for services and clients.'
     }
 ];
+function createNeutralOwnership(id, tier = 'tier-2-microvertical') {
+    return {
+        team: 'super-app-platform',
+        slack: '#super-app-platform',
+        pagerDuty: 'pd-super-app-platform',
+        runbookRef: `runbooks/microverticals/${id}.md`,
+        adrRef: `docs/super-app-rfc-adr/microverticals.md#${id}`,
+        blastRadius: {
+            tier,
+            references: [
+                `docs/super-app-rfc-adr/blast-radius.md#${id}`
+            ]
+        }
+    };
+}
+function createRemoteDescriptor(name, kind, port) {
+    const domain = toKebabCase(name);
+    const id = `remote-${domain}`;
+    const displayPrefix = toPascalCase(domain).replace(/([a-z])([A-Z])/g, '$1 $2');
+    return {
+        id,
+        directory: `apps/remotes/${id}`,
+        packageSuffix: id,
+        displayName: `${displayPrefix} Remote`,
+        kind: 'horizontal-remote' === kind ? 'horizontal-remote' : 'vertical',
+        domain,
+        portEnv: `REMOTE_${toEnvSegment(domain)}_PORT`,
+        port,
+        mfName: `remote${toPascalCase(domain)}`,
+        exposes: {
+            './Route': './src/remote-entry.tsx',
+            './Widget': `./src/components/${domain}-widget.tsx`
+        },
+        ...'remote' === kind ? {
+            effectApi: {
+                stem: domain,
+                prefix: `/${domain}-api`,
+                consumedBy: [
+                    shellApp.id,
+                    id
+                ]
+            }
+        } : {},
+        ownership: createNeutralOwnership(id)
+    };
+}
+function createServiceDescriptor(name, port) {
+    const normalized = toKebabCase(name);
+    const suffix = normalized.endsWith('-effect') ? normalized : `service-${normalized.replace(/^service-/, '')}-effect`;
+    return {
+        id: suffix,
+        directory: `services/${suffix}`,
+        packageSuffix: suffix,
+        portEnv: `${toEnvSegment(suffix)}_PORT`,
+        port,
+        ownership: createNeutralOwnership(suffix, 'tier-2-effect-service')
+    };
+}
+function serviceApiPrefix(service) {
+    const name = service.id.replace(/^service-/, '').replace(/-effect$/, '');
+    return name.endsWith('-api') ? `/${name}` : `/${name}-api`;
+}
+function appHasEffectApi(app) {
+    return void 0 !== app.effectApi;
+}
+function effectApiPrefix(target) {
+    return target.effectApi?.prefix ?? serviceApiPrefix(target);
+}
+function effectApiStem(target) {
+    return target.effectApi?.stem ?? target.id.replace(/^service-/, '').replace(/-effect$/, '').replace(/-api$/, '');
+}
+function verticalEffectApps(remotes = remoteApps) {
+    return remotes.filter(appHasEffectApi);
+}
+function createSharedPackageDescriptor(name) {
+    const normalized = toKebabCase(name);
+    const id = normalized.startsWith('shared-') ? normalized : `shared-${normalized}`;
+    return {
+        id,
+        directory: `packages/${id}`,
+        description: `Shared ${normalized.replace(/^shared-/, '')} package placeholder.`
+    };
+}
 function normalizePath(filePath) {
     return filePath.split(node_path.sep).join('/');
 }
@@ -743,6 +957,15 @@ function writeFile(targetDir, relativePath, content) {
     });
     node_fs.writeFileSync(filePath, content, 'utf-8');
 }
+function writeFileReplacing(targetDir, relativePath, content) {
+    assertSafeRelativePath(relativePath);
+    const filePath = node_path.join(targetDir, relativePath);
+    ensureInsideRoot(targetDir, filePath);
+    node_fs.mkdirSync(node_path.dirname(filePath), {
+        recursive: true
+    });
+    node_fs.writeFileSync(filePath, content, 'utf-8');
+}
 function writeJson(targetDir, relativePath, value) {
     writeFile(targetDir, relativePath, `${JSON.stringify(value, null, 2)}\n`);
 }
@@ -788,6 +1011,17 @@ function toPackageScope(packageName) {
     const normalized = packageName.replace(/^@/, '').replace(/[\\/]+/g, '-').toLowerCase().replace(/[^a-z0-9._-]+/g, '-').replace(/^[._-]+|[._-]+$/g, '').replace(/-{2,}/g, '-');
     return normalized || 'ultramodern-superapp';
 }
+function toKebabCase(value) {
+    const normalized = value.trim().replace(/([a-z0-9])([A-Z])/g, '$1-$2').replace(/[^a-zA-Z0-9._-]+/g, '-').replace(/[._]+/g, '-').toLowerCase().replace(/-+/g, '-').replace(/^-+|-+$/g, '');
+    return normalized;
+}
+function toCamelCase(value) {
+    const pascal = toPascalCase(value);
+    return `${pascal.charAt(0).toLowerCase()}${pascal.slice(1)}`;
+}
+function toEnvSegment(value) {
+    return toKebabCase(value).replace(/-/g, '_').toUpperCase();
+}
 function ultramodern_workspace_packageName(scope, suffix) {
     return `@${scope}/${suffix}`;
 }
@@ -818,26 +1052,44 @@ function modernPackageSpecifier(packageName, packageSource) {
     if (!packageSource.aliasScope) return packageSource.modernPackageVersion;
     return `npm:${modernAliasPackageName(packageName, packageSource)}@${packageSource.modernPackageVersion}`;
 }
-function appDependencies(scope, packageSource) {
-    return {
+function appDependencies(scope, packageSource, app) {
+    const dependencies = {
         '@modern-js/plugin-tanstack': modernPackageSpecifier('@modern-js/plugin-tanstack', packageSource),
+        '@modern-js/plugin-i18n': modernPackageSpecifier('@modern-js/plugin-i18n', packageSource),
         '@modern-js/runtime': modernPackageSpecifier('@modern-js/runtime', packageSource),
         '@module-federation/modern-js-v3': MODULE_FEDERATION_VERSION,
         '@module-federation/runtime': MODULE_FEDERATION_VERSION,
         '@tanstack/react-router': TANSTACK_ROUTER_VERSION,
+        i18next: I18NEXT_VERSION,
+        'node-fetch': '^3.3.2',
         [ultramodern_workspace_packageName(scope, 'shared-contracts')]: WORKSPACE_PACKAGE_VERSION,
         [ultramodern_workspace_packageName(scope, 'shared-design-tokens')]: WORKSPACE_PACKAGE_VERSION,
         react: REACT_VERSION,
         'react-dom': REACT_DOM_VERSION
     };
+    if ('shell' === app.kind) {
+        dependencies['@modern-js/plugin-bff'] = modernPackageSpecifier('@modern-js/plugin-bff', packageSource);
+        for (const remote of verticalEffectApps())dependencies[ultramodern_workspace_packageName(scope, remote.packageSuffix)] = WORKSPACE_PACKAGE_VERSION;
+    }
+    if (appHasEffectApi(app)) dependencies['@modern-js/plugin-bff'] = modernPackageSpecifier('@modern-js/plugin-bff', packageSource);
+    return dependencies;
 }
-function appDevDependencies(packageSource) {
+function appDevDependencies(packageSource, enableTailwind) {
     return {
         '@modern-js/app-tools': modernPackageSpecifier('@modern-js/app-tools', packageSource),
+        '@effect/tsgo': EFFECT_TSGO_VERSION,
+        ...enableTailwind ? {
+            '@tailwindcss/postcss': `^${TAILWIND_POSTCSS_VERSION}`,
+            postcss: '^8.5.6',
+            tailwindcss: `^${TAILWIND_VERSION}`
+        } : {},
+        "@typescript/native-preview": TYPESCRIPT_NATIVE_PREVIEW_VERSION,
         '@types/node': '^20',
         '@types/react': '^19.1.8',
         '@types/react-dom': '^19.1.6',
-        typescript: TYPESCRIPT_VERSION
+        typescript: TYPESCRIPT_VERSION,
+        'zephyr-rspack-plugin': ZEPHYR_RSPACK_PLUGIN_VERSION,
+        wrangler: WRANGLER_VERSION
     };
 }
 function createRootPackageJson(scope, packageSource) {
@@ -845,21 +1097,33 @@ function createRootPackageJson(scope, packageSource) {
         private: true,
         name: scope,
         version: '0.1.0',
+        type: 'module',
+        packageManager: `pnpm@${PNPM_VERSION}`,
         scripts: {
             dev: `pnpm --parallel --filter ${ultramodern_workspace_packageName(scope, shellApp.packageSuffix)} --filter ${ultramodern_workspace_packageName(scope, 'remote-commerce')} --filter ${ultramodern_workspace_packageName(scope, 'remote-identity')} --filter ${ultramodern_workspace_packageName(scope, 'remote-design-system')} dev`,
             'dev:shell': `pnpm --filter ${ultramodern_workspace_packageName(scope, shellApp.packageSuffix)} dev`,
             'dev:commerce': `pnpm --filter ${ultramodern_workspace_packageName(scope, 'remote-commerce')} dev`,
             'dev:identity': `pnpm --filter ${ultramodern_workspace_packageName(scope, 'remote-identity')} dev`,
             'dev:design-system': `pnpm --filter ${ultramodern_workspace_packageName(scope, 'remote-design-system')} dev`,
-            'dev:recommendations': `pnpm --filter ${ultramodern_workspace_packageName(scope, effectService.packageSuffix)} dev`,
-            build: 'pnpm -r --filter ./apps/** --filter ./services/** build',
-            typecheck: 'pnpm -r --filter ./apps/** --filter ./services/** --filter ./packages/** typecheck',
+            build: 'pnpm -r --filter "./apps/remotes/**" run build && pnpm --filter "./apps/shell-super-app" run build && pnpm ultramodern:assert-mf-types',
+            format: 'oxfmt .',
+            'format:check': 'oxfmt --check .',
+            lint: 'oxlint .',
+            'lint:fix': 'oxlint . --fix',
+            typecheck: `pnpm -r --filter "@${scope}/*" typecheck`,
+            'cloudflare:build': 'pnpm -r --filter "./apps/remotes/**" run cloudflare:build && pnpm --filter "./apps/shell-super-app" run cloudflare:build && pnpm ultramodern:assert-mf-types',
+            'skills:install': "node ./scripts/bootstrap-agent-skills.mjs",
+            'skills:check': "node ./scripts/bootstrap-agent-skills.mjs --check",
+            'agents:refs:install': "node ./scripts/setup-agent-reference-repos.mjs",
+            'agents:refs:check': "node ./scripts/setup-agent-reference-repos.mjs --check",
+            'ultramodern:assert-mf-types': "node ./scripts/assert-mf-types.mjs",
             'ultramodern:check': "node ./scripts/validate-ultramodern-workspace.mjs",
-            check: 'pnpm ultramodern:check'
+            postinstall: "node ./scripts/setup-agent-reference-repos.mjs && node ./scripts/bootstrap-agent-skills.mjs",
+            check: 'pnpm format:check && pnpm lint && pnpm typecheck && pnpm skills:check && pnpm ultramodern:check'
         },
         engines: {
             node: '>=20',
-            pnpm: '>=10.0.0'
+            pnpm: `>=${PNPM_VERSION} <11.5.0`
         },
         workspaces: [
             'apps/*',
@@ -878,35 +1142,71 @@ function createRootPackageJson(scope, packageSource) {
             }
         },
         devDependencies: {
-            '@biomejs/biome': '1.9.4',
-            typescript: TYPESCRIPT_VERSION
+            '@effect/tsgo': EFFECT_TSGO_VERSION,
+            "@typescript/native-preview": TYPESCRIPT_NATIVE_PREVIEW_VERSION,
+            oxlint: OXLINT_VERSION,
+            oxfmt: OXFMT_VERSION,
+            ultracite: ULTRACITE_VERSION,
+            wrangler: WRANGLER_VERSION,
+            'zephyr-agent': ZEPHYR_AGENT_VERSION
         }
     };
 }
-function createTsConfigBase(scope) {
+function remoteDependencyAlias(remote) {
+    return toCamelCase(remote.domain ?? remote.id.replace(/^remote-/, ''));
+}
+function zephyrRemoteDependency(scope, remote) {
+    return `${ultramodern_workspace_packageName(scope, remote.packageSuffix)}@workspace:*`;
+}
+function createZephyrDependencies(scope, app, remotes = remoteApps) {
+    if ('shell' !== app.kind) return {};
+    return Object.fromEntries(remotes.map((remote)=>[
+            remoteDependencyAlias(remote),
+            zephyrRemoteDependency(scope, remote)
+        ]));
+}
+function createTsConfigBase() {
     return {
         compilerOptions: {
-            target: 'ES2022',
+            target: 'ESNext',
             lib: [
+                'ESNext',
                 'DOM',
-                'DOM.Iterable',
-                'ES2022'
+                'DOM.Iterable'
             ],
-            module: 'ESNext',
+            module: 'preserve',
             moduleResolution: 'Bundler',
+            moduleDetection: 'force',
             jsx: 'preserve',
+            isolatedModules: true,
+            verbatimModuleSyntax: true,
             strict: true,
             noEmit: true,
+            allowJs: true,
             esModuleInterop: true,
+            noUncheckedIndexedAccess: true,
+            exactOptionalPropertyTypes: true,
+            noImplicitOverride: true,
+            noFallthroughCasesInSwitch: true,
+            noPropertyAccessFromIndexSignature: true,
+            noImplicitReturns: true,
             skipLibCheck: true,
             resolveJsonModule: true,
-            baseUrl: '.',
-            paths: Object.fromEntries(sharedPackages.map((sharedPackage)=>[
-                    ultramodern_workspace_packageName(scope, sharedPackage.id),
-                    [
-                        `${sharedPackage.directory}/src/index.ts`
-                    ]
-                ]))
+            plugins: [
+                {
+                    name: '@effect/language-service',
+                    diagnostics: true,
+                    includeSuggestionsInTsc: true,
+                    ignoreEffectSuggestionsInTscExitCode: false,
+                    ignoreEffectWarningsInTscExitCode: false,
+                    ignoreEffectErrorsInTscExitCode: false,
+                    skipDisabledOptimization: true,
+                    diagnosticSeverity: Object.fromEntries(effectDiagnostics.map((name)=>[
+                            name,
+                            'error'
+                        ]))
+                }
+            ]
         }
     };
 }
@@ -919,60 +1219,60 @@ function createPackageTsConfig(packageDir, includeApi = false) {
     if (includeApi) include.push('api', 'shared');
     return {
         extends: `${relativeRootFor(packageDir)}/tsconfig.base.json`,
-        compilerOptions: {
-            baseUrl: '.',
-            paths: {
-                '@/*': [
-                    './src/*'
-                ],
-                '@api/*': [
-                    './api/*'
-                ],
-                '@shared/*': [
-                    './shared/*'
-                ]
-            }
-        },
-        include
+        include,
+        exclude: [
+            'src/modern-tanstack'
+        ]
     };
 }
-function createAppPackage(scope, app, packageSource) {
-    return {
+function createAppPackage(scope, app, packageSource, enableTailwind) {
+    const packageJson = {
         private: true,
         name: ultramodern_workspace_packageName(scope, app.packageSuffix),
         version: '0.1.0',
         scripts: {
             dev: 'modern dev',
-            build: 'modern build',
+            build: app.exposes ? `modern build && node ${relativeRootFor(app.directory)}/scripts/assert-mf-types.mjs` : 'modern build',
+            'cloudflare:build': 'MODERNJS_DEPLOY=cloudflare modern build && MODERNJS_DEPLOY=cloudflare modern deploy',
+            'cloudflare:preview': 'MODERNJS_DEPLOY=cloudflare modern build && MODERNJS_DEPLOY=cloudflare modern deploy && wrangler dev --config .output/wrangler.json',
             serve: 'modern serve',
-            typecheck: 'tsgo --noEmit -p tsconfig.json'
+            typecheck: effectTsgoTypecheckCommand
         },
         modernjs: {
             preset: 'presetUltramodern',
             role: 'shell' === app.kind ? 'shell' : 'module-federation-remote',
             appId: app.id,
-            topology: `${relativeRootFor(app.directory)}/topology/reference-topology.json`
+            topology: `${relativeRootFor(app.directory)}/topology/reference-topology.json`,
+            ...appHasEffectApi(app) ? {
+                apiRuntime: 'effect-bff'
+            } : {}
         },
-        dependencies: appDependencies(scope, packageSource),
-        devDependencies: appDevDependencies(packageSource)
+        'zephyr:dependencies': createZephyrDependencies(scope, app),
+        dependencies: appDependencies(scope, packageSource, app),
+        devDependencies: appDevDependencies(packageSource, enableTailwind)
+    };
+    if (appHasEffectApi(app)) packageJson.exports = {
+        './effect/client': `./src/effect/${app.effectApi.stem}-client.ts`,
+        './shared/effect/api': './shared/effect/api.ts'
     };
+    return packageJson;
 }
-function createServicePackage(scope, packageSource) {
+function createServicePackage(scope, packageSource, enableTailwind, service = effectService) {
     return {
         private: true,
-        name: ultramodern_workspace_packageName(scope, effectService.packageSuffix),
+        name: ultramodern_workspace_packageName(scope, service.packageSuffix),
         version: '0.1.0',
         scripts: {
             dev: 'modern dev',
             build: 'modern build',
             serve: 'modern serve',
-            typecheck: 'tsgo --noEmit -p tsconfig.json'
+            typecheck: effectTsgoTypecheckCommand
         },
         modernjs: {
             preset: 'presetUltramodern',
             role: 'effect-service',
-            appId: effectService.id,
-            topology: `${relativeRootFor(effectService.directory)}/topology/reference-topology.json`
+            appId: service.id,
+            topology: `${relativeRootFor(service.directory)}/topology/reference-topology.json`
         },
         dependencies: {
             '@modern-js/runtime': modernPackageSpecifier('@modern-js/runtime', packageSource),
@@ -983,6 +1283,13 @@ function createServicePackage(scope, packageSource) {
         devDependencies: {
             '@modern-js/app-tools': modernPackageSpecifier('@modern-js/app-tools', packageSource),
             '@modern-js/plugin-bff': modernPackageSpecifier('@modern-js/plugin-bff', packageSource),
+            '@effect/tsgo': EFFECT_TSGO_VERSION,
+            ...enableTailwind ? {
+                '@tailwindcss/postcss': `^${TAILWIND_POSTCSS_VERSION}`,
+                postcss: '^8.5.6',
+                tailwindcss: `^${TAILWIND_VERSION}`
+            } : {},
+            "@typescript/native-preview": TYPESCRIPT_NATIVE_PREVIEW_VERSION,
             '@types/node': '^20',
             '@types/react': '^19.1.8',
             '@types/react-dom': '^19.1.6',
@@ -990,8 +1297,8 @@ function createServicePackage(scope, packageSource) {
         }
     };
 }
-function createSharedPackage(scope, id, description) {
-    return {
+function createSharedPackage(scope, id, description, packageSource) {
+    const packageJson = {
         private: true,
         name: ultramodern_workspace_packageName(scope, id),
         version: '0.1.0',
@@ -1001,46 +1308,162 @@ function createSharedPackage(scope, id, description) {
             '.': './src/index.ts'
         },
         scripts: {
-            typecheck: 'tsgo --noEmit -p tsconfig.json'
+            typecheck: effectTsgoTypecheckCommand
         },
         devDependencies: {
-            typescript: TYPESCRIPT_VERSION
+            '@effect/tsgo': EFFECT_TSGO_VERSION,
+            "@typescript/native-preview": TYPESCRIPT_NATIVE_PREVIEW_VERSION
         }
     };
+    if ('shared-effect-api' === id) packageJson.dependencies = {
+        '@modern-js/plugin-bff': modernPackageSpecifier('@modern-js/plugin-bff', packageSource)
+    };
+    return packageJson;
 }
 function createAppModernConfig(app) {
-    return `import { appTools, defineConfig, presetUltramodern } from '@modern-js/app-tools';
+    const bffImport = appHasEffectApi(app) ? "import { bffPlugin } from '@modern-js/plugin-bff';\n" : '';
+    const bffConfig = appHasEffectApi(app) ? `      bff: {
+        effect: {
+          openapi: {
+            path: '/openapi.json',
+          },
+        },
+        prefix: '${effectApiPrefix(app)}',
+        runtimeFramework: 'effect',
+      },
+` : '';
+    const bffPluginEntry = appHasEffectApi(app) ? '        bffPlugin(),\n' : '';
+    return `// @effect-diagnostics processEnv:off
+import {
+  appTools,
+  defineConfig,
+  presetUltramodern,
+} from '@modern-js/app-tools';
+${bffImport}import { i18nPlugin } from '@modern-js/plugin-i18n';
 import { tanstackRouterPlugin } from '@modern-js/plugin-tanstack';
 import { moduleFederationPlugin } from '@module-federation/modern-js-v3';
+import { withZephyr as withZephyrRspack } from 'zephyr-rspack-plugin';
+
+type ZephyrRspackConfig = Parameters<ReturnType<typeof withZephyrRspack>>[0];
+
+const zephyrRspackPlugin = () => ({
+  name: 'ultramodern-zephyr-rspack-plugin',
+  pre: ['@modern-js/plugin-module-federation-config'],
+  setup(api: {
+    modifyRspackConfig: (
+      handler: (
+        config: ZephyrRspackConfig,
+      ) => ZephyrRspackConfig | Promise<ZephyrRspackConfig>,
+    ) => void;
+  }) {
+    api.modifyRspackConfig(config => withZephyrRspack()(config));
+  },
+});
 
 const appId = '${app.id}';
-const port = Number(process.env.${app.portEnv} ?? ${app.port});
+const port = Number(process.env['${app.portEnv}'] ?? ${app.port});
+const configuredSiteUrl = process.env['MODERN_PUBLIC_SITE_URL'];
+const hasConfiguredSiteUrl =
+  typeof configuredSiteUrl === 'string' && configuredSiteUrl.length > 0;
+const isProductionBuild =
+  process.env['NODE_ENV'] === 'production' || process.argv.includes('build');
+
+if (isProductionBuild && !hasConfiguredSiteUrl) {
+  throw new Error(
+    'MODERN_PUBLIC_SITE_URL must be set for production builds so canonical and hreflang URLs use the deployed origin.',
+  );
+}
+
+const siteUrl = hasConfiguredSiteUrl
+  ? configuredSiteUrl
+  : \`http://localhost:\${port}\`;
 
 export default defineConfig(
   presetUltramodern(
     {
-      server: {
-        port,
-        ssr: {
-          mode: 'string',
-          moduleFederationAppSSR: true,
+${bffConfig}      output: {
+        disableTsChecker: true,
+        distPath: {
+          html: './',
         },
-      },
-      output: {
         polyfill: 'off',
-        disableTsChecker: true,
         splitRouteChunks: false,
       },
+      performance: {
+        rsdoctor: {
+          enabled: process.env['ULTRAMODERN_RSDOCTOR'] === 'true',
+          disableClientServer: true,
+        },
+      },
+      html: {
+        outputStructure: 'flat',
+      },
       plugins: [
         appTools(),
         tanstackRouterPlugin(),
-        moduleFederationPlugin(),
+        i18nPlugin({
+          backend: {
+            enabled: true,
+          },
+          reactI18next: false,
+          localeDetection: {
+            fallbackLanguage: 'en',
+            languages: ['en', 'cs'],
+            localePathRedirect: true,
+            ignoreRedirectRoutes: [
+              '/@mf-types',
+              '/bundles',
+              '${effectApiPrefix(app)}',
+              '/locales',
+              '/mf-manifest.json',
+              '/mf-stats.json',
+              '/remoteEntry.js',
+              '/static',
+              '/zephyr-manifest.json',
+            ],
+          },
+        }),
+${bffPluginEntry}        moduleFederationPlugin(),
+        zephyrRspackPlugin(),
       ],
+      tools: {
+        autoprefixer: {
+          overrideBrowserslist: ['defaults'],
+        },
+        bundlerChain: chain => {
+          chain.ignoreWarnings([
+            {
+              message: /the request of a dependency is an expression/u,
+              module: /modern-js-plugin-i18n/u,
+            },
+          ]);
+        },
+      },
+      deploy: {
+        target: 'cloudflare',
+        worker: {
+          ssr: true,
+        },
+      },
+      server: {
+        port,
+        publicDir: './locales',
+        ssr: {
+          mode: 'stream',
+          moduleFederationAppSSR: true,
+        },
+      },
+      source: {
+        mainEntryName: 'index',
+        globalVars: {
+          ULTRAMODERN_SITE_URL: siteUrl,
+        },
+      },
     },
     {
       appId,
-      enableModuleFederationSSR: true,
       enableBffRequestId: true,
+      enableModuleFederationSSR: true,
       enableTelemetryExporters: true,
       telemetryFailLoudStartup: false,
     },
@@ -1048,129 +1471,162 @@ export default defineConfig(
 );
 `;
 }
-function createShellModuleFederationConfig() {
-    return `import { createRequire } from 'node:module';
-import { createModuleFederationConfig } from '@module-federation/modern-js-v3';
-import { dependencies } from './package.json';
-
-const require = createRequire(import.meta.url);
-const runtimeVersion = (
-  require('@modern-js/runtime/package.json') as { version: string }
-).version;
-const reactVersion = (require('react/package.json') as { version: string })
-  .version;
-const reactDomVersion = (
-  require('react-dom/package.json') as { version: string }
-).version;
-
-export default createModuleFederationConfig({
-  name: '${shellApp.mfName}',
-  dts: false,
-  remotes: {
-    commerce:
-      process.env.REMOTE_COMMERCE_MF_MANIFEST ??
-      'remoteCommerce@http://localhost:3021/mf-manifest.json',
-    identity:
-      process.env.REMOTE_IDENTITY_MF_MANIFEST ??
-      'remoteIdentity@http://localhost:3022/mf-manifest.json',
-    designSystem:
-      process.env.REMOTE_DESIGN_SYSTEM_MF_MANIFEST ??
-      'remoteDesignSystem@http://localhost:3023/mf-manifest.json',
-  },
-  shared: {
-    react: {
+function createSharedModuleFederationConfig() {
+    return `  shared: {
+    '@modern-js/runtime': {
+      requiredVersion: runtimeVersion,
       singleton: true,
-      requiredVersion: reactVersion,
       treeShaking: false,
     },
-    'react-dom': {
+    '@tanstack/react-router': {
+      requiredVersion: dependencies['@tanstack/react-router'],
       singleton: true,
-      requiredVersion: reactDomVersion,
       treeShaking: false,
     },
-    '@tanstack/react-router': {
+    react: {
+      requiredVersion: reactVersion,
       singleton: true,
-      requiredVersion: dependencies['@tanstack/react-router'],
       treeShaking: false,
     },
-    '@modern-js/runtime': {
+    'react-dom': {
+      requiredVersion: reactDomVersion,
       singleton: true,
-      requiredVersion: runtimeVersion,
       treeShaking: false,
     },
+    'react-dom/client': {
+      requiredVersion: reactDomVersion,
+      singleton: true,
+      treeShaking: false,
+    },
+  }`;
+}
+function formatTsObjectLiteral(value) {
+    const entries = Object.entries(value).sort(([left], [right])=>left.localeCompare(right));
+    if (0 === entries.length) return '{}';
+    return `{
+${entries.map(([key, entryValue])=>`    '${key}': '${entryValue}',`).join('\n')}
+  }`;
+}
+function createRemoteManifestEnv(remote) {
+    return `REMOTE_${toEnvSegment(remote.domain ?? remote.id)}_MF_MANIFEST`;
+}
+function createShellModuleFederationConfig(remotes = remoteApps) {
+    const remoteEntries = remotes.map((remote)=>{
+        const key = remoteDependencyAlias(remote);
+        return `    ${key}:
+      process.env['${createRemoteManifestEnv(remote)}'] ??
+      '${remote.mfName}@http://localhost:${remote.port}/mf-manifest.json',`;
+    }).join('\n');
+    return `// @effect-diagnostics nodeBuiltinImport:off processEnv:off
+import { createRequire } from 'node:module';
+import { createModuleFederationConfig } from '@module-federation/modern-js-v3';
+import { dependencies } from './package.json';
+
+const require = createRequire(import.meta.url);
+const runtimeVersion = (require('@modern-js/runtime/package.json') as { version: string }).version;
+const reactVersion = (require('react/package.json') as { version: string }).version;
+const reactDomVersion = (require('react-dom/package.json') as { version: string }).version;
+
+export default createModuleFederationConfig({
+  treeShakingSharedExcludePlugins: ['RspackModuleFederationPlugin'],
+  dev: {
+    disableDynamicRemoteTypeHints: true,
+  },
+  dts: {
+    displayErrorInTerminal: true,
+    generateTypes: {
+      compilerInstance: '--package typescript -- tsc',
+    },
   },
+  filename: 'remoteEntry.js',
+  name: '${shellApp.mfName}',
+  remotes: {
+${remoteEntries}
+  },
+${createSharedModuleFederationConfig()},
 });
 `;
 }
+function createBuildMarker(scope, app) {
+    return node_crypto.createHash('sha256').update(`${scope}:${app.packageSuffix}:${app.id}:0.1.0`).digest('hex').slice(0, 16);
+}
+function createUltramodernBuildModule(scope, app) {
+    return `export const ultramodernVerticalIdentity = {
+  appId: '${app.id}',
+  packageName: '${ultramodern_workspace_packageName(scope, app.packageSuffix)}',
+  version: '0.1.0',
+  build: '${createBuildMarker(scope, app)}',
+  deployProfile: 'cloudflare-ssr-mf-effect-v1',
+} as const;
+
+export const ultramodernUiMarker = {
+  ...ultramodernVerticalIdentity,
+  surface: 'ui',
+} as const;
+
+export const ultramodernApiMarker = {
+  ...ultramodernVerticalIdentity,
+  surface: 'effect-bff',
+} as const;
+`;
+}
 function createRemoteModuleFederationConfig(app) {
-    const exposes = JSON.stringify(app.exposes ?? {}, null, 4).replace(/^/gm, '  ');
-    return `import { createRequire } from 'node:module';
+    const exposes = formatTsObjectLiteral(app.exposes ?? {});
+    return `// @effect-diagnostics nodeBuiltinImport:off
+import { createRequire } from 'node:module';
 import { createModuleFederationConfig } from '@module-federation/modern-js-v3';
 import { dependencies } from './package.json';
 
 const require = createRequire(import.meta.url);
-const runtimeVersion = (
-  require('@modern-js/runtime/package.json') as { version: string }
-).version;
-const reactVersion = (require('react/package.json') as { version: string })
-  .version;
-const reactDomVersion = (
-  require('react-dom/package.json') as { version: string }
-).version;
+const runtimeVersion = (require('@modern-js/runtime/package.json') as { version: string }).version;
+const reactVersion = (require('react/package.json') as { version: string }).version;
+const reactDomVersion = (require('react-dom/package.json') as { version: string }).version;
 
 export default createModuleFederationConfig({
-  name: '${app.mfName}',
-  dts: false,
-  filename: 'remoteEntry.js',
-  exposes: ${exposes},
-  shared: {
-    react: {
-      singleton: true,
-      requiredVersion: reactVersion,
-      treeShaking: false,
-    },
-    'react-dom': {
-      singleton: true,
-      requiredVersion: reactDomVersion,
-      treeShaking: false,
-    },
-    '@tanstack/react-router': {
-      singleton: true,
-      requiredVersion: dependencies['@tanstack/react-router'],
-      treeShaking: false,
-    },
-    '@modern-js/runtime': {
-      singleton: true,
-      requiredVersion: runtimeVersion,
-      treeShaking: false,
+  treeShakingSharedExcludePlugins: ['RspackModuleFederationPlugin'],
+  dev: {
+    disableDynamicRemoteTypeHints: true,
+  },
+  dts: {
+    displayErrorInTerminal: true,
+    generateTypes: {
+      compilerInstance: '--package typescript -- tsc',
     },
   },
+  exposes: ${exposes},
+  filename: 'remoteEntry.js',
+  name: '${app.mfName}',
+${createSharedModuleFederationConfig()},
 });
 `;
 }
-function createServiceModernConfig() {
-    return `import { appTools, defineConfig, presetUltramodern } from '@modern-js/app-tools';
+function remoteWidgetFile(app) {
+    return `${app.domain ?? app.id.replace(/^remote-/, '')}-widget`;
+}
+function createServiceModernConfigFor(service = effectService) {
+    return `// @effect-diagnostics processEnv:off
+import { appTools, defineConfig, presetUltramodern } from '@modern-js/app-tools';
 import { bffPlugin } from '@modern-js/plugin-bff';
 
-const appId = '${effectService.id}';
-const port = Number(process.env.${effectService.portEnv} ?? ${effectService.port});
+const appId = '${service.id}';
+const port = Number(process.env['${service.portEnv}'] ?? ${service.port});
 
 export default defineConfig(
   presetUltramodern(
     {
-      server: {
-        port,
-      },
       bff: {
-        prefix: '/recommendations-api',
-        runtimeFramework: 'effect',
         effect: {
           openapi: {
             path: '/openapi.json',
           },
         },
+        prefix: '${serviceApiPrefix(service)}',
+        runtimeFramework: 'effect',
       },
       plugins: [appTools(), bffPlugin()],
+      server: {
+        port,
+      },
     },
     {
       appId,
@@ -1182,21 +1638,443 @@ export default defineConfig(
 );
 `;
 }
+function createAppRuntimeConfig(app) {
+    const resources = {
+        cs: {
+            translation: createAppLocaleMessages(app, 'cs')
+        },
+        en: {
+            translation: createAppLocaleMessages(app, 'en')
+        }
+    };
+    return `import { defineRuntimeConfig } from '@modern-js/runtime';
+import { createInstance } from 'i18next';
+
+const i18nInstance = createInstance();
+
+export default defineRuntimeConfig({
+  i18n: {
+    i18nInstance,
+    initOptions: {
+      defaultNS: 'translation',
+      fallbackLng: 'en',
+      interpolation: {
+        escapeValue: false,
+      },
+      ns: ['translation'],
+      resources: ${JSON.stringify(resources, null, 8).split('\n').join('\n      ')},
+      supportedLngs: ['en', 'cs'],
+    },
+  },
+  router: {
+    framework: 'tanstack',
+  },
+});
+`;
+}
+function createAppStyles(enableTailwind) {
+    return `${enableTailwind ? "@import 'tailwindcss';\n\n" : ''}:root {
+  color: #10231c;
+  background: #f1eadc;
+  font-family:
+    Geist,
+    Inter,
+    ui-sans-serif,
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    sans-serif;
+}
+
+body {
+  margin: 0;
+}
+
+main {
+  min-height: 100vh;
+  padding: 2rem;
+}
+
+nav {
+  display: flex;
+  gap: 0.75rem;
+  margin-bottom: 2rem;
+}
+
+a {
+  color: #166b4b;
+}
+
+.commerce-shell {
+  background: #f1eadc;
+  color: #0b0a08;
+  min-height: 100vh;
+  padding: 1.5rem clamp(1rem, 4vw, 3rem) 4rem;
+}
+
+.commerce-header,
+.commerce-footer {
+  align-items: center;
+  background: rgba(255, 255, 255, 0.86);
+  box-shadow: 0 0.625rem 1.875rem rgba(25, 20, 12, 0.08);
+  display: flex;
+  gap: 1.25rem;
+  justify-content: space-between;
+  margin: 0 auto;
+  max-width: 88rem;
+  padding: 1.25rem 1.75rem;
+}
+
+.commerce-logo {
+  font-size: 1.35rem;
+  font-weight: 800;
+}
+
+.commerce-nav,
+.commerce-actions,
+.commerce-language {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.75rem;
+}
+
+.commerce-nav {
+  margin: 0;
+}
+
+.commerce-pill,
+.commerce-button,
+.commerce-link-button,
+.commerce-cart-button,
+.commerce-quantity-button {
+  align-items: center;
+  border-radius: 999px;
+  border: 0.0625rem solid rgba(23, 23, 23, 0.14);
+  box-shadow: 0 0.25rem 0.75rem rgba(20, 17, 10, 0.08);
+  color: #14120d;
+  display: inline-flex;
+  font: inherit;
+  font-weight: 750;
+  justify-content: center;
+  min-height: 2.5rem;
+  padding: 0.65rem 1.05rem;
+  text-decoration: none;
+}
+
+.commerce-button {
+  background: #00624b;
+  border-color: #00624b;
+  color: #ffffff;
+}
+
+.commerce-link-button,
+.commerce-pill,
+.commerce-cart-button,
+.commerce-quantity-button {
+  background: rgba(255, 255, 255, 0.92);
+}
+
+.commerce-page {
+  margin: 3rem auto 0;
+  max-width: 88rem;
+}
+
+.commerce-product {
+  align-items: center;
+  display: grid;
+  gap: clamp(2rem, 5vw, 4rem);
+  grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.95fr);
+}
+
+.commerce-product-media {
+  aspect-ratio: 1 / 0.92;
+  background:
+    linear-gradient(180deg, rgba(255, 255, 255, 0.62), rgba(255, 255, 255, 0) 42%),
+    linear-gradient(135deg, #97c66d 0 20%, #6f9748 20% 34%, #d6c15d 34% 36%, #6a8f3e 36% 46%, #315824 46% 64%, #8bb85e 64% 100%);
+  border: 1.25rem solid #ffe987;
+  border-radius: 1.6rem;
+  box-shadow: inset 0 -7rem 8rem rgba(58, 77, 35, 0.22);
+  overflow: hidden;
+}
+
+.commerce-product-media::after {
+  background:
+    radial-gradient(circle at 27% 76%, #1e2422 0 5%, transparent 5.4%),
+    radial-gradient(circle at 55% 76%, #1e2422 0 6%, transparent 6.4%),
+    linear-gradient(0deg, #004b7b 0 100%);
+  border-radius: 1.2rem;
+  content: "";
+  display: block;
+  height: 19%;
+  margin: 58% auto 0;
+  width: 42%;
+}
+
+.commerce-eyebrow {
+  color: #00624b;
+  font-size: 0.85rem;
+  font-weight: 850;
+  letter-spacing: 0.16rem;
+  text-transform: uppercase;
+}
+
+.commerce-title {
+  font-size: clamp(2.5rem, 6vw, 4.8rem);
+  line-height: 0.95;
+  margin: 0.65rem 0 1.4rem;
+}
+
+.commerce-lede {
+  color: #555149;
+  font-size: 1.2rem;
+  line-height: 1.65;
+  max-width: 42rem;
+}
+
+.commerce-facts {
+  display: grid;
+  gap: 1rem;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  margin: 2rem 0;
+}
+
+.commerce-fact,
+.commerce-card,
+.commerce-cart-panel {
+  background: rgba(255, 255, 255, 0.92);
+  border-radius: 1rem;
+  box-shadow: 0 0.5rem 1.25rem rgba(25, 20, 12, 0.08);
+  padding: 1.25rem;
+}
+
+.commerce-fact span,
+.commerce-card span {
+  color: #767067;
+  display: block;
+  font-weight: 750;
+  margin-bottom: 0.45rem;
+}
+
+.commerce-fact strong {
+  font-size: 1.1rem;
+}
+
+.commerce-checkout {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.75rem;
+}
+
+.commerce-section-title {
+  font-size: 1.8rem;
+  margin: 4.5rem 0 1.5rem;
+}
+
+.commerce-grid {
+  display: grid;
+  gap: 1rem;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
+.commerce-card strong {
+  display: block;
+  font-size: 1.45rem;
+}
+
+.commerce-cart-panel {
+  margin-top: 2rem;
+}
+
+.commerce-cart-line {
+  align-items: center;
+  border-top: 0.0625rem solid rgba(23, 23, 23, 0.12);
+  display: grid;
+  gap: 1rem;
+  grid-template-columns: minmax(0, 1fr) auto;
+  padding: 1rem 0;
+}
+
+.commerce-cart-line:first-of-type {
+  border-top: 0;
+}
+
+.commerce-quantity {
+  align-items: center;
+  display: flex;
+  gap: 0.45rem;
+}
+
+.commerce-quantity-button {
+  min-height: 2rem;
+  min-width: 2rem;
+  padding: 0.25rem;
+}
+
+.commerce-boundary-toggle {
+  align-items: center;
+  background: rgba(255, 255, 255, 0.92);
+  border-radius: 0.8rem;
+  bottom: 1.5rem;
+  box-shadow: 0 0.75rem 2rem rgba(18, 15, 10, 0.14);
+  display: flex;
+  gap: 0.65rem;
+  left: 1.5rem;
+  padding: 0.8rem 1rem;
+  position: fixed;
+  z-index: 80;
+}
+
+.commerce-boundary-toggle input {
+  accent-color: #00624b;
+  height: 1rem;
+  width: 1rem;
+}
+
+.boundary-overlay {
+  inset: 0;
+  pointer-events: none;
+  position: fixed;
+  z-index: 70;
+}
+
+.boundary-overlay__box {
+  border: 0.0625rem solid var(--boundary-color);
+  border-radius: 0.55rem;
+  box-shadow:
+    0 0 0 0.0625rem rgba(255, 255, 255, 0.72),
+    0 0.35rem 1.25rem color-mix(in srgb, var(--boundary-color) 20%, transparent);
+  position: fixed;
+}
+
+.boundary-overlay__label {
+  background: color-mix(in srgb, var(--boundary-color) 88%, white);
+  border-radius: 999px;
+  color: #0b0a08;
+  font-size: 0.7rem;
+  font-weight: 850;
+  line-height: 1;
+  padding: 0.3rem 0.55rem;
+  position: absolute;
+  right: 0.35rem;
+  top: 0.35rem;
+  white-space: nowrap;
+}
+
+.boundary-overlay__box[data-label-placement="above"] .boundary-overlay__label {
+  bottom: calc(100% + 0.25rem);
+  top: auto;
+}
+
+@media (max-width: 860px) {
+  .commerce-header,
+  .commerce-footer,
+  .commerce-product,
+  .commerce-grid,
+  .commerce-facts {
+    grid-template-columns: 1fr;
+  }
+
+  .commerce-header,
+  .commerce-footer {
+    align-items: flex-start;
+    flex-direction: column;
+  }
+
+  .commerce-product-media {
+    min-height: 20rem;
+  }
+}
+`;
+}
+function createPostcssConfig() {
+    return `export default {
+  plugins: {
+    '@tailwindcss/postcss': {},
+  },
+};
+`;
+}
+function createTailwindConfig() {
+    return `import type { Config } from 'tailwindcss';
+
+export default {
+  content: ['./src/**/*.{js,jsx,ts,tsx}'],
+} satisfies Config;
+`;
+}
+function createLocalizedHeadComponent() {
+    return `const fallbackLanguage = 'en';
+const supportedLanguages = ['en', 'cs'] as const;
+type SupportedLanguage = (typeof supportedLanguages)[number];
+
+const localizedPath = (language: SupportedLanguage) => \`/\${language}\`;
+
+const absoluteUrl = (pathname: string) => {
+  const origin = ULTRAMODERN_SITE_URL.replace(/\\/+$/u, '');
+  return \`\${origin}\${pathname}\`;
+};
+const LocalizedHead = () => {
+  const canonicalPath = localizedPath(fallbackLanguage);
+
+  return (
+    <>
+      <link rel="canonical" href={absoluteUrl(canonicalPath)} />
+      {supportedLanguages.map(code => (
+        <link
+          href={absoluteUrl(localizedPath(code))}
+          hrefLang={code}
+          key={code}
+          rel="alternate"
+        />
+      ))}
+      <link
+        href={absoluteUrl(localizedPath(fallbackLanguage))}
+        hrefLang="x-default"
+        rel="alternate"
+      />
+    </>
+  );
+};
+`;
+}
 function createShellPage() {
-    return `const remotes = [
-  'remote-commerce',
-  'remote-identity',
-  'remote-design-system',
-];
+    return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { ultramodernUiMarker } from '../../ultramodern-build';
+
+const languageCodes = ['en', 'cs'] as const;
 
+const remoteKeys = ['commerce', 'identity', 'designSystem'] as const;
+
+${createLocalizedHeadComponent()}
 export default function ShellHome() {
+  const { i18nInstance, language } = useModernI18n();
+  const t = i18nInstance.t.bind(i18nInstance);
+
   return (
     <main>
-      <h1>UltraModern SuperApp Shell</h1>
+      <LocalizedHead />
+      <nav aria-label={t('shell.language.switcher')}>
+        {languageCodes.map(code => (
+          <a
+            aria-current={language === code ? 'page' : undefined}
+            href={\`/\${code}\`}
+            key={code}
+          >
+            {t(\`shell.language.\${code}\`)}
+          </a>
+        ))}
+      </nav>
+      <h1>{t('shell.title')}</h1>
       <p data-testid="ultramodern-preset">presetUltramodern workspace</p>
+      <p data-build-marker={ultramodernUiMarker.build} data-testid="ultramodern-ui-marker">
+        {ultramodernUiMarker.appId}:{ultramodernUiMarker.version}
+      </p>
       <ul>
-        {remotes.map(remote => (
-          <li key={remote}>{remote}</li>
+        {remoteKeys.map(remote => (
+          <li key={remote}>{t(\`shell.remotes.\${remote}\`)}</li>
         ))}
       </ul>
     </main>
@@ -1205,45 +2083,603 @@ export default function ShellHome() {
 `;
 }
 function createRemotePage(app) {
-    return `export default function ${toPascalCase(app.id)}Home() {
-  return (
+    if ('remote-commerce' === app.id) return createCommerceRemotePage(app);
+    const effectBffImport = appHasEffectApi(app) ? `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { useEffect, useState } from 'react';
+import { ultramodernUiMarker } from '../../ultramodern-build';
+` : "import { useModernI18n } from '@modern-js/plugin-i18n/runtime';\nimport { ultramodernUiMarker } from '../../ultramodern-build';\n";
+    const effectBffState = appHasEffectApi(app) ? `  const [effectApiStatus, setEffectApiStatus] = useState('pending');
+
+  useEffect(() => {
+    void fetch('${effectApiPrefix(app)}/effect/${effectApiStem(app)}?limit=1', {
+      headers: {
+        accept: 'application/json',
+      },
+    })
+      .then(response => {
+        if (!response.ok) {
+          throw new Error(\`Effect BFF request failed: \${response.status}\`);
+        }
+
+        return response.json() as Promise<{ items?: Array<{ title?: string }> }>;
+      })
+      .then(data => {
+        setEffectApiStatus(data.items[0]?.title ?? 'empty');
+      })
+      .catch(() => {
+        setEffectApiStatus('unavailable');
+      });
+  }, []);
+
+` : '';
+    const effectBffMarkup = appHasEffectApi(app) ? `      <p data-testid="effect-bff-status">{effectApiStatus}</p>
+` : '';
+    return `${effectBffImport}
+${createLocalizedHeadComponent()}
+export default function ${toPascalCase(app.id)}Home() {
+  const { i18nInstance, language } = useModernI18n();
+  const t = i18nInstance.t.bind(i18nInstance);
+${effectBffState}  return (
     <main>
-      <h1>${app.displayName}</h1>
-      <p data-mf-role="${app.kind}">${app.domain ?? app.kind}</p>
+      <LocalizedHead />
+      <nav aria-label={t('${app.domain}.language.switcher')}>
+        {supportedLanguages.map(code => (
+          <a
+            aria-current={language === code ? 'page' : undefined}
+            href={\`/\${code}\`}
+            key={code}
+          >
+            {t(\`${app.domain}.language.\${code}\`)}
+          </a>
+        ))}
+      </nav>
+      <h1>{t('${app.domain}.title')}</h1>
+      <p data-mf-role="${app.kind}">{t('${app.domain}.role')}</p>
+      <p data-build-marker={ultramodernUiMarker.build} data-testid="ultramodern-ui-marker">
+        {ultramodernUiMarker.appId}:{ultramodernUiMarker.version}
+      </p>
+${effectBffMarkup}    </main>
+  );
+}
+`;
+}
+function createCommerceRemotePage(app) {
+    return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { useEffect, useState, type CSSProperties } from 'react';
+import { ultramodernUiMarker } from '../../ultramodern-build';
+
+const languageCodes = ['en', 'cs'] as const;
+
+const boundaryDefinitions = [
+  {
+    color: '#ff5a57',
+    id: 'explore',
+    labelKey: 'commerce.boundaries.explore',
+  },
+  {
+    color: '#24d671',
+    id: 'decide',
+    labelKey: 'commerce.boundaries.decide',
+  },
+  {
+    color: '#f4d044',
+    id: 'checkout',
+    labelKey: 'commerce.boundaries.checkout',
+  },
+] as const;
+
+type BoundaryId = (typeof boundaryDefinitions)[number]['id'];
+type BoundaryDefinition = (typeof boundaryDefinitions)[number];
+
+const boundaryMetadata: Record<BoundaryId, BoundaryDefinition> = {
+  checkout: boundaryDefinitions[2],
+  decide: boundaryDefinitions[1],
+  explore: boundaryDefinitions[0],
+};
+
+const products = [
+  {
+    id: 'field-loader-112',
+    titleKey: 'commerce.products.fieldLoader.title',
+    descriptionKey: 'commerce.products.fieldLoader.description',
+    priceKey: 'commerce.products.fieldLoader.price',
+    powerKey: 'commerce.products.fieldLoader.power',
+    availabilityKey: 'commerce.products.fieldLoader.availability',
+  },
+  {
+    id: 'orchard-tractor',
+    titleKey: 'commerce.products.orchard.title',
+    badgeKey: 'commerce.products.orchard.badge',
+  },
+  {
+    id: 'autonomy-kit',
+    titleKey: 'commerce.products.autonomy.title',
+    badgeKey: 'commerce.products.autonomy.badge',
+  },
+] as const;
+
+type ProductId = (typeof products)[number]['id'];
+type CartState = Partial<Record<ProductId, number>>;
+
+type BoundaryLabels = Record<BoundaryId, string>;
+type BoundaryBox = {
+  color: string;
+  height: number;
+  id: BoundaryId;
+  label: string;
+  labelPlacement: 'above' | 'inside';
+  left: number;
+  top: number;
+  width: number;
+};
+
+const featuredProduct = products[0];
+const recommendations = [products[1], products[2]] as const;
+
+${createLocalizedHeadComponent()}
+const isBoundaryId = (value: string): value is BoundaryId =>
+  Object.prototype.hasOwnProperty.call(boundaryMetadata, value);
+
+function collectBoundaryBoxes(labels: BoundaryLabels): BoundaryBox[] {
+  return Array.from(
+    document.querySelectorAll<HTMLElement>('[data-boundary], [data-boundary-page]'),
+  )
+    .map(element => {
+      const id = element.dataset.boundary ?? element.dataset.boundaryPage;
+
+      if (id === undefined || !isBoundaryId(id)) {
+        return undefined;
+      }
+
+      const rect = element.getBoundingClientRect();
+
+      if (rect.width <= 0 || rect.height <= 0) {
+        return undefined;
+      }
+
+      return {
+        color: boundaryMetadata[id].color,
+        height: rect.height,
+        id,
+        label: labels[id],
+        labelPlacement: rect.top > 28 ? 'above' : 'inside',
+        left: rect.left,
+        top: rect.top,
+        width: rect.width,
+      };
+    })
+    .filter((box): box is BoundaryBox => box !== undefined);
+}
+
+function BoundaryOverlay({
+  labels,
+  visible,
+}: {
+  labels: BoundaryLabels;
+  visible: boolean;
+}) {
+  const [boxes, setBoxes] = useState<BoundaryBox[]>([]);
+
+  useEffect(() => {
+    if (!visible) {
+      setBoxes([]);
+      return;
+    }
+
+    let animationFrame = 0;
+    const update = () => {
+      cancelAnimationFrame(animationFrame);
+      animationFrame = requestAnimationFrame(() => {
+        setBoxes(collectBoundaryBoxes(labels));
+      });
+    };
+    const observer = new ResizeObserver(update);
+
+    observer.observe(document.body);
+    update();
+    window.addEventListener('resize', update);
+    window.addEventListener('scroll', update, true);
+
+    return () => {
+      cancelAnimationFrame(animationFrame);
+      observer.disconnect();
+      window.removeEventListener('resize', update);
+      window.removeEventListener('scroll', update, true);
+    };
+  }, [labels, visible]);
+
+  if (!visible) {
+    return null;
+  }
+
+  return (
+    <div aria-hidden="true" className="boundary-overlay">
+      {boxes.map((box, index) => (
+        <div
+          className="boundary-overlay__box"
+          data-boundary-id={box.id}
+          data-label-placement={box.labelPlacement}
+          key={\`\${box.id}-\${index}\`}
+          style={{
+            '--boundary-color': box.color,
+            height: box.height,
+            left: box.left,
+            top: box.top,
+            width: box.width,
+          } as CSSProperties}
+        >
+          <span className="boundary-overlay__label">{box.label}</span>
+        </div>
+      ))}
+    </div>
+  );
+}
+
+export default function ${toPascalCase(app.id)}Home() {
+  const { i18nInstance, language } = useModernI18n();
+  const t = i18nInstance.t.bind(i18nInstance);
+  const [cart, setCart] = useState<CartState>({});
+  const [showBoundaries, setShowBoundaries] = useState(false);
+  const [effectApiStatus, setEffectApiStatus] = useState('pending');
+  const boundaryLabels = {
+    checkout: t('commerce.boundaries.checkout'),
+    decide: t('commerce.boundaries.decide'),
+    explore: t('commerce.boundaries.explore'),
+  } satisfies BoundaryLabels;
+  const cartLines = products
+    .map(product => ({
+      product,
+      quantity: cart[product.id] ?? 0,
+    }))
+    .filter(line => line.quantity > 0);
+  const cartCount = cartLines.reduce((total, line) => total + line.quantity, 0);
+
+  useEffect(() => {
+    void fetch('${effectApiPrefix(app)}/effect/${effectApiStem(app)}?limit=1', {
+      headers: {
+        accept: 'application/json',
+      },
+    })
+      .then(response => {
+        if (!response.ok) {
+          throw new Error(\`Effect BFF request failed: \${response.status}\`);
+        }
+
+        return response.json() as Promise<{ items?: Array<{ title?: string }> }>;
+      })
+      .then(data => {
+        setEffectApiStatus(data.items[0]?.title ?? 'empty');
+      })
+      .catch(() => {
+        setEffectApiStatus('unavailable');
+      });
+  }, []);
+
+  const addToCart = (id: ProductId) => {
+    setCart(current => ({
+      ...current,
+      [id]: (current[id] ?? 0) + 1,
+    }));
+  };
+
+  const reduceQuantity = (id: ProductId) => {
+    setCart(current => {
+      const quantity = current[id] ?? 0;
+      const next = { ...current };
+
+      if (quantity <= 1) {
+        delete next[id];
+      } else {
+        next[id] = quantity - 1;
+      }
+
+      return next;
+    });
+  };
+
+  const removeFromCart = (id: ProductId) => {
+    setCart(current => {
+      const next = { ...current };
+
+      delete next[id];
+      return next;
+    });
+  };
+
+  return (
+    <main className="commerce-shell">
+      <LocalizedHead />
+      <BoundaryOverlay labels={boundaryLabels} visible={showBoundaries} />
+      <header className="commerce-header" data-boundary="explore">
+        <strong className="commerce-logo">{t('commerce.brand')}</strong>
+        <nav aria-label={t('commerce.navigation.primary')} className="commerce-nav">
+          <a className="commerce-pill" href="#machines">
+            {t('commerce.navigation.machines')}
+          </a>
+          <a className="commerce-pill" href="#checkout">
+            {t('commerce.navigation.checkout')}
+          </a>
+        </nav>
+        <div className="commerce-actions">
+          <a className="commerce-cart-button" data-boundary="checkout" href="#cart">
+            {t('commerce.cart.button', { count: cartCount })}
+          </a>
+          <nav aria-label={t('commerce.language.switcher')} className="commerce-language">
+            {languageCodes.map(code => (
+              <a
+                aria-current={language === code ? 'page' : undefined}
+                className="commerce-pill"
+                href={\`/\${code}\`}
+                key={code}
+              >
+                {t(\`commerce.language.\${code}\`)}
+              </a>
+            ))}
+          </nav>
+        </div>
+      </header>
+
+      <div className="commerce-page">
+        <section className="commerce-product" data-boundary-page="decide" id="machines">
+          <div
+            aria-label={t('commerce.products.fieldLoader.imageAlt')}
+            className="commerce-product-media"
+            role="img"
+          />
+          <div>
+            <p className="commerce-eyebrow">{t('commerce.detail.eyebrow')}</p>
+            <h1 className="commerce-title">{t(featuredProduct.titleKey)}</h1>
+            <p className="commerce-lede">{t(featuredProduct.descriptionKey)}</p>
+            <div className="commerce-facts">
+              <div className="commerce-fact">
+                <span>{t('commerce.detail.price')}</span>
+                <strong>{t(featuredProduct.priceKey)}</strong>
+              </div>
+              <div className="commerce-fact">
+                <span>{t('commerce.detail.power')}</span>
+                <strong>{t(featuredProduct.powerKey)}</strong>
+              </div>
+              <div className="commerce-fact">
+                <span>{t('commerce.detail.availability')}</span>
+                <strong>{t(featuredProduct.availabilityKey)}</strong>
+              </div>
+            </div>
+            <div className="commerce-checkout" data-boundary="checkout" id="checkout">
+              <button
+                className="commerce-button"
+                onClick={() => addToCart(featuredProduct.id)}
+                type="button"
+              >
+                {t('commerce.cart.add')}
+              </button>
+              <a className="commerce-link-button" href="#cart">
+                {t('commerce.cart.view')}
+              </a>
+            </div>
+          </div>
+        </section>
+
+        <section data-boundary="explore">
+          <h2 className="commerce-section-title">{t('commerce.recommendations.title')}</h2>
+          <div className="commerce-grid">
+            {recommendations.map(product => (
+              <article className="commerce-card" key={product.id}>
+                <span>{t(product.badgeKey)}</span>
+                <strong>{t(product.titleKey)}</strong>
+              </article>
+            ))}
+          </div>
+        </section>
+
+        <section className="commerce-cart-panel" data-boundary="checkout" id="cart">
+          <h2>{t('commerce.cart.title')}</h2>
+          {cartLines.length === 0 ? (
+            <p>{t('commerce.cart.empty')}</p>
+          ) : (
+            cartLines.map(line => (
+              <div className="commerce-cart-line" key={line.product.id}>
+                <strong>{t(line.product.titleKey)}</strong>
+                <div className="commerce-quantity">
+                  <button
+                    aria-label={t('commerce.cart.decrease', {
+                      name: t(line.product.titleKey),
+                    })}
+                    className="commerce-quantity-button"
+                    onClick={() => reduceQuantity(line.product.id)}
+                    type="button"
+                  >
+                    -
+                  </button>
+                  <span>{line.quantity}</span>
+                  <button
+                    aria-label={t('commerce.cart.increase', {
+                      name: t(line.product.titleKey),
+                    })}
+                    className="commerce-quantity-button"
+                    onClick={() => addToCart(line.product.id)}
+                    type="button"
+                  >
+                    +
+                  </button>
+                  <button
+                    className="commerce-link-button"
+                    onClick={() => removeFromCart(line.product.id)}
+                    type="button"
+                  >
+                    {t('commerce.cart.remove')}
+                  </button>
+                </div>
+              </div>
+            ))
+          )}
+        </section>
+      </div>
+
+      <footer className="commerce-footer" data-boundary="explore">
+        <span>{t('commerce.footer.stack')}</span>
+        <span data-testid="effect-bff-status">{effectApiStatus}</span>
+        <span data-build-marker={ultramodernUiMarker.build} data-testid="ultramodern-ui-marker">
+          {ultramodernUiMarker.appId}:{ultramodernUiMarker.version}
+        </span>
+      </footer>
+
+      <label className="commerce-boundary-toggle">
+        <input
+          checked={showBoundaries}
+          onChange={event => setShowBoundaries(event.currentTarget.checked)}
+          type="checkbox"
+        />
+        {t('commerce.boundaries.toggle')}
+      </label>
     </main>
   );
 }
 `;
 }
 function createLayout(appId) {
-    return `import type { ReactNode } from 'react';
+    return `import { Outlet } from '@modern-js/plugin-tanstack/runtime';
+import './index.css';
 
-export default function Layout({ children }: { children: ReactNode }) {
-  return <div data-app-id="${appId}">{children}</div>;
+export default function Layout() {
+  return (
+    <div data-app-id="${appId}">
+      <Outlet />
+    </div>
+  );
 }
 `;
 }
 function createRemoteEntry(app) {
-    const componentName = 'remote-identity' === app.id ? 'IdentityWidget' : 'CommerceWidget';
-    return `export { default } from './components/${componentName}';
+    return `export { default } from './components/${remoteWidgetFile(app)}';
 `;
 }
 function createRemoteWidget(app) {
-    const componentName = 'remote-identity' === app.id ? 'IdentityWidget' : 'CommerceWidget';
+    const componentName = `${toPascalCase(app.domain ?? app.id)}Widget`;
+    const body = 'vertical' === app.kind ? `Owns the ${app.domain} vertical route surface.` : 'Provides shared UI primitives for the workspace.';
     return `export default function ${componentName}() {
   return (
     <section data-mf-remote="${app.id}">
       <h2>${app.displayName}</h2>
-      <p>Owns the ${app.domain} vertical route surface.</p>
+      <p>${body}</p>
     </section>
   );
 }
 `;
 }
+function createAppLocaleMessages(app, language) {
+    const czechLabels = {
+        commerce: {
+            role: 'obchod',
+            title: 'Obchodní remote'
+        },
+        'design-system': {
+            role: 'design system',
+            title: 'Design system remote'
+        },
+        identity: {
+            role: 'identita',
+            title: 'Identitní remote'
+        }
+    };
+    if ('shell' === app.kind) return {
+        shell: {
+            language: {
+                cs: 'en' === language ? 'Czech' : 'Čeština',
+                en: 'en' === language ? 'English' : 'Angličtina',
+                switcher: 'en' === language ? 'Language' : 'Jazyk'
+            },
+            remotes: {
+                commerce: 'en' === language ? 'Commerce Remote' : 'Obchodní remote',
+                designSystem: 'en' === language ? 'Design System Remote' : 'Design system remote',
+                identity: 'en' === language ? 'Identity Remote' : 'Identitní remote'
+            },
+            title: 'en' === language ? 'UltraModern SuperApp Shell' : 'UltraModern SuperApp shell'
+        }
+    };
+    const domain = app.domain ?? app.id;
+    const czechLabel = czechLabels[domain] ?? {
+        role: domain,
+        title: `${app.displayName} CZ`
+    };
+    if ('commerce' === domain) return {
+        commerce: {
+            boundaries: {
+                checkout: 'en' === language ? 'checkout' : 'pokladna',
+                decide: 'en' === language ? 'decide' : 'rozhodování',
+                explore: 'en' === language ? 'explore' : 'procházení',
+                toggle: 'en' === language ? 'show team boundaries' : 'zobrazit hranice týmů'
+            },
+            brand: 'Acre & Iron',
+            cart: {
+                add: 'en' === language ? 'Add to cart' : 'Přidat do košíku',
+                button: 'en' === language ? 'Your cart ({{count}})' : 'Košík ({{count}})',
+                decrease: 'en' === language ? 'Decrease {{name}} quantity' : 'Snížit množství položky {{name}}',
+                empty: 'en' === language ? 'Your cart is empty.' : 'Košík je prázdný.',
+                increase: 'en' === language ? 'Increase {{name}} quantity' : 'Zvýšit množství položky {{name}}',
+                remove: 'en' === language ? 'Remove' : 'Odebrat',
+                title: 'en' === language ? 'Cart' : 'Košík',
+                view: 'en' === language ? 'View cart' : 'Zobrazit košík'
+            },
+            detail: {
+                availability: 'en' === language ? 'Availability' : 'Dostupnost',
+                eyebrow: 'en' === language ? 'Machine detail' : 'Detail stroje',
+                power: 'en' === language ? 'Power' : 'Výkon',
+                price: 'en' === language ? 'Price' : 'Cena'
+            },
+            footer: {
+                stack: 'en' === language ? 'SPA, SSR-ready Module Federation, React, Effect BFF' : 'SPA, SSR-ready Module Federation, React, Effect BFF'
+            },
+            language: {
+                cs: 'en' === language ? 'Czech' : 'Čeština',
+                en: 'en' === language ? 'English' : 'Angličtina',
+                switcher: 'en' === language ? 'Language' : 'Jazyk'
+            },
+            navigation: {
+                checkout: 'en' === language ? 'Checkout' : 'Pokladna',
+                machines: 'en' === language ? 'Machines' : 'Stroje',
+                primary: 'en' === language ? 'Primary commerce navigation' : 'Hlavní navigace obchodu'
+            },
+            products: {
+                autonomy: {
+                    badge: 'en' === language ? 'AI-first option' : 'AI varianta',
+                    title: 'en' === language ? 'Autonomy Retrofit Kit' : 'Sada pro autonomní řízení'
+                },
+                fieldLoader: {
+                    availability: 'en' === language ? 'In stock' : 'Skladem',
+                    description: 'en' === language ? 'A loader-ready tractor for feed, hay, gravel, and winter road work.' : 'Traktor připravený na nakladač pro krmivo, seno, štěrk i zimní údržbu cest.',
+                    imageAlt: 'en' === language ? 'Field Loader 112 tractor working on a bright farm lane' : 'Traktor Field Loader 112 pracuje na světlé polní cestě',
+                    power: '112 hp',
+                    price: 'EUR 42,500',
+                    title: 'Field Loader 112'
+                },
+                orchard: {
+                    badge: 'en' === language ? 'Best for tight rows' : 'Nejlepší do úzkých řádků',
+                    title: 'en' === language ? 'Narrow Orchard Tractor' : 'Úzký sadový traktor'
+                }
+            },
+            recommendations: {
+                title: 'en' === language ? 'Compare alternatives' : 'Porovnat alternativy'
+            },
+            role: 'en' === language ? 'commerce' : 'obchod',
+            title: 'en' === language ? app.displayName : czechLabel.title
+        }
+    };
+    return {
+        [domain]: {
+            language: {
+                cs: 'en' === language ? 'Czech' : 'Čeština',
+                en: 'en' === language ? 'English' : 'Angličtina',
+                switcher: 'en' === language ? 'Language' : 'Jazyk'
+            },
+            role: 'en' === language ? app.domain ?? app.kind : czechLabel.role,
+            title: 'en' === language ? app.displayName : czechLabel.title
+        }
+    };
+}
 function createDesignButton() {
     return `import { designTokens } from '../tokens';
 
-export default function Button({ label = 'Design System Button' }: { label?: string }) {
+export default function Button({ label }: { label: string }) {
   return (
     <button
       type="button"
@@ -1261,8 +2697,8 @@ export default function Button({ label = 'Design System Button' }: { label?: str
 function createDesignTokens() {
     return `export const designTokens = {
   color: {
-    foreground: '#133225',
     accent: '#2f8f68',
+    foreground: '#133225',
   },
   radius: {
     control: '999px',
@@ -1270,70 +2706,373 @@ function createDesignTokens() {
 } as const;
 `;
 }
-function createEffectSharedApi() {
+function serviceEffectApiExport(service = effectService) {
+    return `${toCamelCase(effectApiStem(service))}EffectApi`;
+}
+function serviceEffectGroupName(service = effectService) {
+    return toCamelCase(effectApiStem(service));
+}
+function serviceEffectApiName(service = effectService) {
+    return `${toPascalCase(effectApiStem(service))}EffectApi`;
+}
+function serviceEffectSchemaExport(service = effectService) {
+    return `${toCamelCase(effectApiStem(service))}ItemSchema`;
+}
+function serviceEffectErrorStem(service = effectService) {
+    const stem = effectApiStem(service);
+    return 'recommendations' === stem ? 'recommendation' : stem;
+}
+function serviceEffectCreatePayloadSchemaExport(service = effectService) {
+    return `${toCamelCase(effectApiStem(service))}CreatePayloadSchema`;
+}
+function serviceEffectNotFoundErrorExport(service = effectService) {
+    return `${toPascalCase(serviceEffectErrorStem(service))}NotFound`;
+}
+function serviceEffectNotFoundSchemaExport(service = effectService) {
+    return `${toCamelCase(serviceEffectErrorStem(service))}NotFoundSchema`;
+}
+function createEffectSharedApiImports() {
     return `import {
   HttpApi,
   HttpApiEndpoint,
   HttpApiGroup,
+  HttpApiSchema,
   Schema,
 } from '@modern-js/plugin-bff/effect-client';
-
-const recommendationSchema = Schema.Struct({
+`;
+}
+function createEffectSharedApiContract(service = effectService) {
+    const schemaExport = serviceEffectSchemaExport(service);
+    const createPayloadSchemaExport = serviceEffectCreatePayloadSchemaExport(service);
+    const notFoundErrorExport = serviceEffectNotFoundErrorExport(service);
+    const notFoundSchemaExport = serviceEffectNotFoundSchemaExport(service);
+    const apiExport = serviceEffectApiExport(service);
+    const apiName = serviceEffectApiName(service);
+    const groupName = serviceEffectGroupName(service);
+    const stem = effectApiStem(service);
+    const servicePrefix = effectApiPrefix(service);
+    return `export const ${schemaExport} = Schema.Struct({
   id: Schema.String,
+  marker: Schema.Struct({
+    appId: Schema.String,
+    packageName: Schema.String,
+    version: Schema.String,
+    build: Schema.String,
+    deployProfile: Schema.String,
+    surface: Schema.String,
+  }),
+  title: Schema.String,
+});
+
+export const ${createPayloadSchemaExport} = Schema.Struct({
   title: Schema.String,
 });
 
-export const recommendationsEffectApi = HttpApi.make(
-  'RecommendationsEffectApi',
-).add(
-  HttpApiGroup.make('recommendations').add(
-    HttpApiEndpoint.get('list', '/effect/recommendations', {
-      success: Schema.Struct({
-        items: Schema.Array(recommendationSchema),
+export class ${notFoundErrorExport} extends Schema.TaggedErrorClass<${notFoundErrorExport}>()(
+  '${notFoundErrorExport}',
+  {
+    id: Schema.String,
+  },
+) {}
+
+export const ${notFoundSchemaExport} = ${notFoundErrorExport}.pipe(
+  HttpApiSchema.status(404),
+);
+
+export type OperationContext = {
+  operationId: string;
+  routePath: string;
+  method: string;
+  source: string;
+  traceId?: string;
+};
+
+export const ${apiExport} = HttpApi.make('${apiName}').add(
+  HttpApiGroup.make('${groupName}')
+    .add(
+      HttpApiEndpoint.get('list', '/effect/${stem}', {
+        query: {
+          limit: Schema.optional(Schema.NumberFromString),
+        },
+        success: Schema.Struct({
+          items: Schema.Array(${schemaExport}),
+        }),
       }),
-    }),
-  ),
+    )
+    .add(
+      HttpApiEndpoint.get('get', '/effect/${stem}/:id', {
+        params: {
+          id: Schema.String,
+        },
+        success: ${schemaExport},
+        error: ${notFoundSchemaExport},
+      }),
+    )
+    .add(
+      HttpApiEndpoint.post('create', '/effect/${stem}', {
+        payload: ${createPayloadSchemaExport},
+        success: Schema.Struct({
+          item: ${schemaExport},
+        }),
+      }),
+    ),
 );
+
+export const ${groupName}OperationContexts = {
+  list: {
+    operationId: '${apiName}:${groupName}:list',
+    routePath: '/effect/${stem}',
+    method: 'GET',
+    source: 'generated-client',
+  },
+  get: {
+    operationId: '${apiName}:${groupName}:get',
+    routePath: '/effect/${stem}/:id',
+    method: 'GET',
+    source: 'generated-client',
+  },
+  create: {
+    operationId: '${apiName}:${groupName}:create',
+    routePath: '/effect/${stem}',
+    method: 'POST',
+    source: 'generated-client',
+  },
+} satisfies Record<string, OperationContext>;
+
+export const ${groupName}ApiContract = {
+  basePath: '${servicePrefix}/effect/${stem}',
+  ownerId: '${service.id}',
+  servicePrefix: '${servicePrefix}',
+} as const;
+`;
+}
+function createEffectSharedApi(service) {
+    if (service) return `${createEffectSharedApiImports()}
+${createEffectSharedApiContract(service)}`;
+    return `export const sharedEffectApiPackage = {
+  scope: 'external-effect-service-contracts',
+} as const;
 `;
 }
-function createEffectServiceEntry() {
+function createEffectServiceEntry(scope, service = effectService, contractImportPath = ultramodern_workspace_packageName(scope, 'shared-effect-api')) {
+    const apiExport = serviceEffectApiExport(service);
+    const groupName = serviceEffectGroupName(service);
+    const notFoundErrorExport = serviceEffectNotFoundErrorExport(service);
+    const stem = effectApiStem(service);
     return `import {
   defineEffectBff,
   Effect,
   HttpApiBuilder,
   Layer,
-} from '@modern-js/plugin-bff/effect-server';
-import { recommendationsEffectApi } from '../../shared/effect/api';
-
-const recommendationsLayer = HttpApiBuilder.group(
-  recommendationsEffectApi,
-  'recommendations',
-  (handlers: any) =>
-    handlers.handle('list', () =>
-      Effect.succeed({
-        items: [
-          {
-            id: 'starter-recommendation',
-            title: 'Wire a real recommendation source here',
+} from '@modern-js/plugin-bff/effect-edge';
+import { ultramodernApiMarker } from '../../src/ultramodern-build';
+import {
+  ${apiExport},
+  ${groupName}OperationContexts,
+  ${notFoundErrorExport},
+  type OperationContext,
+} from '${contractImportPath}';
+
+const ${groupName}Items = [
+  {
+    id: 'starter-${stem}',
+    marker: ultramodernApiMarker,
+    title: 'Wire a real ${stem} source here',
+  },
+];
+
+const operationAttributes = (operationContext: OperationContext) => {
+  return {
+    'modernjs.operation.id': operationContext.operationId,
+    'modernjs.operation.method': operationContext.method,
+    'modernjs.operation.route': operationContext.routePath,
+    'modernjs.operation.source': operationContext.source,
+    ...(typeof operationContext.traceId === 'string'
+      ? { 'modernjs.trace.id': operationContext.traceId }
+      : {}),
+  };
+};
+
+const ${groupName}Layer = HttpApiBuilder.group(
+  ${apiExport},
+  '${groupName}',
+  (handlers) =>
+    handlers
+      .handle('list', ({ query }) =>
+        Effect.succeed({
+          items:
+            typeof query.limit === 'number'
+              ? ${groupName}Items.slice(0, query.limit)
+              : ${groupName}Items,
+        }).pipe(
+          Effect.withSpan('ultramodern.effect.${groupName}.list', {
+            attributes: operationAttributes(${groupName}OperationContexts.list),
+            kind: 'server',
+          }),
+        ),
+      )
+      .handle('get', ({ params }) => {
+        const item = ${groupName}Items.find(item => item.id === params.id);
+        return (item !== undefined
+          ? Effect.succeed(item)
+          : Effect.fail(new ${notFoundErrorExport}({ id: params.id }))).pipe(
+            Effect.withSpan('ultramodern.effect.${groupName}.get', {
+              attributes: operationAttributes(${groupName}OperationContexts.get),
+              kind: 'server',
+            }),
+          );
+      })
+      .handle('create', ({ payload }) =>
+        Effect.succeed({
+          item: {
+            id: \`generated-${stem}-\${payload.title
+              .toLowerCase()
+              .replaceAll(/[^a-z0-9]+/g, '-')
+              .replaceAll(/^-|-$/g, '')}\`,
+            marker: ultramodernApiMarker,
+            title: payload.title,
           },
-        ],
-      }),
-    ),
+        }).pipe(
+          Effect.withSpan('ultramodern.effect.${groupName}.create', {
+            attributes: operationAttributes(${groupName}OperationContexts.create),
+            kind: 'server',
+          }),
+        ),
+      ),
 );
 
-const layer = HttpApiBuilder.layer(recommendationsEffectApi).pipe(
-  Layer.provide(recommendationsLayer),
+const layer = HttpApiBuilder.layer(${apiExport}).pipe(
+  Layer.provide(${groupName}Layer),
 );
 
 export default defineEffectBff({
-  api: recommendationsEffectApi,
+  api: ${apiExport},
   layer,
 });
 `;
 }
+function createEffectClient(service, contractImportPath) {
+    const apiExport = serviceEffectApiExport(service);
+    const contractExport = serviceEffectGroupName(service);
+    const stem = effectApiStem(service);
+    const groupName = serviceEffectGroupName(service);
+    const singular = serviceEffectErrorStem(service);
+    const clientOptionsName = `${toPascalCase(stem)}ClientOptions`;
+    const createClientName = `create${toPascalCase(stem)}Client`;
+    const listName = `list${toPascalCase(stem)}`;
+    const getName = `get${toPascalCase(singular)}`;
+    const createName = `create${toPascalCase(singular)}`;
+    return `import {
+  makeEffectHttpApiClient,
+  runEffectRequest,
+} from '@modern-js/plugin-bff/effect-client';
+import {
+  ${contractExport}ApiContract,
+  ${apiExport},
+  ${groupName}OperationContexts,
+  type OperationContext,
+} from '${contractImportPath}';
+
+export type ${clientOptionsName} = {
+  baseUrl?: string | URL;
+  locale?: string;
+  operationContext?: OperationContext;
+  traceparent?: string;
+};
+
+export function ${createClientName}(
+  options: ${clientOptionsName} = {},
+) {
+  return makeEffectHttpApiClient(${apiExport}, {
+    baseUrl: options.baseUrl ?? ${contractExport}ApiContract.servicePrefix,
+  });
+}
+
+export function ${listName}(
+  options: ${clientOptionsName} & { limit?: number } = {},
+) {
+  return runEffectRequest(
+    ${createClientName}({
+      ...options,
+      operationContext:
+        options.operationContext ?? ${groupName}OperationContexts.list,
+    }),
+  ).then(client =>
+    runEffectRequest(
+      client.${groupName}.list({ query: { limit: options.limit } }),
+    ),
+  );
+}
+
+export function ${getName}(
+  id: string,
+  options: ${clientOptionsName} = {},
+) {
+  return runEffectRequest(
+    ${createClientName}({
+      ...options,
+      operationContext:
+        options.operationContext ?? ${groupName}OperationContexts.get,
+    }),
+  ).then(client =>
+    runEffectRequest(client.${groupName}.get({ params: { id } })),
+  );
+}
+
+export function ${createName}(
+  title: string,
+  options: ${clientOptionsName} = {},
+) {
+  return runEffectRequest(
+    ${createClientName}({
+      ...options,
+      operationContext:
+        options.operationContext ?? ${groupName}OperationContexts.create,
+    }),
+  ).then(client =>
+    runEffectRequest(
+      client.${groupName}.create({ payload: { title } }),
+    ),
+  );
+}
+`;
+}
+function createShellEffectClient(scope) {
+    return `export {
+  createRecommendation,
+  createRecommendationsClient,
+  getRecommendation,
+  listRecommendations,
+  type RecommendationsClientOptions,
+} from '${ultramodern_workspace_packageName(scope, 'remote-commerce')}/effect/client';
+`;
+}
 function toPascalCase(value) {
     return value.split(/[-_]+/).filter(Boolean).map((part)=>`${part.charAt(0).toUpperCase()}${part.slice(1)}`).join('');
 }
+function effectApiTopologyMetadata(app) {
+    if (!appHasEffectApi(app)) return;
+    return {
+        effect: {
+            runtime: 'effect',
+            bff: {
+                prefix: app.effectApi.prefix,
+                openapi: '/openapi.json'
+            },
+            contract: {
+                export: './shared/effect/api',
+                path: `${app.directory}/shared/effect/api.ts`
+            },
+            client: {
+                export: './effect/client',
+                path: `${app.directory}/src/effect/${app.effectApi.stem}-client.ts`
+            },
+            serverEntry: `${app.directory}/api/effect/index.ts`,
+            basePath: `${app.effectApi.prefix}/effect/${app.effectApi.stem}`,
+            consumedBy: app.effectApi.consumedBy
+        }
+    };
+}
 function createTopology(scope) {
     return {
         schemaVersion: 1,
@@ -1373,25 +3112,12 @@ function createTopology(scope) {
                     fallbackTelemetryEvent: 'modernjs:mv-runtime-parity',
                     sharedContractVersion: 'mf-ssr-contract-v1'
                 },
+                ...effectApiTopologyMetadata(remote) ? {
+                    api: effectApiTopologyMetadata(remote)
+                } : {},
                 ownership: remote.ownership
             })),
-        effectServices: [
-            {
-                id: effectService.id,
-                kind: 'effect-service',
-                runtime: 'effect',
-                package: ultramodern_workspace_packageName(scope, effectService.packageSuffix),
-                consumedBy: [
-                    shellApp.id,
-                    'remote-commerce'
-                ],
-                bff: {
-                    prefix: '/recommendations-api',
-                    openapi: '/openapi.json'
-                },
-                ownership: effectService.ownership
-            }
-        ],
+        effectServices: [],
         sharedPackages: sharedPackages.map((sharedPackage)=>({
                 id: sharedPackage.id,
                 package: ultramodern_workspace_packageName(scope, sharedPackage.id),
@@ -1401,7 +3127,7 @@ function createTopology(scope) {
         validation: {
             script: "scripts/validate-ultramodern-workspace.mjs",
             commands: [
-                'pnpm ultramodern:check'
+                'mise exec -- pnpm ultramodern:check'
             ]
         }
     };
@@ -1413,12 +3139,6 @@ function createOwnership(scope) {
         owners: [
             shellApp,
             ...remoteApps,
-            {
-                id: effectService.id,
-                packageSuffix: effectService.packageSuffix,
-                directory: effectService.directory,
-                ownership: effectService.ownership
-            },
             ...sharedPackages.map((sharedPackage)=>({
                     id: sharedPackage.id,
                     packageSuffix: sharedPackage.id,
@@ -1456,19 +3176,15 @@ function createDevelopmentOverlay() {
         ].map((app)=>[
                 app.id,
                 app.port
-            ]).concat([
-            [
-                effectService.id,
-                effectService.port
-            ]
-        ])),
+            ])),
         manifests: Object.fromEntries(remoteApps.map((remote)=>[
                 remote.id,
                 `http://localhost:${remote.port}/mf-manifest.json`
             ])),
-        services: {
-            [effectService.id]: `http://localhost:${effectService.port}/recommendations-api`
-        }
+        apis: Object.fromEntries(verticalEffectApps().map((app)=>[
+                app.id,
+                `http://localhost:${app.port}${effectApiPrefix(app)}`
+            ]))
     };
 }
 function createPackageSourceMetadata(scope, packageSource) {
@@ -1498,6 +3214,232 @@ function createPackageSourceMetadata(scope, packageSource) {
         }
     };
 }
+function createEffectOperationContract(target) {
+    const stem = effectApiStem(target);
+    return {
+        group: serviceEffectGroupName(target),
+        notFound: serviceEffectNotFoundErrorExport(target),
+        operations: {
+            list: {
+                method: 'GET',
+                path: `/effect/${stem}`,
+                source: 'generated-client'
+            },
+            get: {
+                method: 'GET',
+                path: `/effect/${stem}/:id`,
+                source: 'generated-client'
+            },
+            create: {
+                method: 'POST',
+                path: `/effect/${stem}`,
+                source: 'generated-client'
+            }
+        }
+    };
+}
+function createAppConfigContract(app) {
+    return {
+        preset: 'presetUltramodern',
+        plugins: [
+            'appTools',
+            'tanstackRouterPlugin',
+            'i18nPlugin',
+            ...appHasEffectApi(app) ? [
+                'bffPlugin'
+            ] : [],
+            'moduleFederationPlugin',
+            'zephyrRspackPlugin'
+        ],
+        output: {
+            disableTsChecker: true,
+            distPath: {
+                html: './'
+            },
+            polyfill: 'off',
+            splitRouteChunks: false
+        },
+        performance: {
+            rsdoctor: {
+                enabledByEnv: 'ULTRAMODERN_RSDOCTOR=true',
+                disableClientServer: true
+            }
+        },
+        html: {
+            outputStructure: 'flat'
+        },
+        source: {
+            mainEntryName: 'index',
+            siteUrlGlobal: 'ULTRAMODERN_SITE_URL'
+        },
+        ...appHasEffectApi(app) ? {
+            bff: {
+                runtimeFramework: 'effect',
+                prefix: app.effectApi.prefix,
+                openapi: '/openapi.json'
+            }
+        } : {}
+    };
+}
+function createStylingContract(enableTailwind) {
+    return {
+        tailwind: enableTailwind,
+        ...enableTailwind ? {
+            postcssPlugins: [
+                '@tailwindcss/postcss'
+            ],
+            contentGlobs: [
+                './src/**/*.{js,jsx,ts,tsx}'
+            ]
+        } : {}
+    };
+}
+function createAppGeneratedContract(scope, app, apps, enableTailwind) {
+    const remoteAppsForShell = apps.filter((candidate)=>'shell' !== candidate.kind && candidate.mfName);
+    return {
+        id: app.id,
+        package: ultramodern_workspace_packageName(scope, app.packageSuffix),
+        path: app.directory,
+        kind: app.kind,
+        config: createAppConfigContract(app),
+        styling: createStylingContract(enableTailwind),
+        deploy: {
+            target: 'cloudflare',
+            worker: {
+                ssr: true
+            },
+            output: {
+                flat: true,
+                htmlDistPath: './'
+            }
+        },
+        ssr: {
+            mode: 'stream',
+            moduleFederationAppSSR: true
+        },
+        i18n: {
+            plugin: '@modern-js/plugin-i18n',
+            backend: true,
+            reactI18next: false,
+            languages: [
+                'en',
+                'cs'
+            ],
+            fallbackLanguage: 'en',
+            publicDir: './locales'
+        },
+        moduleFederation: {
+            name: app.mfName,
+            ...'shell' === app.kind ? {
+                remotes: remoteAppsForShell.map((remote)=>({
+                        id: remote.id,
+                        alias: remoteDependencyAlias(remote),
+                        name: remote.mfName,
+                        manifestEnv: createRemoteManifestEnv(remote),
+                        manifestUrl: `http://localhost:${remote.port}/mf-manifest.json`
+                    }))
+            } : {},
+            exposes: Object.keys(app.exposes ?? {}),
+            dts: {
+                displayErrorInTerminal: true,
+                compilerInstance: "--package typescript -- tsc"
+            },
+            browserSafeExposesOnly: true,
+            zephyrRspackPlugin: ZEPHYR_RSPACK_PLUGIN_VERSION
+        },
+        marker: {
+            appId: app.id,
+            packageName: ultramodern_workspace_packageName(scope, app.packageSuffix),
+            version: '0.1.0',
+            build: createBuildMarker(scope, app),
+            deployProfile: 'cloudflare-ssr-mf-effect-v1',
+            uiSurface: 'ui',
+            ...appHasEffectApi(app) ? {
+                apiSurface: 'effect-bff'
+            } : {}
+        },
+        ...'commerce' === app.domain ? {
+            boundaryVisualization: {
+                mode: 'overlay',
+                layoutAffecting: false,
+                toggle: 'user-controlled',
+                boundaries: [
+                    {
+                        id: 'explore',
+                        labelKey: 'commerce.boundaries.explore',
+                        owner: 'team-explore',
+                        color: '#ff5a57',
+                        owns: [
+                            'header',
+                            'footer',
+                            'recommendations',
+                            'catalog'
+                        ]
+                    },
+                    {
+                        id: 'decide',
+                        labelKey: 'commerce.boundaries.decide',
+                        owner: 'team-decide',
+                        color: '#24d671',
+                        owns: [
+                            'product-detail',
+                            'variant-selection'
+                        ]
+                    },
+                    {
+                        id: 'checkout',
+                        labelKey: 'commerce.boundaries.checkout',
+                        owner: 'team-checkout',
+                        color: '#f4d044',
+                        owns: [
+                            'add-to-cart',
+                            'cart-link',
+                            'cart-lines'
+                        ]
+                    }
+                ]
+            }
+        } : {},
+        ...appHasEffectApi(app) ? {
+            effect: {
+                runtime: 'effect',
+                import: '@modern-js/plugin-bff/effect-edge',
+                prefix: app.effectApi.prefix,
+                openapi: '/openapi.json',
+                workerEntry: 'worker/__modern_bff_effect.js',
+                contract: './shared/effect/api',
+                client: './effect/client',
+                ...createEffectOperationContract(app)
+            }
+        } : {}
+    };
+}
+function createGeneratedContract(scope, apps = [
+    shellApp,
+    ...remoteApps
+], enableTailwind = true) {
+    return {
+        schemaVersion: 1,
+        profile: 'cloudflare-ssr-mf-effect-v1',
+        packageManager: {
+            source: 'package.json',
+            manager: 'pnpm',
+            version: PNPM_VERSION,
+            toolchain: 'mise'
+        },
+        versions: {
+            typescript: TYPESCRIPT_VERSION,
+            typescriptNativePreview: TYPESCRIPT_NATIVE_PREVIEW_VERSION,
+            moduleFederation: MODULE_FEDERATION_VERSION,
+            tanstackRouter: TANSTACK_ROUTER_VERSION,
+            i18next: I18NEXT_VERSION,
+            zephyrRspackPlugin: ZEPHYR_RSPACK_PLUGIN_VERSION,
+            zephyrAgent: ZEPHYR_AGENT_VERSION,
+            wrangler: WRANGLER_VERSION
+        },
+        apps: apps.map((app)=>createAppGeneratedContract(scope, app, apps, enableTailwind))
+    };
+}
 function createTemplateManifest(modernVersion, packageSource) {
     return {
         schemaVersion: 1,
@@ -1532,11 +3474,18 @@ function createTemplateManifest(modernVersion, packageSource) {
         materialization: {
             targetRoot: 'generated-project-root',
             allowedPaths: [
+                '.agents/**',
+                '.github/**',
+                '.gitignore',
+                '.mise.toml',
                 '.modernjs/**',
+                'AGENTS.md',
                 'README.md',
                 'apps/**',
                 'packages/**',
                 'package.json',
+                'oxfmt.config.ts',
+                'oxlint.config.ts',
                 'pnpm-workspace.yaml',
                 "scripts/**",
                 'services/**',
@@ -1545,7 +3494,6 @@ function createTemplateManifest(modernVersion, packageSource) {
             ],
             deniedPaths: [
                 '.git/**',
-                '.github/**',
                 '.npmrc',
                 '.yarnrc',
                 '.env',
@@ -1561,6 +3509,28 @@ function createTemplateManifest(modernVersion, packageSource) {
             modernPackageSpecifier: modernPackageVersion(packageSource),
             generatedWorkspacePackageSpecifier: WORKSPACE_PACKAGE_VERSION
         },
+        agentSkills: {
+            installDir: '.agents/skills',
+            source: {
+                repository: 'https://github.com/rstackjs/agent-skills',
+                commit: RSTACK_AGENT_SKILLS_COMMIT,
+                license: 'MIT',
+                licensePath: '.agents/rstackjs-agent-skills-LICENSE'
+            },
+            baseline: baselineAgentSkills,
+            moduleFederationSource: {
+                repository: 'https://github.com/module-federation/agent-skills',
+                commit: MODULE_FEDERATION_AGENT_SKILLS_COMMIT,
+                install: 'clone',
+                baseline: moduleFederationAgentSkills
+            },
+            privateSource: {
+                repository: 'https://github.com/TechsioCZ/skills',
+                install: 'clone-if-authorized',
+                baseline: privateAgentSkills
+            },
+            lockFile: '.agents/skills-lock.json'
+        },
         validation: {
             schemaValidation: true,
             sourceValidation: [
@@ -1577,48 +3547,82 @@ function createTemplateManifest(modernVersion, packageSource) {
             ],
             postMaterializationValidation: [
                 'ultramodern-workspace-contract-check',
+                'github-workflow-security-enforced',
+                'pnpm-11-policy-enforced',
                 'template-manifest-retained'
             ],
             expectedCommands: [
-                "pnpm install --ignore-scripts",
-                'pnpm run ultramodern:check'
+                'mise install',
+                'mise exec -- pnpm install',
+                'mise exec -- pnpm run ultramodern:check'
             ]
         }
     };
 }
-function writeApp(targetDir, scope, app, packageSource) {
-    writeJson(targetDir, `${app.directory}/package.json`, createAppPackage(scope, app, packageSource));
-    writeJson(targetDir, `${app.directory}/tsconfig.json`, createPackageTsConfig(app.directory));
-    writeFile(targetDir, `${app.directory}/src/modern-app-env.d.ts`, "/// <reference types='@modern-js/app-tools/types' />\n");
+function writeApp(targetDir, scope, app, packageSource, enableTailwind) {
+    writeJson(targetDir, `${app.directory}/package.json`, createAppPackage(scope, app, packageSource, enableTailwind));
+    writeJson(targetDir, `${app.directory}/tsconfig.json`, createPackageTsConfig(app.directory, appHasEffectApi(app)));
+    writeFile(targetDir, `${app.directory}/src/modern-app-env.d.ts`, "/// <reference types='@modern-js/app-tools/types' />\n\ndeclare const ULTRAMODERN_SITE_URL: string;\n");
+    writeFile(targetDir, `${app.directory}/src/ultramodern-build.ts`, createUltramodernBuildModule(scope, app));
     writeFile(targetDir, `${app.directory}/modern.config.ts`, createAppModernConfig(app));
+    writeFile(targetDir, `${app.directory}/src/modern.runtime.ts`, createAppRuntimeConfig(app));
+    writeJson(targetDir, `${app.directory}/locales/en/translation.json`, createAppLocaleMessages(app, 'en'));
+    writeJson(targetDir, `${app.directory}/locales/cs/translation.json`, createAppLocaleMessages(app, 'cs'));
+    writeFile(targetDir, `${app.directory}/src/routes/index.css`, createAppStyles(enableTailwind));
+    if (enableTailwind) {
+        writeFile(targetDir, `${app.directory}/postcss.config.mjs`, createPostcssConfig());
+        writeFile(targetDir, `${app.directory}/tailwind.config.ts`, createTailwindConfig());
+    }
     writeFile(targetDir, `${app.directory}/module-federation.config.ts`, 'shell' === app.kind ? createShellModuleFederationConfig() : createRemoteModuleFederationConfig(app));
     writeFile(targetDir, `${app.directory}/src/routes/layout.tsx`, createLayout(app.id));
-    writeFile(targetDir, `${app.directory}/src/routes/page.tsx`, 'shell' === app.kind ? createShellPage() : createRemotePage(app));
-    if ('vertical' === app.kind) {
+    writeFile(targetDir, `${app.directory}/src/routes/[lang]/page.tsx`, 'shell' === app.kind ? createShellPage() : createRemotePage(app));
+    if ('shell' === app.kind) writeFile(targetDir, `${app.directory}/src/effect/recommendations-client.ts`, createShellEffectClient(scope));
+    if (appHasEffectApi(app)) {
+        writeFile(targetDir, `${app.directory}/shared/effect/api.ts`, createEffectSharedApi(app));
+        writeFile(targetDir, `${app.directory}/api/effect/index.ts`, createEffectServiceEntry(scope, app, '../../shared/effect/api'));
+        writeFile(targetDir, `${app.directory}/src/effect/${app.effectApi.stem}-client.ts`, createEffectClient(app, '../../shared/effect/api'));
+    }
+    if ('vertical' === app.kind || 'horizontal-remote' === app.kind) {
         writeFile(targetDir, `${app.directory}/src/remote-entry.tsx`, createRemoteEntry(app));
-        const widgetFile = 'remote-identity' === app.id ? 'IdentityWidget.tsx' : 'CommerceWidget.tsx';
-        writeFile(targetDir, `${app.directory}/src/components/${widgetFile}`, createRemoteWidget(app));
+        writeFile(targetDir, `${app.directory}/src/components/${remoteWidgetFile(app)}.tsx`, createRemoteWidget(app));
     }
     if ('horizontal-design-system' === app.kind) {
-        writeFile(targetDir, `${app.directory}/src/components/Button.tsx`, createDesignButton());
+        writeFile(targetDir, `${app.directory}/src/components/button.tsx`, createDesignButton());
         writeFile(targetDir, `${app.directory}/src/tokens.ts`, createDesignTokens());
     }
 }
-function writeEffectService(targetDir, scope, packageSource) {
-    writeJson(targetDir, `${effectService.directory}/package.json`, createServicePackage(scope, packageSource));
-    writeJson(targetDir, `${effectService.directory}/tsconfig.json`, createPackageTsConfig(effectService.directory, true));
-    writeFile(targetDir, `${effectService.directory}/src/modern-app-env.d.ts`, "/// <reference types='@modern-js/app-tools/types' />\n");
-    writeFile(targetDir, `${effectService.directory}/src/routes/page.tsx`, `export default function RecommendationsServiceHome() {
-  return <main>Recommendations Effect service</main>;
+function writeEffectService(targetDir, scope, packageSource, enableTailwind, service = effectService) {
+    writeJson(targetDir, `${service.directory}/package.json`, createServicePackage(scope, packageSource, enableTailwind, service));
+    writeJson(targetDir, `${service.directory}/tsconfig.json`, createPackageTsConfig(service.directory, true));
+    writeFile(targetDir, `${service.directory}/src/modern-app-env.d.ts`, "/// <reference types='@modern-js/app-tools/types' />\n");
+    writeFile(targetDir, `${service.directory}/src/ultramodern-build.ts`, createUltramodernBuildModule(scope, service));
+    writeFile(targetDir, `${service.directory}/src/routes/layout.tsx`, createLayout(service.id));
+    writeFile(targetDir, `${service.directory}/src/routes/page.tsx`, `export default function ${toPascalCase(service.id)}Home() {
+  return <main>${service.id} Effect service</main>;
 }
 `);
-    writeFile(targetDir, `${effectService.directory}/modern.config.ts`, createServiceModernConfig());
-    writeFile(targetDir, `${effectService.directory}/shared/effect/api.ts`, createEffectSharedApi());
-    writeFile(targetDir, `${effectService.directory}/api/effect/index.ts`, createEffectServiceEntry());
+    writeFile(targetDir, `${service.directory}/src/routes/index.css`, createAppStyles(enableTailwind));
+    if (enableTailwind) {
+        writeFile(targetDir, `${service.directory}/postcss.config.mjs`, createPostcssConfig());
+        writeFile(targetDir, `${service.directory}/tailwind.config.ts`, createTailwindConfig());
+    }
+    writeFile(targetDir, `${service.directory}/modern.config.ts`, createServiceModernConfigFor(service));
+    writeFile(targetDir, `${service.directory}/api/effect/index.ts`, createEffectServiceEntry(scope, service));
+}
+function writeGenericSharedPackage(targetDir, scope, packageSource, sharedPackage) {
+    writeJson(targetDir, `${sharedPackage.directory}/package.json`, createSharedPackage(scope, sharedPackage.id, sharedPackage.description, packageSource));
+    writeJson(targetDir, `${sharedPackage.directory}/tsconfig.json`, {
+        extends: `${relativeRootFor(sharedPackage.directory)}/tsconfig.base.json`,
+        include: [
+            'src'
+        ]
+    });
+    writeFile(targetDir, `${sharedPackage.directory}/src/index.ts`, `export const packageId = '${sharedPackage.id}';
+`);
 }
-function writeSharedPackages(targetDir, scope) {
+function writeSharedPackages(targetDir, scope, packageSource) {
     for (const sharedPackage of sharedPackages){
-        writeJson(targetDir, `${sharedPackage.directory}/package.json`, createSharedPackage(scope, sharedPackage.id, sharedPackage.description));
+        writeJson(targetDir, `${sharedPackage.directory}/package.json`, createSharedPackage(scope, sharedPackage.id, sharedPackage.description, packageSource));
         writeJson(targetDir, `${sharedPackage.directory}/tsconfig.json`, {
             extends: `${relativeRootFor(sharedPackage.directory)}/tsconfig.base.json`,
             include: [
@@ -1627,51 +3631,315 @@ function writeSharedPackages(targetDir, scope) {
         });
     }
     writeFile(targetDir, 'packages/shared-contracts/src/index.ts', `export const ultramodernWorkspaceContract = {
+  ownership: 'topology/ownership.json',
   preset: 'presetUltramodern',
   topology: 'topology/reference-topology.json',
-  ownership: 'topology/ownership.json',
 } as const;
 `);
     writeFile(targetDir, 'packages/shared-design-tokens/src/index.ts', `export const sharedDesignTokens = {
   color: {
-    surface: '#f6fbf7',
-    foreground: '#133225',
     accent: '#2f8f68',
+    foreground: '#133225',
+    surface: '#f6fbf7',
   },
 } as const;
 `);
-    writeFile(targetDir, 'packages/shared-effect-api/src/index.ts', `export type Recommendation = {
-  id: string;
-  title: string;
-};
-
-export const recommendationsApiContract = {
-  serviceId: '${effectService.id}',
-  basePath: '/recommendations-api/effect/recommendations',
-} as const;
-`);
+    writeFile(targetDir, 'packages/shared-effect-api/src/index.ts', createEffectSharedApi());
+}
+function readJsonFile(filePath) {
+    return JSON.parse(node_fs.readFileSync(filePath, 'utf-8'));
+}
+function writeJsonFile(filePath, value) {
+    node_fs.writeFileSync(filePath, `${JSON.stringify(value, null, 2)}\n`, 'utf-8');
+}
+function appendEffectSharedApiContract(targetDir, service = effectService) {
+    const relativePath = 'packages/shared-effect-api/src/index.ts';
+    assertSafeRelativePath(relativePath);
+    const filePath = node_path.join(targetDir, relativePath);
+    ensureInsideRoot(targetDir, filePath);
+    if (!node_fs.existsSync(filePath)) throw new Error(`Missing generated Effect API package: ${relativePath}`);
+    const current = node_fs.readFileSync(filePath, 'utf-8');
+    const apiExport = serviceEffectApiExport(service);
+    if (current.includes(`export const ${apiExport} =`)) return;
+    const contentWithImports = current.includes('@modern-js/plugin-bff/effect-client') ? current.trimEnd() : `${createEffectSharedApiImports()}\n${current.trimEnd()}`;
+    node_fs.writeFileSync(filePath, `${contentWithImports}\n\n${createEffectSharedApiContract(service)}`, 'utf-8');
+}
+function existingPackageSource(workspaceRoot, modernVersion, packageSource) {
+    if (packageSource) return resolvePackageSource({
+        targetDir: workspaceRoot,
+        packageName: node_path.basename(workspaceRoot),
+        modernVersion,
+        packageSource
+    });
+    const metadataPath = node_path.join(workspaceRoot, '.modernjs/ultramodern-package-source.json');
+    if (!node_fs.existsSync(metadataPath)) return resolvePackageSource({
+        targetDir: workspaceRoot,
+        packageName: node_path.basename(workspaceRoot),
+        modernVersion
+    });
+    const metadata = readJsonFile(metadataPath);
+    const aliases = metadata.modernPackages?.aliases ?? {};
+    const firstAlias = Object.values(aliases).find((value)=>'string' == typeof value);
+    const firstPackage = Object.keys(aliases)[0];
+    const aliasScope = firstAlias?.match(/^@([^/]+)\//)?.[1];
+    const unscopedName = firstPackage?.split('/').at(-1) ?? '';
+    const aliasUnscopedName = firstAlias?.split('/').at(-1) ?? '';
+    const aliasPackageNamePrefix = aliasUnscopedName && unscopedName && aliasUnscopedName.endsWith(unscopedName) ? aliasUnscopedName.slice(0, -unscopedName.length) : void 0;
+    return {
+        strategy: 'install' === metadata.strategy ? 'install' : 'workspace',
+        modernPackageVersion: 'string' == typeof metadata.modernPackages?.specifier ? metadata.modernPackages.specifier : modernVersion,
+        registry: metadata.modernPackages?.registry,
+        aliasScope,
+        aliasPackageNamePrefix
+    };
+}
+function assertValidMicroVerticalName(name) {
+    const normalized = toKebabCase(name);
+    if (!normalized || normalized !== name) throw new Error(`Invalid MicroVertical name "${name}". Use lowercase kebab-case.`);
+    return normalized;
+}
+function nextAvailablePort(ports) {
+    const numericPorts = Object.values(ports).filter((value)=>'number' == typeof value && Number.isFinite(value));
+    return Math.max(3030, ...numericPorts) + 1;
+}
+function assertCanCreate(workspaceRoot, relativePath) {
+    if (node_fs.existsSync(node_path.join(workspaceRoot, relativePath))) throw new Error(`Refusing to overwrite existing path: ${relativePath}`);
+}
+function addRootDevScript(workspaceRoot, scope, packageSuffix, scriptName) {
+    const packagePath = node_path.join(workspaceRoot, 'package.json');
+    const rootPackage = readJsonFile(packagePath);
+    rootPackage.scripts ??= {};
+    rootPackage.scripts[`dev:${scriptName}`] = `pnpm --filter ${ultramodern_workspace_packageName(scope, packageSuffix)} dev`;
+    if ('string' == typeof rootPackage.scripts.dev && !rootPackage.scripts.dev.includes(ultramodern_workspace_packageName(scope, packageSuffix))) {
+        const packageFilter = `--filter ${ultramodern_workspace_packageName(scope, packageSuffix)}`;
+        rootPackage.scripts.dev = rootPackage.scripts.dev.endsWith(' dev') ? rootPackage.scripts.dev.replace(/ dev$/u, ` ${packageFilter} dev`) : `${rootPackage.scripts.dev} ${packageFilter}`;
+    }
+    writeJsonFile(packagePath, rootPackage);
+}
+function addShellZephyrDependency(workspaceRoot, scope, remote) {
+    const packagePath = node_path.join(workspaceRoot, shellApp.directory, 'package.json');
+    const shellPackage = readJsonFile(packagePath);
+    shellPackage['zephyr:dependencies'] ??= {};
+    shellPackage['zephyr:dependencies'][remoteDependencyAlias(remote)] = zephyrRemoteDependency(scope, remote);
+    writeJsonFile(packagePath, shellPackage);
+}
+function addShellWorkspaceDependency(workspaceRoot, scope, remote) {
+    if (!appHasEffectApi(remote)) return;
+    const packagePath = node_path.join(workspaceRoot, shellApp.directory, 'package.json');
+    const shellPackage = readJsonFile(packagePath);
+    shellPackage.dependencies ??= {};
+    shellPackage.dependencies[ultramodern_workspace_packageName(scope, remote.packageSuffix)] = WORKSPACE_PACKAGE_VERSION;
+    writeJsonFile(packagePath, shellPackage);
+}
+function remoteTopologyEntry(scope, remote) {
+    return {
+        id: remote.id,
+        kind: remote.kind,
+        domain: remote.domain,
+        package: ultramodern_workspace_packageName(scope, remote.packageSuffix),
+        moduleFederation: {
+            role: 'remote',
+            name: remote.mfName,
+            manifestUrl: `http://localhost:${remote.port}/mf-manifest.json`,
+            exposes: Object.keys(remote.exposes ?? {}),
+            ssr: true,
+            fallbackTelemetryEvent: 'modernjs:mv-runtime-parity',
+            sharedContractVersion: 'mf-ssr-contract-v1'
+        },
+        ...effectApiTopologyMetadata(remote) ? {
+            api: effectApiTopologyMetadata(remote)
+        } : {},
+        ownership: remote.ownership
+    };
+}
+function ownershipEntry(scope, owner) {
+    return {
+        id: owner.id,
+        package: ultramodern_workspace_packageName(scope, owner.packageSuffix),
+        path: owner.directory,
+        ownership: owner.ownership
+    };
+}
+function remotesFromTopology(topology, ports) {
+    return (topology.remotes ?? []).map((remote)=>{
+        const effectApi = remote.api?.effect ? {
+            stem: 'string' == typeof remote.api.effect.basePath ? remote.api.effect.basePath.split('/').filter(Boolean).at(-1) ?? remote.domain ?? String(remote.id).replace(/^remote-/, '') : remote.domain ?? String(remote.id).replace(/^remote-/, ''),
+            prefix: remote.api.effect.bff?.prefix ?? `/${remote.domain ?? String(remote.id).replace(/^remote-/, '')}-api`,
+            consumedBy: Array.isArray(remote.api.effect.consumedBy) ? remote.api.effect.consumedBy : [
+                shellApp.id,
+                remote.id
+            ]
+        } : void 0;
+        return {
+            id: remote.id,
+            directory: '',
+            packageSuffix: remote.package?.split('/').at(-1) ?? remote.id,
+            displayName: remote.id,
+            kind: remote.kind ?? 'vertical',
+            domain: remote.domain ?? String(remote.id).replace(/^remote-/, ''),
+            portEnv: '',
+            port: 'number' == typeof ports[remote.id] ? ports[remote.id] : 0,
+            mfName: remote.moduleFederation?.name ?? `remote${toPascalCase(remote.id)}`,
+            ...effectApi ? {
+                effectApi
+            } : {},
+            ownership: remote.ownership ?? createNeutralOwnership(remote.id)
+        };
+    });
+}
+function addUltramodernMicroVertical(options) {
+    const name = assertValidMicroVerticalName(options.name);
+    const rootPackage = readJsonFile(node_path.join(options.workspaceRoot, 'package.json'));
+    const scope = toPackageScope(String(rootPackage.name ?? node_path.basename(options.workspaceRoot)));
+    const topologyPath = node_path.join(options.workspaceRoot, 'topology/reference-topology.json');
+    const ownershipPath = node_path.join(options.workspaceRoot, 'topology/ownership.json');
+    const overlayPath = node_path.join(options.workspaceRoot, 'topology/local-overlays/development.json');
+    for (const requiredPath of [
+        topologyPath,
+        ownershipPath,
+        overlayPath
+    ])if (!node_fs.existsSync(requiredPath)) throw new Error(`Missing UltraModern workspace file: ${requiredPath}`);
+    const topology = readJsonFile(topologyPath);
+    const ownership = readJsonFile(ownershipPath);
+    const overlay = readJsonFile(overlayPath);
+    overlay.ports ??= {};
+    const packageSource = existingPackageSource(options.workspaceRoot, options.modernVersion, options.packageSource);
+    const enableTailwind = false !== options.enableTailwind;
+    const port = nextAvailablePort(overlay.ports);
+    if ('remote' === options.kind || 'horizontal-remote' === options.kind) {
+        const remote = createRemoteDescriptor(name, options.kind, port);
+        assertCanCreate(options.workspaceRoot, remote.directory);
+        if ((topology.remotes ?? []).some((entry)=>entry.id === remote.id)) throw new Error(`Topology already contains ${remote.id}`);
+        if (Object.values(overlay.ports).includes(remote.port)) throw new Error(`Development port ${remote.port} is already in use`);
+        writeApp(options.workspaceRoot, scope, remote, packageSource, enableTailwind);
+        topology.shell ??= {};
+        topology.shell.remoteRefs ??= [];
+        topology.shell.remoteRefs.push(remote.id);
+        topology.shell.moduleFederation ??= {};
+        topology.shell.moduleFederation.remotes ??= [];
+        topology.shell.moduleFederation.remotes.push({
+            id: remote.id,
+            name: remote.mfName,
+            manifestUrl: `http://localhost:${remote.port}/mf-manifest.json`
+        });
+        topology.remotes ??= [];
+        topology.remotes.push(remoteTopologyEntry(scope, remote));
+        ownership.owners ??= [];
+        ownership.owners.push(ownershipEntry(scope, remote));
+        overlay.ports[remote.id] = remote.port;
+        overlay.manifests ??= {};
+        overlay.manifests[remote.id] = `http://localhost:${remote.port}/mf-manifest.json`;
+        if (appHasEffectApi(remote)) {
+            overlay.apis ??= {};
+            overlay.apis[remote.id] = `http://localhost:${remote.port}${effectApiPrefix(remote)}`;
+        }
+        writeJsonFile(topologyPath, topology);
+        writeJsonFile(ownershipPath, ownership);
+        writeJsonFile(overlayPath, overlay);
+        writeJsonFile(node_path.join(options.workspaceRoot, GENERATED_CONTRACT_PATH), createGeneratedContract(scope, [
+            shellApp,
+            ...remotesFromTopology(topology, overlay.ports)
+        ], enableTailwind));
+        const shellConfigPath = node_path.join(options.workspaceRoot, `${shellApp.directory}/module-federation.config.ts`);
+        writeFileReplacing(options.workspaceRoot, `${shellApp.directory}/module-federation.config.ts`, createShellModuleFederationConfig(remotesFromTopology(topology, overlay.ports)));
+        if (!node_fs.existsSync(shellConfigPath)) throw new Error('Shell Module Federation config was not regenerated');
+        addShellZephyrDependency(options.workspaceRoot, scope, remote);
+        addShellWorkspaceDependency(options.workspaceRoot, scope, remote);
+        addRootDevScript(options.workspaceRoot, scope, remote.packageSuffix, name);
+        return;
+    }
+    if ('service' === options.kind) {
+        const service = createServiceDescriptor(name, port);
+        assertCanCreate(options.workspaceRoot, service.directory);
+        if ((topology.effectServices ?? []).some((entry)=>entry.id === service.id)) throw new Error(`Topology already contains ${service.id}`);
+        writeEffectService(options.workspaceRoot, scope, packageSource, enableTailwind, service);
+        appendEffectSharedApiContract(options.workspaceRoot, service);
+        topology.effectServices ??= [];
+        topology.effectServices.push({
+            id: service.id,
+            kind: 'effect-service',
+            runtime: 'effect',
+            package: ultramodern_workspace_packageName(scope, service.packageSuffix),
+            consumedBy: [
+                shellApp.id
+            ],
+            bff: {
+                prefix: serviceApiPrefix(service),
+                openapi: '/openapi.json'
+            },
+            contract: {
+                package: ultramodern_workspace_packageName(scope, 'shared-effect-api'),
+                export: serviceEffectApiExport(service),
+                path: 'packages/shared-effect-api/src/index.ts'
+            },
+            serverEntry: `${service.directory}/api/effect/index.ts`,
+            basePath: `${serviceApiPrefix(service)}/effect/${effectApiStem(service)}`,
+            ...createEffectOperationContract(service),
+            ownership: service.ownership
+        });
+        ownership.owners ??= [];
+        ownership.owners.push(ownershipEntry(scope, service));
+        overlay.ports[service.id] = service.port;
+        overlay.services ??= {};
+        overlay.services[service.id] = `http://localhost:${service.port}${serviceApiPrefix(service)}`;
+        writeJsonFile(topologyPath, topology);
+        writeJsonFile(ownershipPath, ownership);
+        writeJsonFile(overlayPath, overlay);
+        addRootDevScript(options.workspaceRoot, scope, service.packageSuffix, name);
+        return;
+    }
+    if ('shared' === options.kind) {
+        const sharedPackage = createSharedPackageDescriptor(name);
+        assertCanCreate(options.workspaceRoot, sharedPackage.directory);
+        if ((topology.sharedPackages ?? []).some((entry)=>entry.id === sharedPackage.id)) throw new Error(`Topology already contains ${sharedPackage.id}`);
+        writeGenericSharedPackage(options.workspaceRoot, scope, packageSource, sharedPackage);
+        topology.sharedPackages ??= [];
+        topology.sharedPackages.push({
+            id: sharedPackage.id,
+            package: ultramodern_workspace_packageName(scope, sharedPackage.id),
+            path: sharedPackage.directory,
+            description: sharedPackage.description
+        });
+        ownership.owners ??= [];
+        ownership.owners.push(ownershipEntry(scope, {
+            id: sharedPackage.id,
+            packageSuffix: sharedPackage.id,
+            directory: sharedPackage.directory,
+            ownership: createNeutralOwnership(sharedPackage.id, 'tier-1-shared-contract')
+        }));
+        writeJsonFile(topologyPath, topology);
+        writeJsonFile(ownershipPath, ownership);
+        return;
+    }
+    throw new Error(`Unsupported MicroVertical kind: ${options.kind}`);
 }
 function generateUltramodernWorkspace(options) {
     const scope = toPackageScope(options.packageName);
     const packageSource = resolvePackageSource(options);
+    const enableTailwind = false !== options.enableTailwind;
     node_fs.mkdirSync(options.targetDir, {
         recursive: true
     });
     copyRootTemplate(options.targetDir, {
         packageName: options.packageName,
-        packageScope: scope
+        packageScope: scope,
+        pnpmVersion: PNPM_VERSION,
+        tailwindEnabled: String(enableTailwind)
     });
     writeJson(options.targetDir, 'package.json', createRootPackageJson(scope, packageSource));
-    writeJson(options.targetDir, 'tsconfig.base.json', createTsConfigBase(scope));
+    writeJson(options.targetDir, 'tsconfig.base.json', createTsConfigBase());
     writeJson(options.targetDir, 'topology/reference-topology.json', createTopology(scope));
     writeJson(options.targetDir, 'topology/ownership.json', createOwnership(scope));
     writeJson(options.targetDir, 'topology/local-overlays/development.json', createDevelopmentOverlay());
     writeJson(options.targetDir, '.modernjs/ultramodern-workspace-template-manifest.json', createTemplateManifest(options.modernVersion, packageSource));
     writeJson(options.targetDir, '.modernjs/ultramodern-package-source.json', createPackageSourceMetadata(scope, packageSource));
-    writeApp(options.targetDir, scope, shellApp, packageSource);
-    for (const remote of remoteApps)writeApp(options.targetDir, scope, remote, packageSource);
-    writeEffectService(options.targetDir, scope, packageSource);
-    writeSharedPackages(options.targetDir, scope);
+    writeJson(options.targetDir, GENERATED_CONTRACT_PATH, createGeneratedContract(scope, [
+        shellApp,
+        ...remoteApps
+    ], enableTailwind));
+    writeApp(options.targetDir, scope, shellApp, packageSource, enableTailwind);
+    for (const remote of remoteApps)writeApp(options.targetDir, scope, remote, packageSource, enableTailwind);
+    writeSharedPackages(options.targetDir, scope, packageSource);
 }
 const src_dirname = node_path.dirname(fileURLToPath(import.meta.url));
 const templateDir = node_path.resolve(src_dirname, '..', 'template');
@@ -1681,9 +3949,12 @@ const sha1Pattern = /^[0-9a-f]{40}$/;
 const sha256Pattern = /^[0-9a-f]{64}$/;
 const templateIdPattern = /^[a-z0-9][a-z0-9._-]*$/;
 const packageNamePattern = /^(?:@[a-z0-9._-]+\/)?[a-z0-9._-]+$/;
+const src_TANSTACK_ROUTER_VERSION = '1.170.8';
+const src_TAILWIND_VERSION = '4.3.0';
+const src_TAILWIND_POSTCSS_VERSION = '4.3.0';
+const src_PNPM_VERSION = '11.4.0';
 const requiredDeniedPaths = [
     '.git/**',
-    '.github/**',
     '.npmrc',
     '.yarnrc',
     '.env',
@@ -1726,8 +3997,8 @@ function detectRouterFramework() {
         '--router',
         '-r'
     ]);
-    if (!routerValue || 'react-router' === routerValue) return 'react-router';
-    if ('tanstack' === routerValue) return 'tanstack';
+    if (!routerValue || 'tanstack' === routerValue) return 'tanstack';
+    if ('react-router' === routerValue) return 'react-router';
     console.error(i18n.t(localeKeys.error.invalidRouter, {
         router: routerValue
     }));
@@ -1746,7 +4017,7 @@ function detectBffRuntime() {
     process.exit(1);
 }
 function src_renderTemplate(template, data) {
-    const tagRegex = /\{\{(#if|#unless|\/if|\/unless)(?:\s+(\w+))?\}\}/g;
+    const tagRegex = /\{\{(~?)(#if|#unless|\/if|\/unless)(?:\s+(\w+))?(~?)\}\}/g;
     function renderConditionals(startIndex, expectedClose) {
         let rendered = '';
         let cursor = startIndex;
@@ -1757,7 +4028,7 @@ function src_renderTemplate(template, data) {
                 rendered: rendered + template.slice(cursor),
                 nextIndex: template.length
             };
-            const [raw, tag, condition] = match;
+            const [raw, , tag, condition, rightTrim] = match;
             const tagIndex = match.index;
             rendered += template.slice(cursor, tagIndex);
             cursor = tagIndex + raw.length;
@@ -1773,10 +4044,17 @@ function src_renderTemplate(template, data) {
             }
             if ('/if' === tag || '/unless' === tag) {
                 const kind = '/if' === tag ? 'if' : 'unless';
-                if (expectedClose === kind) return {
-                    rendered,
-                    nextIndex: cursor
-                };
+                if (expectedClose === kind) {
+                    let nextIndex = cursor;
+                    if ('~' === rightTrim) {
+                        const trailingWhitespace = /^\s*/u.exec(template.slice(nextIndex));
+                        nextIndex += trailingWhitespace?.[0].length ?? 0;
+                    }
+                    return {
+                        rendered,
+                        nextIndex
+                    };
+                }
                 rendered += raw;
             }
         }
@@ -1857,20 +4135,29 @@ function createBuiltinTemplateManifest(version) {
         materialization: {
             targetRoot: 'generated-project-root',
             allowedPaths: [
+                '.agents/**',
                 '.browserslistrc',
+                '.github/**',
                 '.gitignore',
+                '.mise.toml',
                 '.modernjs/**',
                 '.nvmrc',
+                'AGENTS.md',
                 'README.md',
                 'api/**',
-                'biome.json',
+                'config/**',
                 'modern.config.ts',
+                'oxfmt.config.ts',
+                'oxlint.config.ts',
                 'package.json',
+                'pnpm-workspace.yaml',
                 'postcss.config.mjs',
+                'rstest.config.mts',
                 "scripts/**",
                 'shared/**',
                 'src/**',
                 'tailwind.config.ts',
+                'tests/**',
                 'tsconfig.json'
             ],
             deniedPaths: requiredDeniedPaths,
@@ -1899,11 +4186,17 @@ function createBuiltinTemplateManifest(version) {
             postMaterializationValidation: [
                 'ultramodern-contract-check',
                 'dependency-install-with-lifecycle-deny',
+                'github-workflow-security-enforced',
+                'package-source-retained',
+                'pnpm-11-policy-enforced',
+                'rstest-smoke-tests',
                 'template-manifest-retained'
             ],
             expectedCommands: [
-                "pnpm install --ignore-scripts",
-                'pnpm run ultramodern:check'
+                'mise install',
+                'mise exec -- pnpm install',
+                'mise exec -- pnpm test',
+                'mise exec -- pnpm run ultramodern:check'
             ]
         }
     };
@@ -2008,9 +4301,19 @@ function writeTemplateManifestEvidence(targetDir, manifest) {
     });
     node_fs.writeFileSync(evidencePath, `${JSON.stringify(manifest, null, 2)}\n`);
 }
-function showVersion() {
+function readCreatePackageJson() {
     const createPackageJson = node_path.resolve(src_dirname, '..', 'package.json');
-    const createPackage = JSON.parse(node_fs.readFileSync(createPackageJson, 'utf-8'));
+    return JSON.parse(node_fs.readFileSync(createPackageJson, 'utf-8'));
+}
+function isBleedingDevCreatePackage(createPackage) {
+    return '@bleedingdev/modern-js-create' === createPackage.name;
+}
+function getBleedingDevFrameworkVersion(createPackage, fallbackVersion) {
+    const frameworkVersion = createPackage.ultramodern?.frameworkVersion;
+    return 'string' == typeof frameworkVersion && frameworkVersion.length > 0 ? frameworkVersion : fallbackVersion;
+}
+function showVersion() {
+    const createPackage = readCreatePackageJson();
     const version = createPackage.version || 'unknown';
     console.log(i18n.t(localeKeys.version.message, {
         version
@@ -2037,6 +4340,7 @@ function showHelp() {
     if (localeKeys.help.optionUltramodernPackageSource) console.log(i18n.t(localeKeys.help.optionUltramodernPackageSource));
     if (localeKeys.help.optionUltramodernPackageScope) console.log(i18n.t(localeKeys.help.optionUltramodernPackageScope));
     if (localeKeys.help.optionUltramodernPackageNamePrefix) console.log(i18n.t(localeKeys.help.optionUltramodernPackageNamePrefix));
+    if (localeKeys.help.optionMicroVertical) console.log(i18n.t(localeKeys.help.optionMicroVertical));
     console.log(i18n.t(localeKeys.help.optionSub));
     console.log('');
     console.log(i18n.t(localeKeys.help.examples));
@@ -2050,6 +4354,7 @@ function showHelp() {
     if (localeKeys.help.example8) console.log(i18n.t(localeKeys.help.example8));
     if (localeKeys.help.example9) console.log(i18n.t(localeKeys.help.example9));
     if (localeKeys.help.example10) console.log(i18n.t(localeKeys.help.example10));
+    if (localeKeys.help.example11) console.log(i18n.t(localeKeys.help.example11));
     console.log('');
     console.log(i18n.t(localeKeys.help.moreInfo));
     console.log('');
@@ -2075,20 +4380,30 @@ function detectSubprojectFlag() {
 }
 function detectTailwindFlag() {
     const args = process.argv.slice(2);
-    return args.includes('--tailwind');
+    return !args.includes('--no-tailwind');
 }
 function detectWorkspaceProtocolFlag() {
     const args = process.argv.slice(2);
     return args.includes('--workspace');
 }
-function detectUltramodernWorkspaceFlag() {
+function detectMicroVerticalKind() {
+    const kind = getOptionValue(process.argv.slice(2), [
+        '--microvertical'
+    ]);
+    if (!kind) return;
+    if ('remote' === kind || 'horizontal-remote' === kind || 'service' === kind || 'shared' === kind) return kind;
+    console.error('--microvertical must be one of: remote, horizontal-remote, service, shared');
+    process.exit(1);
+}
+function detectUltramodernWorkspaceFlag(createPackage) {
     const args = process.argv.slice(2);
-    return args.includes(ULTRAMODERN_WORKSPACE_FLAG);
+    return args.includes(ULTRAMODERN_WORKSPACE_FLAG) || isBleedingDevCreatePackage(createPackage);
 }
-function detectUltramodernPackageSource(args, modernVersion) {
+function detectUltramodernPackageSource(args, defaultPackageVersion, createPackage) {
+    const bleedingDevDefaults = isBleedingDevCreatePackage(createPackage);
     const strategy = getOptionValue(args, [
         '--ultramodern-package-source'
-    ]) ?? 'workspace';
+    ]) ?? (bleedingDevDefaults ? 'install' : 'workspace');
     if ('workspace' !== strategy && 'install' !== strategy) {
         console.error('--ultramodern-package-source must be "workspace" or "install"');
         process.exit(1);
@@ -2097,18 +4412,68 @@ function detectUltramodernPackageSource(args, modernVersion) {
         strategy,
         modernPackageVersion: getOptionValue(args, [
             '--ultramodern-package-version'
-        ]) ?? modernVersion,
+        ]) ?? defaultPackageVersion,
         registry: getOptionValue(args, [
             '--ultramodern-package-registry'
         ]),
         aliasScope: getOptionValue(args, [
             '--ultramodern-package-scope'
-        ]),
+        ]) ?? (bleedingDevDefaults && 'install' === strategy ? 'bleedingdev' : void 0),
         aliasPackageNamePrefix: getOptionValue(args, [
             '--ultramodern-package-name-prefix'
         ]) ?? 'modern-js-'
     };
 }
+function src_modernAliasPackageName(packageName, packageSource) {
+    if (!packageSource.aliasScope) return packageName;
+    const scope = packageSource.aliasScope.replace(/^@/, '');
+    const unscopedName = packageName.split('/').at(-1);
+    return `@${scope}/${packageSource.aliasPackageNamePrefix ?? ''}${unscopedName}`;
+}
+function singleAppModernPackageSpecifier(packageName, packageSource, useWorkspaceProtocol) {
+    if (useWorkspaceProtocol) return 'workspace:*';
+    if ('install' !== packageSource.strategy || !packageSource.aliasScope) return packageSource.modernPackageVersion;
+    return `npm:${src_modernAliasPackageName(packageName, packageSource)}@${packageSource.modernPackageVersion}`;
+}
+const singleAppModernPackages = [
+    '@modern-js/runtime',
+    '@modern-js/app-tools',
+    '@modern-js/tsconfig',
+    '@modern-js/plugin-i18n',
+    '@modern-js/plugin-tanstack',
+    '@modern-js/plugin-bff',
+    '@modern-js/adapter-rstest'
+];
+function createSingleAppPackageSourceEvidence(packageSource, useWorkspaceProtocol) {
+    const strategy = useWorkspaceProtocol ? 'workspace' : 'install';
+    const specifier = useWorkspaceProtocol ? 'workspace:*' : packageSource.modernPackageVersion;
+    const aliases = 'install' === strategy && packageSource.aliasScope ? Object.fromEntries(singleAppModernPackages.map((packageName)=>[
+            packageName,
+            src_modernAliasPackageName(packageName, packageSource)
+        ])) : void 0;
+    return {
+        schemaVersion: 1,
+        preset: 'presetUltramodern',
+        strategy,
+        modernPackages: {
+            specifier,
+            packages: singleAppModernPackages,
+            ...packageSource.registry ? {
+                registry: packageSource.registry
+            } : {},
+            ...aliases ? {
+                aliases
+            } : {}
+        }
+    };
+}
+function writeSingleAppPackageSourceEvidence(targetDir, packageSource, useWorkspaceProtocol) {
+    const evidencePath = node_path.join(targetDir, '.modernjs', 'ultramodern-package-source.json');
+    node_fs.mkdirSync(node_path.dirname(evidencePath), {
+        recursive: true
+    });
+    node_fs.writeFileSync(evidencePath, `${JSON.stringify(createSingleAppPackageSourceEvidence(packageSource, useWorkspaceProtocol), null, 2)}\n`);
+}
 function isDirectoryEmpty(dirPath) {
     if (!node_fs.existsSync(dirPath)) return false;
     try {
@@ -2130,7 +4495,8 @@ async function getProjectName() {
         '--ultramodern-package-version',
         '--ultramodern-package-registry',
         '--ultramodern-package-scope',
-        '--ultramodern-package-name-prefix'
+        '--ultramodern-package-name-prefix',
+        '--microvertical'
     ]);
     const optionWithoutValue = new Set([
         '--help',
@@ -2143,6 +4509,7 @@ async function getProjectName() {
         '--tanstack',
         '--bff',
         '--tailwind',
+        '--no-tailwind',
         '--workspace',
         ULTRAMODERN_WORKSPACE_FLAG
     ]);
@@ -2154,7 +4521,7 @@ async function getProjectName() {
                 i += 1;
                 continue;
             }
-            if (!(arg.startsWith('--lang=') || arg.startsWith('--router=') || arg.startsWith('--bff-runtime=') || arg.startsWith('--ultramodern-package-source=') || arg.startsWith('--ultramodern-package-version=') || arg.startsWith('--ultramodern-package-registry=') || arg.startsWith('--ultramodern-package-scope=') || arg.startsWith('--ultramodern-package-name-prefix='))) positionalArgs.push(arg);
+            if (!(arg.startsWith('--lang=') || arg.startsWith('--router=') || arg.startsWith('--bff-runtime=') || arg.startsWith('--ultramodern-package-source=') || arg.startsWith('--ultramodern-package-version=') || arg.startsWith('--ultramodern-package-registry=') || arg.startsWith('--ultramodern-package-scope=') || arg.startsWith('--ultramodern-package-name-prefix=') || arg.startsWith('--microvertical='))) positionalArgs.push(arg);
         }
     }
     const projectNameArg = positionalArgs[0];
@@ -2185,6 +4552,27 @@ async function main() {
     const { name: projectName, useCurrentDir } = await getProjectName();
     const targetDir = useCurrentDir ? process.cwd() : node_path.isAbsolute(projectName) ? projectName : node_path.resolve(process.cwd(), projectName);
     const generatedPackageName = useCurrentDir || node_path.isAbsolute(projectName) ? node_path.basename(targetDir) : projectName;
+    const createPackage = readCreatePackageJson();
+    const version = createPackage.version || 'latest';
+    const ultramodernPackageVersion = isBleedingDevCreatePackage(createPackage) ? getBleedingDevFrameworkVersion(createPackage, version) : version;
+    const microVerticalKind = detectMicroVerticalKind();
+    if (microVerticalKind) {
+        const overridePackageSource = args.some((arg)=>arg.startsWith('--ultramodern-package-')) ? detectUltramodernPackageSource(args, ultramodernPackageVersion, createPackage) : void 0;
+        addUltramodernMicroVertical({
+            workspaceRoot: process.cwd(),
+            name: generatedPackageName,
+            kind: microVerticalKind,
+            modernVersion: version,
+            enableTailwind: detectTailwindFlag(),
+            packageSource: overridePackageSource
+        });
+        const dim = '\x1b[2m\x1b[3m';
+        const reset = '\x1b[0m';
+        console.log(`${i18n.t(localeKeys.message.success)}\n`);
+        console.log(`${dim}   mise install${reset}`);
+        console.log(`${dim}   mise exec -- pnpm ultramodern:check${reset}\n`);
+        return;
+    }
     if (node_fs.existsSync(targetDir)) {
         const files = node_fs.readdirSync(targetDir);
         if (files.length > 0) {
@@ -2194,16 +4582,14 @@ async function main() {
             process.exit(1);
         }
     }
-    const createPackageJson = node_path.resolve(src_dirname, '..', 'package.json');
-    const createPackage = JSON.parse(node_fs.readFileSync(createPackageJson, 'utf-8'));
-    const version = createPackage.version || 'latest';
-    const generateWorkspace = detectUltramodernWorkspaceFlag();
+    const generateWorkspace = detectUltramodernWorkspaceFlag(createPackage);
     if (generateWorkspace) {
         generateUltramodernWorkspace({
             targetDir,
             packageName: generatedPackageName,
             modernVersion: version,
-            packageSource: detectUltramodernPackageSource(args, version)
+            enableTailwind: detectTailwindFlag(),
+            packageSource: detectUltramodernPackageSource(args, ultramodernPackageVersion, createPackage)
         });
         const dim = '\x1b[2m\x1b[3m';
         const reset = '\x1b[0m';
@@ -2212,8 +4598,9 @@ async function main() {
         if (!useCurrentDir) console.log(`${dim}   ${i18n.t(localeKeys.message.step1, {
             projectName
         })}${reset}`);
+        console.log(`${dim}   mise install${reset}`);
         console.log(`${dim}   ${i18n.t(localeKeys.message.step2)}${reset}`);
-        console.log(`${dim}   pnpm ultramodern:check${reset}`);
+        console.log(`${dim}   mise exec -- pnpm ultramodern:check${reset}`);
         console.log(`${dim}   ${i18n.t(localeKeys.message.step3)}${reset}\n`);
         return;
     }
@@ -2223,12 +4610,23 @@ async function main() {
     const bffRuntime = detectBffRuntime();
     const enableTailwind = detectTailwindFlag();
     const useWorkspaceProtocol = detectWorkspaceProtocolFlag();
-    const dependencyVersion = useWorkspaceProtocol ? 'workspace:*' : version;
+    const packageSource = detectUltramodernPackageSource(args, ultramodernPackageVersion, createPackage);
     const templateManifest = createBuiltinTemplateManifest(version);
     validateTemplateManifest(templateManifest);
     copyTemplate(templateDir, targetDir, {
         packageName: generatedPackageName,
-        version: dependencyVersion,
+        version: useWorkspaceProtocol ? 'workspace:*' : packageSource.modernPackageVersion,
+        runtimeVersion: singleAppModernPackageSpecifier('@modern-js/runtime', packageSource, useWorkspaceProtocol),
+        appToolsVersion: singleAppModernPackageSpecifier('@modern-js/app-tools', packageSource, useWorkspaceProtocol),
+        adapterRstestVersion: singleAppModernPackageSpecifier('@modern-js/adapter-rstest', packageSource, useWorkspaceProtocol),
+        tsconfigVersion: singleAppModernPackageSpecifier('@modern-js/tsconfig', packageSource, useWorkspaceProtocol),
+        pluginTanstackVersion: singleAppModernPackageSpecifier('@modern-js/plugin-tanstack', packageSource, useWorkspaceProtocol),
+        pluginBffVersion: singleAppModernPackageSpecifier('@modern-js/plugin-bff', packageSource, useWorkspaceProtocol),
+        pluginI18nVersion: singleAppModernPackageSpecifier('@modern-js/plugin-i18n', packageSource, useWorkspaceProtocol),
+        tanstackRouterVersion: src_TANSTACK_ROUTER_VERSION,
+        tailwindVersion: src_TAILWIND_VERSION,
+        tailwindPostcssVersion: src_TAILWIND_POSTCSS_VERSION,
+        pnpmVersion: src_PNPM_VERSION,
         isSubproject,
         routerFramework,
         bffRuntime,
@@ -2238,21 +4636,37 @@ async function main() {
     const targetPackageJson = node_path.join(targetDir, 'package.json');
     const packageJson = JSON.parse(node_fs.readFileSync(targetPackageJson, 'utf-8'));
     packageJson.name = generatedPackageName;
+    packageJson.modernjs = {
+        ...packageJson.modernjs ?? {},
+        preset: 'presetUltramodern',
+        packageSource: {
+            strategy: useWorkspaceProtocol ? 'workspace' : 'install',
+            config: './.modernjs/ultramodern-package-source.json'
+        }
+    };
     if (isSubproject) {
         delete packageJson['lint-staged'];
         delete packageJson['simple-git-hooks'];
         if (packageJson.scripts) {
             delete packageJson.scripts.prepare;
+            delete packageJson.scripts.format;
+            delete packageJson.scripts['format:check'];
             delete packageJson.scripts.lint;
+            delete packageJson.scripts['lint:fix'];
+            delete packageJson.scripts['skills:install'];
+            delete packageJson.scripts['skills:check'];
         }
         if (packageJson.devDependencies) {
             delete packageJson.devDependencies['lint-staged'];
             delete packageJson.devDependencies['simple-git-hooks'];
-            delete packageJson.devDependencies['@biomejs/biome'];
+            delete packageJson.devDependencies.oxlint;
+            delete packageJson.devDependencies.oxfmt;
+            delete packageJson.devDependencies.ultracite;
         }
     }
     node_fs.writeFileSync(targetPackageJson, `${JSON.stringify(packageJson, null, 2)}\n`);
     writeTemplateManifestEvidence(targetDir, templateManifest);
+    writeSingleAppPackageSourceEvidence(targetDir, packageSource, useWorkspaceProtocol);
     const dim = '\x1b[2m\x1b[3m';
     const reset = '\x1b[0m';
     console.log(`${i18n.t(localeKeys.message.success)}\n`);
@@ -2268,10 +4682,14 @@ function copyTemplate(src, dest, options) {
         recursive: true
     });
     const excludeInSubproject = [
+        '.agents',
+        '.github',
         '.gitignore.handlebars',
-        'biome.json',
+        'AGENTS.md',
         '.npmrc',
-        '.nvmrc'
+        '.nvmrc',
+        'oxfmt.config.ts',
+        'oxlint.config.ts'
     ];
     function copyRecursive(srcDir, destDir) {
         const entries = node_fs.readdirSync(srcDir, {
@@ -2293,6 +4711,17 @@ function copyTemplate(src, dest, options) {
                 const rendered = src_renderTemplate(templateContent, {
                     packageName: options.packageName,
                     version: options.version,
+                    runtimeVersion: options.runtimeVersion,
+                    appToolsVersion: options.appToolsVersion,
+                    adapterRstestVersion: options.adapterRstestVersion,
+                    tsconfigVersion: options.tsconfigVersion,
+                    pluginTanstackVersion: options.pluginTanstackVersion,
+                    pluginBffVersion: options.pluginBffVersion,
+                    pluginI18nVersion: options.pluginI18nVersion,
+                    tanstackRouterVersion: options.tanstackRouterVersion,
+                    tailwindVersion: options.tailwindVersion,
+                    tailwindPostcssVersion: options.tailwindPostcssVersion,
+                    pnpmVersion: options.pnpmVersion,
                     isSubproject: options.isSubproject,
                     isTanstackRouter: 'tanstack' === options.routerFramework,
                     enableBff: 'none' !== options.bffRuntime,
@@ -2300,7 +4729,7 @@ function copyTemplate(src, dest, options) {
                     useHonoBff: 'hono' === options.bffRuntime,
                     bffRuntime: options.bffRuntime,
                     enableTailwind: options.enableTailwind,
-                    routerImportPath: 'tanstack' === options.routerFramework ? 'tanstack-router' : 'router'
+                    routerRuntimeImport: 'tanstack' === options.routerFramework ? '@modern-js/plugin-tanstack/runtime' : '@modern-js/runtime/router'
                 });
                 if (0 === rendered.trim().length) continue;
                 destPath = destPath.replace(/\.handlebars$/, '');