@bleedingdev/modern-js-create 3.2.0-ultramodern.57 → 3.2.0-ultramodern.59

package/dist/index.js

@@ -250,8 +250,8 @@ ListCache.prototype.get = _listCacheGet;
 ListCache.prototype.has = _listCacheHas;
 ListCache.prototype.set = _listCacheSet;
 const _ListCache = ListCache;
-var Map = _getNative(_root, 'Map');
-const _Map = Map;
+var _Map_Map = _getNative(_root, 'Map');
+const _Map = _Map_Map;
 function mapCacheClear() {
     this.size = 0;
     this.__data__ = {
@@ -453,8 +453,8 @@ const EN_LOCALE = {
         success: '✨ Created successfully!',
         nextSteps: '📋 Next steps:',
         step1: 'cd {projectName}',
-        step2: 'mise exec -- pnpm install',
-        step3: 'mise exec -- pnpm dev'
+        step2: 'pnpm install',
+        step3: 'pnpm dev'
     },
     help: {
         title: '🚀 Modern.js Project Creator',
@@ -474,7 +474,7 @@ const EN_LOCALE = {
         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)',
+        optionVertical: '      --vertical Add a full-stack vertical to an existing UltraModern workspace',
         optionSub: '  -s, --sub       Mark as a subproject (package in monorepo)',
         examples: '💡 Examples:',
         example1: '  create my-app',
@@ -487,7 +487,7 @@ const EN_LOCALE = {
         example8: '  create my-app --router tanstack --bff-runtime effect',
         example9: '  create my-app --router tanstack --bff-runtime effect --workspace',
         example10: '  pnpm dlx @bleedingdev/modern-js-create my-super-app',
-        example11: '  create catalog --microvertical remote',
+        example11: '  create catalog --vertical',
         moreInfo: '📚 Learn more: https://modernjs.dev'
     },
     version: {
@@ -510,8 +510,8 @@ const ZH_LOCALE = {
         success: '✨ 创建成功！',
         nextSteps: '📋 下一步：',
         step1: 'cd {projectName}',
-        step2: 'mise exec -- pnpm install',
-        step3: 'mise exec -- pnpm dev'
+        step2: 'pnpm install',
+        step3: 'pnpm dev'
     },
     help: {
         title: '🚀 Modern.js 项目创建工具',
@@ -531,7 +531,7 @@ const ZH_LOCALE = {
         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）',
+        optionVertical: '      --vertical 向现有 UltraModern 工作区添加全栈 Vertical',
         optionSub: '  -s, --sub       标记为子项目（monorepo 中的子包）',
         examples: '💡 示例:',
         example1: '  create my-app',
@@ -544,7 +544,7 @@ const ZH_LOCALE = {
         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',
+        example11: '  create catalog --vertical',
         moreInfo: '📚 更多信息: https://modernjs.dev'
     },
     version: {
@@ -571,11 +571,12 @@ 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 LEFTHOOK_VERSION = '^2.1.9';
 const I18NEXT_VERSION = '26.2.0';
 const REACT_VERSION = '^19.2.6';
 const REACT_DOM_VERSION = '^19.2.6';
 const REACT_ROUTER_DOM_VERSION = '7.16.0';
-const PNPM_VERSION = '11.4.0';
+const PNPM_VERSION = '11.5.0';
 const WORKSPACE_PACKAGE_VERSION = 'workspace:*';
 const GENERATED_CONTRACT_PATH = '.modernjs/ultramodern-generated-contract.json';
 const RSTACK_AGENT_SKILLS_COMMIT = '61c948b42512e223bad44b83af4080eba48b2677';
@@ -620,10 +621,10 @@ const shellApp = {
     portEnv: 'SHELL_SUPER_APP_PORT',
     port: 3020,
     mfName: 'shellSuperApp',
-    remoteRefs: [
-        'remote-explore',
-        'remote-decide',
-        'remote-checkout'
+    verticalRefs: [
+        'explore',
+        'decide',
+        'checkout'
     ],
     ownership: {
         team: 'super-app-platform',
@@ -640,22 +641,22 @@ const shellApp = {
         }
     }
 };
-const remoteApps = [
+const verticalApps = [
     {
-        id: 'remote-explore',
-        directory: 'apps/remotes/remote-explore',
-        packageSuffix: 'remote-explore',
-        displayName: 'Explore Remote',
+        id: 'explore',
+        directory: 'verticals/explore',
+        packageSuffix: 'explore',
+        displayName: 'Explore Vertical',
         kind: 'vertical',
         domain: 'explore',
-        portEnv: 'REMOTE_EXPLORE_PORT',
+        portEnv: 'VERTICAL_EXPLORE_PORT',
         port: 3021,
-        mfName: 'remoteExplore',
+        mfName: 'verticalExplore',
         exposes: {
             './Footer': './src/components/footer.tsx',
             './Header': './src/components/header.tsx',
             './Recommendations': './src/components/recommendations.tsx',
-            './Route': './src/remote-entry.tsx',
+            './Route': './src/federation-entry.tsx',
             './StorePicker': './src/components/store-picker.tsx'
         },
         effectApi: {
@@ -663,15 +664,15 @@ const remoteApps = [
             prefix: '/explore-api',
             consumedBy: [
                 shellApp.id,
-                'remote-explore'
+                'explore'
             ]
         },
         ownership: {
             team: 'tractor-explore',
             slack: '#tractor-explore',
             pagerDuty: 'pd-tractor-explore',
-            runbookRef: 'runbooks/wave2/remote-explore.md',
-            adrRef: 'docs/super-app-rfc-adr/wave2/reference-topology.md#remote-explore',
+            runbookRef: 'runbooks/wave2/explore.md',
+            adrRef: 'docs/super-app-rfc-adr/wave2/reference-topology.md#explore',
             blastRadius: {
                 tier: 'tier-1-tractor-discovery',
                 references: [
@@ -682,37 +683,37 @@ const remoteApps = [
         }
     },
     {
-        id: 'remote-decide',
-        directory: 'apps/remotes/remote-decide',
-        packageSuffix: 'remote-decide',
-        displayName: 'Decide Remote',
+        id: 'decide',
+        directory: 'verticals/decide',
+        packageSuffix: 'decide',
+        displayName: 'Decide Vertical',
         kind: 'vertical',
         domain: 'decide',
-        portEnv: 'REMOTE_DECIDE_PORT',
+        portEnv: 'VERTICAL_DECIDE_PORT',
         port: 3022,
-        mfName: 'remoteDecide',
-        remoteRefs: [
-            'remote-explore',
-            'remote-checkout'
+        mfName: 'verticalDecide',
+        verticalRefs: [
+            'explore',
+            'checkout'
         ],
         exposes: {
             './ProductPage': './src/components/product-page.tsx',
-            './Route': './src/remote-entry.tsx'
+            './Route': './src/federation-entry.tsx'
         },
         effectApi: {
             stem: 'decide',
             prefix: '/decide-api',
             consumedBy: [
                 shellApp.id,
-                'remote-decide'
+                'decide'
             ]
         },
         ownership: {
             team: 'tractor-decide',
             slack: '#tractor-decide',
             pagerDuty: 'pd-tractor-decide',
-            runbookRef: 'runbooks/wave2/remote-decide.md',
-            adrRef: 'docs/super-app-rfc-adr/wave2/reference-topology.md#remote-decide',
+            runbookRef: 'runbooks/wave2/decide.md',
+            adrRef: 'docs/super-app-rfc-adr/wave2/reference-topology.md#decide',
             blastRadius: {
                 tier: 'tier-1-tractor-configuration',
                 references: [
@@ -723,21 +724,21 @@ const remoteApps = [
         }
     },
     {
-        id: 'remote-checkout',
-        directory: 'apps/remotes/remote-checkout',
-        packageSuffix: 'remote-checkout',
-        displayName: 'Checkout Remote',
+        id: 'checkout',
+        directory: 'verticals/checkout',
+        packageSuffix: 'checkout',
+        displayName: 'Checkout Vertical',
         kind: 'vertical',
         domain: 'checkout',
-        portEnv: 'REMOTE_CHECKOUT_PORT',
+        portEnv: 'VERTICAL_CHECKOUT_PORT',
         port: 3023,
-        mfName: 'remoteCheckout',
+        mfName: 'verticalCheckout',
         exposes: {
             './AddToCart': './src/components/add-to-cart.tsx',
             './CartPage': './src/components/cart-page.tsx',
             './CheckoutPage': './src/components/checkout-page.tsx',
             './MiniCart': './src/components/mini-cart.tsx',
-            './Route': './src/remote-entry.tsx',
+            './Route': './src/federation-entry.tsx',
             './ThanksPage': './src/components/thanks-page.tsx'
         },
         effectApi: {
@@ -745,15 +746,15 @@ const remoteApps = [
             prefix: '/checkout-api',
             consumedBy: [
                 shellApp.id,
-                'remote-checkout'
+                'checkout'
             ]
         },
         ownership: {
             team: 'tractor-checkout',
             slack: '#tractor-checkout',
             pagerDuty: 'pd-tractor-checkout',
-            runbookRef: 'runbooks/wave2/remote-checkout.md',
-            adrRef: 'docs/super-app-rfc-adr/wave2/reference-topology.md#remote-checkout',
+            runbookRef: 'runbooks/wave2/checkout.md',
+            adrRef: 'docs/super-app-rfc-adr/wave2/reference-topology.md#checkout',
             blastRadius: {
                 tier: 'tier-1-tractor-purchase',
                 references: [
@@ -764,27 +765,6 @@ const remoteApps = [
         }
     }
 ];
-const effectService = {
-    id: 'service-recommendations-effect',
-    directory: 'services/service-recommendations-effect',
-    packageSuffix: 'service-recommendations-effect',
-    portEnv: 'SERVICE_RECOMMENDATIONS_PORT',
-    port: 3030,
-    ownership: {
-        team: 'personalization-platform',
-        slack: '#personalization-platform',
-        pagerDuty: 'pd-personalization-platform',
-        runbookRef: 'runbooks/wave2/service-recommendations-effect.md',
-        adrRef: 'docs/super-app-rfc-adr/wave2/reference-topology.md#service-recommendations-effect',
-        blastRadius: {
-            tier: 'tier-2-personalization',
-            references: [
-                'docs/super-app-rfc-adr/wave2/blast-radius.md#recommendations',
-                'docs/super-app-rfc-adr/wave2/rollback.md#effect-service-lkg'
-            ]
-        }
-    }
-};
 const effectDiagnostics = [
     'anyUnknownInErrorContext',
     'classSelfMismatch',
@@ -869,21 +849,21 @@ const sharedPackages = [
     {
         id: 'shared-design-tokens',
         directory: 'packages/shared-design-tokens',
-        description: 'Design token placeholders consumed by shell and remotes.'
+        description: 'Design token placeholders consumed by shell and verticals.'
     },
     {
         id: 'shared-effect-api',
         directory: 'packages/shared-effect-api',
-        description: 'Shared Effect API type placeholders for services and clients.'
+        description: 'Shared Effect API type placeholders for vertical clients.'
     }
 ];
-function createNeutralOwnership(id, tier = 'tier-2-microvertical') {
+function createNeutralOwnership(id, tier = 'tier-2-vertical') {
     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}`,
+        runbookRef: `runbooks/verticals/${id}.md`,
+        adrRef: `docs/super-app-rfc-adr/verticals.md#${id}`,
         blastRadius: {
             tier,
             references: [
@@ -892,49 +872,35 @@ function createNeutralOwnership(id, tier = 'tier-2-microvertical') {
         }
     };
 }
-function createRemoteDescriptor(name, kind, port) {
+function createVerticalDescriptor(name, port) {
     const domain = toKebabCase(name);
-    const id = `remote-${domain}`;
+    const id = 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',
+        directory: `verticals/${domain}`,
+        packageSuffix: domain,
+        displayName: `${displayPrefix} Vertical`,
+        kind: 'vertical',
         domain,
-        portEnv: `REMOTE_${toEnvSegment(domain)}_PORT`,
+        portEnv: `VERTICAL_${toEnvSegment(domain)}_PORT`,
         port,
-        mfName: `remote${toPascalCase(domain)}`,
+        mfName: `vertical${toPascalCase(domain)}`,
         exposes: {
-            './Route': './src/remote-entry.tsx',
+            './Route': './src/federation-entry.tsx',
             './Widget': `./src/components/${domain}-widget.tsx`
         },
-        ...'remote' === kind ? {
-            effectApi: {
-                stem: domain,
-                prefix: `/${domain}-api`,
-                consumedBy: [
-                    shellApp.id,
-                    id
-                ]
-            }
-        } : {},
+        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`;
@@ -948,18 +914,9 @@ function effectApiPrefix(target) {
 function effectApiStem(target) {
     return target.effectApi?.stem ?? target.id.replace(/^service-/, '').replace(/-effect$/, '').replace(/-api$/, '');
 }
-function verticalEffectApps(remotes = remoteApps) {
+function verticalEffectApps(remotes = verticalApps) {
     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('/');
 }
@@ -1125,19 +1082,19 @@ function createRootPackageJson(scope, packageSource) {
         type: 'module',
         packageManager: `pnpm@${PNPM_VERSION}`,
         scripts: {
-            dev: `pnpm --parallel --filter ${ultramodern_workspace_packageName(scope, shellApp.packageSuffix)} --filter ${ultramodern_workspace_packageName(scope, 'remote-explore')} --filter ${ultramodern_workspace_packageName(scope, 'remote-decide')} --filter ${ultramodern_workspace_packageName(scope, 'remote-checkout')} dev`,
+            dev: `pnpm --parallel --filter ${ultramodern_workspace_packageName(scope, shellApp.packageSuffix)} --filter ${ultramodern_workspace_packageName(scope, 'explore')} --filter ${ultramodern_workspace_packageName(scope, 'decide')} --filter ${ultramodern_workspace_packageName(scope, 'checkout')} dev`,
             'dev:shell': `pnpm --filter ${ultramodern_workspace_packageName(scope, shellApp.packageSuffix)} dev`,
-            'dev:explore': `pnpm --filter ${ultramodern_workspace_packageName(scope, 'remote-explore')} dev`,
-            'dev:decide': `pnpm --filter ${ultramodern_workspace_packageName(scope, 'remote-decide')} dev`,
-            'dev:checkout': `pnpm --filter ${ultramodern_workspace_packageName(scope, 'remote-checkout')} dev`,
-            build: 'pnpm -r --filter "./apps/remotes/**" run build && pnpm --filter "./apps/shell-super-app" run build && pnpm ultramodern:assert-mf-types',
+            'dev:explore': `pnpm --filter ${ultramodern_workspace_packageName(scope, 'explore')} dev`,
+            'dev:decide': `pnpm --filter ${ultramodern_workspace_packageName(scope, 'decide')} dev`,
+            'dev:checkout': `pnpm --filter ${ultramodern_workspace_packageName(scope, 'checkout')} dev`,
+            build: 'pnpm -r --filter "./verticals/*" 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',
-            'cloudflare:deploy': 'pnpm -r --filter "./apps/remotes/**" run cloudflare:deploy && pnpm --filter "./apps/shell-super-app" run cloudflare:deploy',
+            'cloudflare:build': 'pnpm -r --filter "./verticals/*" run cloudflare:build && pnpm --filter "./apps/shell-super-app" run cloudflare:build && pnpm ultramodern:assert-mf-types',
+            'cloudflare:deploy': 'pnpm -r --filter "./verticals/*" run cloudflare:deploy && pnpm --filter "./apps/shell-super-app" run cloudflare:deploy',
             'cloudflare:proof': "node ./scripts/proof-cloudflare-version.mjs --out .codex/reports/cloudflare-version-proof/public-url-proof.json",
             'skills:install': "node ./scripts/bootstrap-agent-skills.mjs",
             'skills:check': "node ./scripts/bootstrap-agent-skills.mjs --check",
@@ -1145,17 +1102,16 @@ function createRootPackageJson(scope, packageSource) {
             '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",
-            postinstall: "node ./scripts/setup-agent-reference-repos.mjs && node ./scripts/bootstrap-agent-skills.mjs",
+            postinstall: "node ./scripts/bootstrap-agent-skills.mjs && (git rev-parse --is-inside-work-tree >/dev/null 2>&1 && lefthook install || true) && node ./scripts/setup-agent-reference-repos.mjs",
             check: 'pnpm format:check && pnpm lint && pnpm typecheck && pnpm skills:check && pnpm ultramodern:check'
         },
         engines: {
             node: '>=20',
-            pnpm: `>=${PNPM_VERSION} <11.5.0`
+            pnpm: `>=${PNPM_VERSION} <11.6.0`
         },
         workspaces: [
             'apps/*',
-            'apps/remotes/*',
-            'services/*',
+            'verticals/*',
             'packages/*'
         ],
         modernjs: {
@@ -1171,6 +1127,7 @@ function createRootPackageJson(scope, packageSource) {
         devDependencies: {
             '@effect/tsgo': EFFECT_TSGO_VERSION,
             "@typescript/native-preview": TYPESCRIPT_NATIVE_PREVIEW_VERSION,
+            lefthook: LEFTHOOK_VERSION,
             oxlint: OXLINT_VERSION,
             oxfmt: OXFMT_VERSION,
             ultracite: ULTRACITE_VERSION,
@@ -1185,11 +1142,11 @@ function remoteDependencyAlias(remote) {
 function zephyrRemoteDependency(scope, remote) {
     return `${ultramodern_workspace_packageName(scope, remote.packageSuffix)}@workspace:*`;
 }
-function resolveRemoteRefs(app, remotes = remoteApps) {
-    const remoteRefs = app.remoteRefs ?? [];
-    return remoteRefs.map((remoteRef)=>remotes.find((remote)=>remote.id === remoteRef)).filter((remote)=>void 0 !== remote);
+function resolveRemoteRefs(app, remotes = verticalApps) {
+    const verticalRefs = app.verticalRefs ?? [];
+    return verticalRefs.map((remoteRef)=>remotes.find((remote)=>remote.id === remoteRef)).filter((remote)=>void 0 !== remote);
 }
-function createModuleFederationRemoteContracts(app, remotes = remoteApps) {
+function createModuleFederationRemoteContracts(app, remotes = verticalApps) {
     return resolveRemoteRefs(app, remotes).map((remote)=>({
             id: remote.id,
             alias: remoteDependencyAlias(remote),
@@ -1198,8 +1155,8 @@ function createModuleFederationRemoteContracts(app, remotes = remoteApps) {
             manifestUrl: `http://localhost:${remote.port}/mf-manifest.json`
         }));
 }
-function createZephyrDependencies(scope, app, remotes = remoteApps) {
-    if (!app.remoteRefs?.length) return {};
+function createZephyrDependencies(scope, app, remotes = verticalApps) {
+    if (!app.verticalRefs?.length) return {};
     return Object.fromEntries(resolveRemoteRefs(app, remotes).map((remote)=>[
             remoteDependencyAlias(remote),
             zephyrRemoteDependency(scope, remote)
@@ -1317,9 +1274,9 @@ function createAppPackage(scope, app, packageSource, enableTailwind) {
         scripts: {
             dev: 'modern dev',
             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:deploy': 'MODERNJS_DEPLOY=cloudflare modern deploy',
-            'cloudflare:preview': 'MODERNJS_DEPLOY=cloudflare modern build && MODERNJS_DEPLOY=cloudflare modern deploy && wrangler dev --config .output/wrangler.json',
+            'cloudflare:build': 'ULTRAMODERN_ZEPHYR=false MODERNJS_DEPLOY=cloudflare modern build && ULTRAMODERN_ZEPHYR=false MODERNJS_DEPLOY=cloudflare modern deploy',
+            'cloudflare:deploy': 'ULTRAMODERN_CLOUDFLARE_REQUIRE_PUBLIC_URLS=true pnpm run cloudflare:build && wrangler deploy --config .output/wrangler.json',
+            'cloudflare:preview': 'pnpm run cloudflare:build && wrangler dev --config .output/wrangler.json',
             'cloudflare:proof': `node ${relativeRootFor(app.directory)}/scripts/proof-cloudflare-version.mjs --app ${app.id}`,
             serve: 'modern serve',
             typecheck: effectTsgoTypecheckCommand
@@ -1347,46 +1304,6 @@ function createAppPackage(scope, app, packageSource, enableTailwind) {
     if (Object.keys(packageExports).length > 0) packageJson.exports = packageExports;
     return packageJson;
 }
-function createServicePackage(scope, packageSource, enableTailwind, service = effectService) {
-    return {
-        private: true,
-        name: ultramodern_workspace_packageName(scope, service.packageSuffix),
-        version: '0.1.0',
-        scripts: {
-            dev: 'modern dev',
-            build: 'modern build',
-            serve: 'modern serve',
-            typecheck: effectTsgoTypecheckCommand
-        },
-        modernjs: {
-            preset: 'presetUltramodern',
-            role: 'effect-service',
-            appId: service.id,
-            topology: `${relativeRootFor(service.directory)}/topology/reference-topology.json`
-        },
-        dependencies: {
-            '@modern-js/runtime': modernPackageSpecifier('@modern-js/runtime', packageSource),
-            [ultramodern_workspace_packageName(scope, 'shared-effect-api')]: WORKSPACE_PACKAGE_VERSION,
-            react: REACT_VERSION,
-            'react-dom': REACT_DOM_VERSION
-        },
-        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',
-            typescript: TYPESCRIPT_VERSION
-        }
-    };
-}
 function createSharedPackage(scope, id, description, packageSource) {
     const packageJson = {
         private: true,
@@ -1465,11 +1382,36 @@ const zephyrRspackPlugin = () => ({
 const appId = '${app.id}';
 const cloudflareWorkerName = '${createCloudflareWorkerName(scope, app)}';
 const port = Number(process.env['${app.portEnv}'] ?? ${app.port});
-const configuredSiteUrl = process.env['MODERN_PUBLIC_SITE_URL']?.trim();
-const configuredCloudflareUrl =
-  process.env['${createCloudflarePublicUrlEnv(app)}']?.trim();
+const envValue = (name: string) => {
+  const value = process.env[name]?.trim();
+  return value !== undefined && value.length > 0 ? value : undefined;
+};
+const configuredSiteUrl = envValue('MODERN_PUBLIC_SITE_URL');
+const configuredCloudflareUrl = envValue('${createCloudflarePublicUrlEnv(app)}');
+const cloudflareWorkersDevSubdomain = envValue(
+  'ULTRAMODERN_CLOUDFLARE_WORKERS_DEV_SUBDOMAIN',
+);
+const inferredCloudflareUrl =
+  cloudflareDeployEnabled && cloudflareWorkersDevSubdomain !== undefined
+    ? \`https://\${cloudflareWorkerName}.\${cloudflareWorkersDevSubdomain}.workers.dev\`
+    : undefined;
 const siteUrl =
-  configuredSiteUrl || configuredCloudflareUrl || \`http://localhost:\${port}\`;
+  configuredCloudflareUrl ||
+  configuredSiteUrl ||
+  inferredCloudflareUrl ||
+  \`http://localhost:\${port}\`;
+
+if (
+  cloudflareDeployEnabled &&
+  process.env['ULTRAMODERN_CLOUDFLARE_REQUIRE_PUBLIC_URLS'] === 'true' &&
+  configuredCloudflareUrl === undefined &&
+  configuredSiteUrl === undefined &&
+  inferredCloudflareUrl === undefined
+) {
+  throw new Error(
+    \`Cloudflare deploy for \${appId} needs ${createCloudflarePublicUrlEnv(app)}, MODERN_PUBLIC_SITE_URL, or ULTRAMODERN_CLOUDFLARE_WORKERS_DEV_SUBDOMAIN.\`,
+  );
+}
 
 export default defineConfig(
   presetUltramodern(
@@ -1619,14 +1561,59 @@ ${entries.map(([key, entryValue])=>`    '${key}': '${entryValue}',`).join('\n')}
   }`;
 }
 function createRemoteManifestEnv(remote) {
-    return `REMOTE_${toEnvSegment(remote.domain ?? remote.id)}_MF_MANIFEST`;
+    return `VERTICAL_${toEnvSegment(remote.domain ?? remote.id)}_MF_MANIFEST`;
+}
+function createModuleFederationRemoteUrlHelpers(app, remotes = verticalApps) {
+    if (0 === resolveRemoteRefs(app, remotes).length) return '';
+    return `const cloudflareDeployEnabled =
+  process.env['MODERNJS_DEPLOY'] === 'cloudflare';
+const cloudflareWorkersDevSubdomain =
+  process.env['ULTRAMODERN_CLOUDFLARE_WORKERS_DEV_SUBDOMAIN']?.trim();
+const requireCloudflarePublicUrls =
+  process.env['ULTRAMODERN_CLOUDFLARE_REQUIRE_PUBLIC_URLS'] === 'true';
+
+function createRemoteManifestUrl(options: {
+  manifestEnv: string;
+  publicUrlEnv: string;
+  workerName: string;
+  mfName: string;
+  port: number;
+}) {
+  const configuredManifest = process.env[options.manifestEnv]?.trim();
+  if (configuredManifest !== undefined && configuredManifest.length > 0) {
+    return configuredManifest;
+  }
+
+  const configuredPublicUrl = process.env[options.publicUrlEnv]?.trim();
+  if (configuredPublicUrl !== undefined && configuredPublicUrl.length > 0) {
+    return \`\${options.mfName}@\${configuredPublicUrl.replace(/\\/+$/u, '')}/mf-manifest.json\`;
+  }
+
+  if (cloudflareDeployEnabled && cloudflareWorkersDevSubdomain !== undefined) {
+    return \`\${options.mfName}@https://\${options.workerName}.\${cloudflareWorkersDevSubdomain}.workers.dev/mf-manifest.json\`;
+  }
+
+  if (cloudflareDeployEnabled && requireCloudflarePublicUrls) {
+    throw new Error(
+      \`Cloudflare deploy needs \${options.publicUrlEnv}, \${options.manifestEnv}, or ULTRAMODERN_CLOUDFLARE_WORKERS_DEV_SUBDOMAIN for remote \${options.mfName}.\`,
+    );
+  }
+
+  return \`\${options.mfName}@http://localhost:\${options.port}/mf-manifest.json\`;
+}
+
+`;
 }
-function createModuleFederationRemotesConfig(app, remotes = remoteApps) {
+function createModuleFederationRemotesConfig(scope, app, remotes = verticalApps) {
     const remoteEntries = resolveRemoteRefs(app, remotes).map((remote)=>{
         const key = remoteDependencyAlias(remote);
-        return `    ${key}:
-      process.env['${createRemoteManifestEnv(remote)}'] ??
-      '${remote.mfName}@http://localhost:${remote.port}/mf-manifest.json',`;
+        return `    ${key}: createRemoteManifestUrl({
+      manifestEnv: '${createRemoteManifestEnv(remote)}',
+      publicUrlEnv: '${createCloudflarePublicUrlEnv(remote)}',
+      workerName: '${createCloudflareWorkerName(scope, remote)}',
+      mfName: '${remote.mfName}',
+      port: ${remote.port},
+    }),`;
     }).join('\n');
     if (!remoteEntries) return '';
     return `  remotes: {
@@ -1634,10 +1621,10 @@ ${remoteEntries}
   },
 `;
 }
-function createShellModuleFederationConfig(remotes = remoteApps) {
+function createShellModuleFederationConfig(scope, remotes = verticalApps) {
     const shellHost = {
         ...shellApp,
-        remoteRefs: remotes.map((remote)=>remote.id)
+        verticalRefs: remotes.map((remote)=>remote.id)
     };
     return `// @effect-diagnostics nodeBuiltinImport:off processEnv:off
 import { createRequire } from 'node:module';
@@ -1651,6 +1638,7 @@ const runtimeVersion = (require('@modern-js/runtime/package.json') as { version:
 const reactVersion = (require('react/package.json') as { version: string }).version;
 const reactDomVersion = (require('react-dom/package.json') as { version: string }).version;
 
+${createModuleFederationRemoteUrlHelpers(shellHost, remotes)}
 export default createModuleFederationConfig({
   treeShakingSharedExcludePlugins: ['RspackModuleFederationPlugin'],
   dev: {
@@ -1664,7 +1652,7 @@ export default createModuleFederationConfig({
   },
   filename: 'remoteEntry.js',
   name: '${shellApp.mfName}',
-${createModuleFederationRemotesConfig(shellHost, remotes)}${createSharedModuleFederationConfig()},
+${createModuleFederationRemotesConfig(scope, shellHost, remotes)}${createSharedModuleFederationConfig()},
 });
 `;
 }
@@ -1691,7 +1679,7 @@ export const ultramodernApiMarker = {
 } as const;
 `;
 }
-function createRemoteModuleFederationConfig(app, remotes = remoteApps) {
+function createRemoteModuleFederationConfig(scope, app, remotes = verticalApps) {
     const exposes = formatTsObjectLiteral(app.exposes ?? {});
     return `// @effect-diagnostics nodeBuiltinImport:off
 import { createRequire } from 'node:module';
@@ -1705,6 +1693,7 @@ const runtimeVersion = (require('@modern-js/runtime/package.json') as { version:
 const reactVersion = (require('react/package.json') as { version: string }).version;
 const reactDomVersion = (require('react-dom/package.json') as { version: string }).version;
 
+${createModuleFederationRemoteUrlHelpers(app, remotes)}
 export default createModuleFederationConfig({
   treeShakingSharedExcludePlugins: ['RspackModuleFederationPlugin'],
   dev: {
@@ -1719,7 +1708,7 @@ export default createModuleFederationConfig({
   exposes: ${exposes},
   filename: 'remoteEntry.js',
   name: '${app.mfName}',
-${createModuleFederationRemotesConfig(app, remotes)}${createSharedModuleFederationConfig()},
+${createModuleFederationRemotesConfig(scope, app, remotes)}${createSharedModuleFederationConfig()},
 });
 `;
 }
@@ -1754,6 +1743,16 @@ function createRouteOwnedI18nPaths(app) {
             },
             titleKey: 'shell.routes.listing'
         },
+        {
+            ...base,
+            canonicalPath: '/stores',
+            id: 'shell-stores',
+            localisedPaths: {
+                cs: '/prodejci',
+                en: '/stores'
+            },
+            titleKey: 'shell.routes.storePicker'
+        },
         {
             ...base,
             canonicalPath: '/tractors/:slug',
@@ -1984,7 +1983,7 @@ function createRouteAliasPage(canonicalPath) {
     return `export { default } from '${rootPageImport}';
 `;
 }
-function createAppEnvDts(app, remotes = remoteApps) {
+function createAppEnvDts(app, remotes = verticalApps) {
     const remoteModuleDeclarations = resolveRemoteRefs(app, remotes).flatMap((remote)=>Object.keys(remote.exposes ?? {}).filter((expose)=>'./Route' !== expose).map((expose)=>{
             const moduleName = `${remoteDependencyAlias(remote)}/${expose.replace(/^\.\//u, '')}`;
             return `declare module '${moduleName}' {
@@ -2002,46 +2001,11 @@ declare module '*.svg' {
 }
 ${remoteModuleDeclarations ? `\n${remoteModuleDeclarations}` : ''}`;
 }
-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 = '${service.id}';
-const port = Number(process.env['${service.portEnv}'] ?? ${service.port});
-
-export default defineConfig(
-  presetUltramodern(
-    {
-      bff: {
-        effect: {
-          openapi: {
-            path: '/openapi.json',
-          },
-        },
-        prefix: '${serviceApiPrefix(service)}',
-        runtimeFramework: 'effect',
-      },
-      plugins: [appTools(), bffPlugin()],
-      server: {
-        port,
-      },
-    },
-    {
-      appId,
-      enableBffRequestId: true,
-      enableTelemetryExporters: true,
-      telemetryFailLoudStartup: false,
-    },
-  ),
-);
-`;
-}
 function createAppRuntimeConfig(app) {
     const namespace = appI18nNamespace(app);
     const localeMessages = (language)=>{
         if ('shell' !== app.kind) return createAppLocaleMessages(app, language);
-        return Object.assign({}, createAppLocaleMessages(app, language), ...remoteApps.map((remote)=>createAppLocaleMessages(remote, language)));
+        return Object.assign({}, createAppLocaleMessages(app, language), ...verticalApps.map((remote)=>createAppLocaleMessages(remote, language)));
     };
     const resources = {
         cs: {
@@ -2082,14 +2046,44 @@ export default defineRuntimeConfig({
 function createCssTokenImport(scope) {
     return `@import '${ultramodern_workspace_packageName(scope, 'shared-design-tokens')}/tokens.css';\n`;
 }
-function createShellStyles(enableTailwind, scope) {
-    return `${enableTailwind ? "@import 'tailwindcss';\n" : ''}${createCssTokenImport(scope)}`;
+function createTailwindPrefix(raw) {
+    const prefix = raw.toLowerCase().replace(/[^a-z]/gu, '');
+    if (!prefix) throw new Error(`Cannot derive a Tailwind prefix from ${raw}`);
+    return prefix;
+}
+function tailwindPrefixForApp(app) {
+    if ('shell' === app.kind) return 'shell';
+    return createTailwindPrefix(app.domain ?? app.id);
+}
+function tailwindPrefixForService(service) {
+    return createTailwindPrefix(service.id);
+}
+function assertUniqueTailwindPrefixes(apps, services = []) {
+    const seen = new Map();
+    const entries = [
+        ...apps.map((app)=>[
+                app.id,
+                tailwindPrefixForApp(app)
+            ]),
+        ...services.map((service)=>[
+                service.id,
+                tailwindPrefixForService(service)
+            ])
+    ];
+    for (const [id, prefix] of entries){
+        const previous = seen.get(prefix);
+        if (previous) throw new Error(`Tailwind prefix ${prefix} for ${id} collides with ${previous}`);
+        seen.set(prefix, id);
+    }
 }
-function createRemoteStyles(enableTailwind, scope, _app) {
-    return `${enableTailwind ? "@import 'tailwindcss';\n" : ''}${createCssTokenImport(scope)}`;
+function createTailwindImport(prefix) {
+    return `@import 'tailwindcss' prefix(${prefix}) source(none);\n@source '..';\n`;
 }
-function createServiceStyles(enableTailwind, scope, _service) {
-    return `${enableTailwind ? "@import 'tailwindcss';\n" : ''}${createCssTokenImport(scope)}`;
+function createShellStyles(enableTailwind, scope) {
+    return `${enableTailwind ? createTailwindImport(tailwindPrefixForApp(shellApp)) : ''}${createCssTokenImport(scope)}`;
+}
+function createRemoteStyles(enableTailwind, scope, app) {
+    return `${enableTailwind ? createTailwindImport(tailwindPrefixForApp(app)) : ''}${createCssTokenImport(scope)}`;
 }
 function createAppStyles(enableTailwind, scope, app) {
     return 'shell' === app.kind ? createShellStyles(enableTailwind, scope) : createRemoteStyles(enableTailwind, scope, app);
@@ -2106,10 +2100,12 @@ function createTailwindConfig() {
     return `import type { Config } from 'tailwindcss';
 
 export default {
-  content: ['./src/**/*.{js,jsx,ts,tsx}'],
 } satisfies Config;
 `;
 }
+function createTw(prefix) {
+    return (classList)=>classList.split(/\s+/u).filter(Boolean).map((candidate)=>`${prefix}:${candidate.replace(/\[&&\]:/gu, '')}`).join(' ');
+}
 function createCommerceAssetSvg(title, palette) {
     return `<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="900" viewBox="0 0 1440 900" role="img" aria-label="${title}">
   <defs>
@@ -2185,7 +2181,7 @@ function commerceAssetsForApp(app) {
             tractor: '#914d76'
         })
     };
-    if ('remote-explore' === app.id) return {
+    if ('explore' === app.id) return {
         [commerceAssetPublicPath('autonomy.svg')]: createCommerceAssetSvg('Autonomous tractor concept', {
             accent: '#c26a2e',
             ground: '#668f55',
@@ -2211,7 +2207,7 @@ function commerceAssetsForApp(app) {
             tractor: '#914d76'
         })
     };
-    if ('remote-decide' === app.id) return {
+    if ('decide' === app.id) return {
         [commerceAssetPublicPath('field-loader.svg')]: createCommerceAssetSvg('Field Loader 112 tractor detail', {
             accent: '#d6b85d',
             ground: '#84ad58',
@@ -2372,11 +2368,12 @@ const LocalizedHead = () => {
 `;
 }
 function createShellPage() {
+    const tw = createTw(tailwindPrefixForApp(shellApp));
     return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 import { Helmet } from '@modern-js/runtime/head';
 import { useLocation } from '@modern-js/plugin-tanstack/runtime';
 import ShellFrame from '../shell-frame';
-import { StorePicker } from '../remote-components';
+import { StorePicker } from '../vertical-components';
 import { ultramodernLocalisedUrls } from '../ultramodern-route-metadata';
 import { ultramodernUiMarker } from '../../ultramodern-build';
 
@@ -2390,25 +2387,25 @@ export default function ShellHome() {
   return (
     <ShellFrame>
       <LocalizedHead />
-      <section className="mx-auto grid max-w-7xl items-center gap-8 py-8 md:grid-cols-[0.9fr_1.1fr] lg:gap-14">
-        <div className="min-w-0">
-          <p className="text-xs font-black uppercase tracking-[0.18em] text-emerald-800">{t('shell.hero.eyebrow')}</p>
-          <h1 className="mt-3 max-w-3xl text-5xl font-black leading-none tracking-normal text-stone-950 md:text-7xl">{t('shell.title')}</h1>
-          <p className="mt-5 max-w-2xl text-lg leading-8 text-stone-600">{t('shell.hero.lede')}</p>
-          <div className="mt-7 flex flex-wrap gap-3">
-            <a className="inline-flex min-h-11 items-center justify-center rounded-full bg-emerald-800 px-5 font-bold text-white shadow-lg shadow-stone-900/10" href={\`/\${language}/tractors/field-loader-112\`}>
+      <section className="${tw('mx-auto grid max-w-7xl items-center gap-8 py-8 md:grid-cols-[0.9fr_1.1fr] lg:gap-14')}">
+        <div className="${tw('min-w-0')}">
+          <p className="${tw('text-xs font-black uppercase tracking-[0.18em] text-emerald-800')}">{t('shell.hero.eyebrow')}</p>
+          <h1 className="${tw('mt-3 max-w-3xl text-5xl font-black leading-none tracking-normal text-stone-950 md:text-7xl')}">{t('shell.title')}</h1>
+          <p className="${tw('mt-5 max-w-2xl text-lg leading-8 text-stone-600')}">{t('shell.hero.lede')}</p>
+          <div className="${tw('mt-7 flex flex-wrap gap-3')}">
+            <a className="${tw('inline-flex min-h-11 items-center justify-center rounded-full bg-emerald-800 px-5 font-bold text-white shadow-lg shadow-stone-900/10')}" href={\`/\${language}/tractors/field-loader-112\`}>
             {t('shell.hero.primary')}
             </a>
-            <a className="inline-flex min-h-11 items-center justify-center rounded-full border border-stone-900/15 bg-white/90 px-5 font-bold text-stone-950 shadow-lg shadow-stone-900/10" href={\`/\${language}/tractors\`}>
+            <a className="${tw('inline-flex min-h-11 items-center justify-center rounded-full border border-stone-900/15 bg-white/90 px-5 font-bold text-stone-950 shadow-lg shadow-stone-900/10')}" href={\`/\${language}/tractors\`}>
             {t('shell.hero.secondary')}
             </a>
           </div>
         </div>
-        <img alt="" className="aspect-[16/10] w-full rounded-3xl bg-stone-200 object-cover shadow-2xl shadow-stone-900/20" src={heroField} />
+        <img alt="" className="${tw('aspect-[16/10] w-full rounded-3xl bg-stone-200 object-cover shadow-2xl shadow-stone-900/20')}" src={heroField} />
       </section>
       <StorePicker />
-      <p className="sr-only" data-testid="ultramodern-preset">presetUltramodern workspace</p>
-      <p className="sr-only" data-build-marker={ultramodernUiMarker.build} data-testid="ultramodern-ui-marker">
+      <p className="${tw('sr-only')}" data-testid="ultramodern-preset">presetUltramodern workspace</p>
+      <p className="${tw('sr-only')}" data-build-marker={ultramodernUiMarker.build} data-testid="ultramodern-ui-marker">
         {ultramodernUiMarker.appId}:{ultramodernUiMarker.version}
       </p>
     </ShellFrame>
@@ -2420,7 +2417,7 @@ function createShellTractorsPage() {
     return `import { Helmet } from '@modern-js/runtime/head';
 import { useLocation } from '@modern-js/plugin-tanstack/runtime';
 import ShellFrame from '../../shell-frame';
-import { Recommendations } from '../../remote-components';
+import { Recommendations } from '../../vertical-components';
 import { ultramodernLocalisedUrls } from '../../ultramodern-route-metadata';
 
 ${createLocalizedHeadComponent()}
@@ -2434,17 +2431,35 @@ export default function ShellTractorsPage() {
 }
 `;
 }
+function createShellStoresPage() {
+    return `import { Helmet } from '@modern-js/runtime/head';
+import { useLocation } from '@modern-js/plugin-tanstack/runtime';
+import ShellFrame from '../../shell-frame';
+import { StorePicker } from '../../vertical-components';
+import { ultramodernLocalisedUrls } from '../../ultramodern-route-metadata';
+
+${createLocalizedHeadComponent()}
+export default function ShellStoresPage() {
+  return (
+    <ShellFrame>
+      <LocalizedHead />
+      <StorePicker />
+    </ShellFrame>
+  );
+}
+`;
+}
 function createShellProductPage() {
     return `import { Helmet } from '@modern-js/runtime/head';
 import { useLocation } from '@modern-js/plugin-tanstack/runtime';
 import ShellFrame from '../../../shell-frame';
-import { ProductPage } from '../../../remote-components';
+import { ProductPage } from '../../../vertical-components';
 import { ultramodernLocalisedUrls } from '../../../ultramodern-route-metadata';
 
 ${createLocalizedHeadComponent()}
 export default function ShellProductPage() {
   return (
-    <ShellFrame>
+    <ShellFrame boundary="decide">
       <LocalizedHead />
       <ProductPage />
     </ShellFrame>
@@ -2456,13 +2471,13 @@ function createShellCartPage() {
     return `import { Helmet } from '@modern-js/runtime/head';
 import { useLocation } from '@modern-js/plugin-tanstack/runtime';
 import ShellFrame from '../../shell-frame';
-import { CartPage } from '../../remote-components';
+import { CartPage } from '../../vertical-components';
 import { ultramodernLocalisedUrls } from '../../ultramodern-route-metadata';
 
 ${createLocalizedHeadComponent()}
 export default function ShellCartPage() {
   return (
-    <ShellFrame showCart={false}>
+    <ShellFrame boundary="checkout" showCart={false}>
       <LocalizedHead />
       <CartPage />
     </ShellFrame>
@@ -2471,17 +2486,19 @@ export default function ShellCartPage() {
 `;
 }
 function createShellFrameComponent() {
+    const tw = createTw(tailwindPrefixForApp(shellApp));
     return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 import { useLocation } from '@modern-js/plugin-tanstack/runtime';
 import type { ReactNode } from 'react';
 import BoundaryOverlay from './boundary-overlay';
-import { Header, MiniCart } from './remote-components';
+import { Header, MiniCart } from './vertical-components';
 import { ultramodernLocalisedUrls } from './ultramodern-route-metadata';
 
 const supportedLanguages = ['en', 'cs'] as const;
 type SupportedLanguage = (typeof supportedLanguages)[number];
 
 type ShellFrameProps = {
+  boundary?: 'checkout' | 'decide' | 'explore';
   children: ReactNode;
   showCart?: boolean;
 };
@@ -2601,24 +2618,25 @@ const locationSuffix = (location: {
   return \`\${locationSearch}\${locationHash}\`;
 };
 
-export default function ShellFrame({ children, showCart = true }: ShellFrameProps) {
+export default function ShellFrame({ boundary = 'explore', children, showCart = true }: ShellFrameProps) {
   const { i18nInstance, language } = useModernI18n();
   const t = i18nInstance['t'].bind(i18nInstance);
   const location = useLocation();
   const suffix = locationSuffix(location);
 
   return (
-    <main className="min-h-screen bg-um-canvas px-4 py-5 text-um-foreground sm:px-6 lg:px-12">
-      <BoundaryOverlay />
-      <div className="mx-auto flex min-h-20 max-w-7xl flex-wrap items-center justify-between gap-3 bg-white/90 px-4 py-3 shadow-xl shadow-stone-900/10 sm:px-6">
+    <main className="${tw('min-h-screen bg-um-canvas px-4 py-5 text-um-foreground sm:px-6 lg:px-12')}" data-mf-page-boundary={boundary}>
+      <div className="${tw('mx-auto flex min-h-20 max-w-7xl flex-col items-start gap-3 bg-white/90 px-4 py-3 shadow-xl shadow-stone-900/10 sm:px-6 md:flex-row md:flex-wrap md:items-center md:justify-between')}">
         <Header />
-        <div className="ml-auto flex min-w-0 items-center gap-2">
-          <label className="sr-only" htmlFor="ultramodern-language">
+        <div className="${tw('flex min-w-0 flex-wrap items-center gap-2 md:ml-auto')}">
+          <label className="${tw('sr-only')}" htmlFor="ultramodern-language">
             {t('shell.language.switcher')}
           </label>
           <select
-            className="h-10 rounded-full border border-stone-900/15 bg-white px-3 text-sm font-extrabold text-stone-950 shadow-lg shadow-stone-900/5"
+            aria-label={t('shell.language.switcher')}
+            className="${tw('h-10 w-10 cursor-pointer appearance-none border-0 bg-transparent p-0 text-center text-3xl font-black leading-none text-stone-950 shadow-none [appearance:none] [text-align-last:center] focus-visible:rounded-md focus-visible:outline-3 focus-visible:outline-offset-2 focus-visible:outline-emerald-700/40 [&::-ms-expand]:hidden [&::picker-icon]:hidden [&_option]:text-xl')}"
             id="ultramodern-language"
+            name="language"
             onChange={event => {
               const nextLanguage = event.currentTarget.value;
               if (isSupportedLanguage(nextLanguage)) {
@@ -2629,15 +2647,17 @@ export default function ShellFrame({ children, showCart = true }: ShellFrameProp
             }}
             value={language}
           >
-            {supportedLanguages.map(code => (
-              <option key={code} value={code}>
-                {t(\`shell.language.\${code}\`)}
-              </option>
-            ))}
+            <option aria-label={t('shell.language.en')} value="en">
+              🇬🇧
+            </option>
+            <option aria-label={t('shell.language.cs')} value="cs">
+              🇨🇿
+            </option>
           </select>
           {showCart ? <MiniCart /> : null}
         </div>
       </div>
+      <BoundaryOverlay />
       {children}
     </main>
   );
@@ -2645,6 +2665,7 @@ export default function ShellFrame({ children, showCart = true }: ShellFrameProp
 `;
 }
 function createShellBoundaryOverlay() {
+    const tw = createTw(tailwindPrefixForApp(shellApp));
     return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 import { useEffect, useMemo, useState, type CSSProperties } from 'react';
 
@@ -2656,7 +2677,7 @@ type BoundaryConfig = {
 type BoundaryBox = BoundaryConfig & {
   height: number;
   id: string;
-  labelPlacement: 'above' | 'inside';
+  labelPlacement: 'above' | 'edge' | 'inside';
   left: number;
   top: number;
   width: number;
@@ -2678,6 +2699,7 @@ const boundaryIds = ['explore', 'decide', 'checkout'] as const;
 
 export default function BoundaryOverlay() {
   const { i18nInstance, language } = useModernI18n();
+  const [mounted, setMounted] = useState(false);
   const [enabled, setEnabled] = useState(false);
   const [boxes, setBoxes] = useState<BoundaryBox[]>([]);
   const boundaryConfig = useMemo(() => {
@@ -2701,6 +2723,10 @@ export default function BoundaryOverlay() {
     'shell.boundaries.toggle',
   );
 
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
   useEffect(() => {
     if (!enabled) {
       setBoxes([]);
@@ -2709,10 +2735,13 @@ export default function BoundaryOverlay() {
 
     const readBoxes = () => {
       const nextBoxes = Array.from(
-        document.querySelectorAll<HTMLElement>('[data-mf-boundary]'),
+        document.querySelectorAll<HTMLElement>(
+          '[data-mf-page-boundary], [data-mf-boundary]',
+        ),
       )
         .map((element, index) => {
-          const id = element.dataset.mfBoundary ?? 'unknown';
+          const pageBoundary = element.dataset.mfPageBoundary;
+          const id = pageBoundary ?? element.dataset.mfBoundary ?? 'unknown';
           const rect = element.getBoundingClientRect();
           if (rect.width <= 0 || rect.height <= 0) {
             return undefined;
@@ -2727,7 +2756,7 @@ export default function BoundaryOverlay() {
             ...config,
             height: rect.height,
             id: \`\${id}-\${index}\`,
-            labelPlacement: rect.height < 48 ? 'above' : 'inside',
+            labelPlacement: pageBoundary ? 'edge' : rect.height < 48 ? 'above' : 'inside',
             left: rect.left,
             top: rect.top,
             width: rect.width,
@@ -2742,7 +2771,7 @@ export default function BoundaryOverlay() {
 
     const resizeObserver = new ResizeObserver(readBoxes);
     for (const element of document.querySelectorAll<HTMLElement>(
-      '[data-mf-boundary]',
+      '[data-mf-page-boundary], [data-mf-boundary]',
     )) {
       resizeObserver.observe(element);
     }
@@ -2764,11 +2793,15 @@ export default function BoundaryOverlay() {
     };
   }, [boundaryConfig, enabled]);
 
+  if (!mounted) {
+    return null;
+  }
+
   return (
     <>
-      <label className="fixed bottom-5 left-5 z-[80] flex items-center gap-2 rounded-xl border border-stone-900/10 bg-white/95 px-4 py-3 text-sm font-semibold text-stone-950 shadow-2xl shadow-stone-900/15">
+      <label className="${tw('fixed bottom-5 left-5 z-[80] flex items-center gap-2 rounded-xl border border-stone-900/10 bg-white/95 px-4 py-3 text-sm font-semibold text-stone-950 shadow-2xl shadow-stone-900/15')}">
         <input
-          className="size-4 accent-emerald-800"
+          className="${tw('size-4 accent-emerald-800')}"
           checked={enabled}
           onChange={event => setEnabled(event.currentTarget.checked)}
           type="checkbox"
@@ -2776,10 +2809,10 @@ export default function BoundaryOverlay() {
         <span>{toggleLabel}</span>
       </label>
       {enabled ? (
-        <div aria-hidden="true" className="pointer-events-none fixed inset-0 z-[70]">
+        <div aria-hidden="true" className="${tw('pointer-events-none fixed inset-0 z-[70]')}">
           {boxes.map(box => (
             <div
-              className="fixed rounded-lg border"
+              className="${tw('fixed rounded-lg border-2')}"
               data-label-placement={box.labelPlacement}
               key={box.id}
               style={
@@ -2794,7 +2827,7 @@ export default function BoundaryOverlay() {
               }
             >
               <span
-                className={\`absolute right-1 top-1 whitespace-nowrap rounded-full px-2 py-1 text-[0.7rem] font-black leading-none text-stone-950 \${box.labelPlacement === 'above' ? 'bottom-[calc(100%+0.25rem)] top-auto' : ''}\`}
+                className={\`${tw('absolute whitespace-nowrap rounded-full px-2 py-1 text-[0.7rem] font-black leading-none text-stone-950')} \${box.labelPlacement === 'above' ? '${tw('bottom-[calc(100%+0.25rem)] right-1 top-auto')}' : box.labelPlacement === 'edge' ? '${tw('left-0 top-28 -translate-x-[calc(100%-1px)] -rotate-90 rounded-b-none')}' : '${tw('right-1 top-1')}'}\`}
                 style={{ backgroundColor: box.color }}
               >
                 {box.label}
@@ -2809,15 +2842,16 @@ export default function BoundaryOverlay() {
 `;
 }
 function createShellRemoteComponents(scope) {
+    const tw = createTw(tailwindPrefixForApp(shellApp));
     return `import { createLazyComponent } from '@module-federation/modern-js-v3/react';
 import { getInstance, loadRemote } from '@module-federation/modern-js-v3/runtime';
 import { Suspense, useEffect, useMemo, useState, type ComponentType } from 'react';
-import HeaderServer from '${ultramodern_workspace_packageName(scope, 'remote-explore')}/Header';
-import StorePickerServer from '${ultramodern_workspace_packageName(scope, 'remote-explore')}/StorePicker';
-import RecommendationsServer from '${ultramodern_workspace_packageName(scope, 'remote-explore')}/Recommendations';
-import ProductPageServer from '${ultramodern_workspace_packageName(scope, 'remote-decide')}/ProductPage';
-import MiniCartServer from '${ultramodern_workspace_packageName(scope, 'remote-checkout')}/MiniCart';
-import CartPageServer from '${ultramodern_workspace_packageName(scope, 'remote-checkout')}/CartPage';
+import HeaderServer from '${ultramodern_workspace_packageName(scope, 'explore')}/Header';
+import StorePickerServer from '${ultramodern_workspace_packageName(scope, 'explore')}/StorePicker';
+import RecommendationsServer from '${ultramodern_workspace_packageName(scope, 'explore')}/Recommendations';
+import ProductPageServer from '${ultramodern_workspace_packageName(scope, 'decide')}/ProductPage';
+import MiniCartServer from '${ultramodern_workspace_packageName(scope, 'checkout')}/MiniCart';
+import CartPageServer from '${ultramodern_workspace_packageName(scope, 'checkout')}/CartPage';
 
 type RemoteComponentModule = {
   default: ComponentType;
@@ -2833,7 +2867,7 @@ const loadRemoteComponent = async (specifier: string) => {
 
 const remoteFallback =
   ({ error }: { error: Error }) =>
-    <div className="rounded-xl border border-red-900/20 bg-red-50 px-4 py-3 text-sm font-semibold text-red-900" data-remote-error={error.name}>Remote unavailable</div>;
+    <div className="${tw('rounded-xl border border-red-900/20 bg-red-50 px-4 py-3 text-sm font-semibold text-red-900')}" data-remote-error={error.name}>Vertical unavailable</div>;
 
 const createHydratedRemote = (
   ServerComponent: ComponentType,
@@ -2884,6 +2918,7 @@ export const CartPage = createHydratedRemote(CartPageServer, 'checkout/CartPage'
 `;
 }
 function createRemotePage(app) {
+    const tw = createTw(tailwindPrefixForApp(app));
     const effectBffImport = appHasEffectApi(app) ? `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 import { Helmet } from '@modern-js/runtime/head';
 import { useLocation } from '@modern-js/plugin-tanstack/runtime';
@@ -2925,13 +2960,13 @@ export default function ${toPascalCase(app.id)}Home() {
   const location = useLocation();
   const suffix = locationSuffix(location);
 ${effectBffState}  return (
-    <main className="min-h-screen bg-um-canvas px-4 py-6 text-um-foreground sm:px-8">
+    <main className="${tw('min-h-screen bg-um-canvas px-4 py-6 text-um-foreground sm:px-8')}">
       <LocalizedHead />
-      <nav aria-label={t('${app.domain}.language.switcher')} className="flex gap-3">
+      <nav aria-label={t('${app.domain}.language.switcher')} className="${tw('flex gap-3')}">
         {supportedLanguages.map(code => (
           <a
             aria-current={language === code ? 'page' : undefined}
-            className="rounded-full border border-stone-900/15 bg-white px-4 py-2 text-sm font-bold text-stone-950 no-underline"
+            className="${tw('rounded-full border border-stone-900/15 bg-white px-4 py-2 text-sm font-bold text-stone-950 no-underline')}"
             href={\`\${localizedPath(location.pathname, code)}\${suffix}\`}
             key={code}
           >
@@ -2939,9 +2974,9 @@ ${effectBffState}  return (
           </a>
         ))}
       </nav>
-      <h1 className="mt-10 text-5xl font-black">{t('${app.domain}.title')}</h1>
-      <p className="mt-3 text-lg text-stone-600" data-mf-role="${app.kind}">{t('${app.domain}.role')}</p>
-      <p className="sr-only" data-build-marker={ultramodernUiMarker.build} data-testid="ultramodern-ui-marker">
+      <h1 className="${tw('mt-10 text-5xl font-black')}">{t('${app.domain}.title')}</h1>
+      <p className="${tw('mt-3 text-lg text-stone-600')}" data-mf-role="${app.kind}">{t('${app.domain}.role')}</p>
+      <p className="${tw('sr-only')}" data-build-marker={ultramodernUiMarker.build} data-testid="ultramodern-ui-marker">
         {ultramodernUiMarker.appId}:{ultramodernUiMarker.version}
       </p>
 ${effectBffMarkup}    </main>
@@ -2963,52 +2998,55 @@ export default function Layout() {
 `;
 }
 function createRemoteEntry(app) {
+    const tw = createTw(tailwindPrefixForApp(app));
     if (app.exposes?.['./ProductPage']) return `export { default } from './components/product-page';
 `;
     if (app.exposes?.['./CartPage']) return `export { default } from './components/cart-page';
 `;
     return `export default function ${toPascalCase(app.domain ?? app.id)}Route() {
   return (
-    <section className="rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10" data-mf-remote="${app.id}" data-mf-expose="./Route">
-      <h2 className="text-2xl font-black">${app.displayName}</h2>
-      <p className="mt-2 text-stone-600">Route surface for ${app.domain ?? app.id}.</p>
+    <section className="${tw('rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10')}" data-mf-remote="${app.id}" data-mf-expose="./Route">
+      <h2 className="${tw('text-2xl font-black')}">${app.displayName}</h2>
+      <p className="${tw('mt-2 text-stone-600')}">Route surface for ${app.domain ?? app.id}.</p>
     </section>
   );
 }
 `;
 }
 function createRemoteWidget(app) {
+    const tw = createTw(tailwindPrefixForApp(app));
     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 className="rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10" data-mf-remote="${app.id}">
-      <h2 className="text-2xl font-black">${app.displayName}</h2>
-      <p className="mt-2 text-stone-600">${body}</p>
+    <section className="${tw('rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10')}" data-mf-remote="${app.id}">
+      <h2 className="${tw('text-2xl font-black')}">${app.displayName}</h2>
+      <p className="${tw('mt-2 text-stone-600')}">${body}</p>
     </section>
   );
 }
 `;
 }
 function createRemoteExposeComponent(app, expose) {
-    if ('remote-explore' === app.id && './Header' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+    const tw = createTw(tailwindPrefixForApp(app));
+    if ('explore' === app.id && './Header' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 
 export default function Header() {
   const { i18nInstance, language } = useModernI18n();
   const t = i18nInstance['t'].bind(i18nInstance);
 
   return (
-    <header className="flex min-w-0 flex-1 flex-wrap items-center gap-x-8 gap-y-2" data-mf-boundary="explore">
-      <a className="whitespace-nowrap text-xl font-black tracking-normal text-stone-950 no-underline" href={\`/\${language}\`}>Acre & Iron</a>
-      <nav aria-label={t('explore.header.navigation')} className="flex items-center gap-5">
-        <a className="text-sm font-extrabold text-stone-900 no-underline" href={\`/\${language}/tractors\`}>{t('explore.header.machines')}</a>
-        <a className="text-sm font-extrabold text-stone-900 no-underline" href={\`/\${language}/stores\`}>{t('explore.header.stores')}</a>
+    <header className="${tw('flex min-w-0 flex-wrap items-center gap-x-8 gap-y-2 md:flex-1')}" data-mf-boundary="explore">
+      <a className="${tw('whitespace-nowrap text-xl font-black tracking-normal text-stone-950 no-underline')}" href={\`/\${language}\`}>Acre & Iron</a>
+      <nav aria-label={t('explore.header.navigation')} className="${tw('flex items-center gap-5')}">
+        <a className="${tw('text-sm font-extrabold text-stone-900 no-underline')}" href={\`/\${language}/tractors\`}>{t('explore.header.machines')}</a>
+        <a className="${tw('text-sm font-extrabold text-stone-900 no-underline')}" href={\`/\${language}/stores\`}>{t('explore.header.stores')}</a>
       </nav>
     </header>
   );
 }
 `;
-    if ('remote-explore' === app.id && './Recommendations' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+    if ('explore' === app.id && './Recommendations' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 
 const tractors = [
   { badge: 'explore.recommendations.bestRows', image: '${commerceAssetUrl('orchard.svg')}', name: 'Orchard Tractor', slug: 'orchard-tractor' },
@@ -3022,14 +3060,14 @@ export default function Recommendations() {
   const t = i18nInstance['t'].bind(i18nInstance);
 
   return (
-    <section className="mx-auto mt-12 max-w-7xl" data-mf-boundary="explore">
-      <h2 className="text-3xl font-black tracking-normal text-stone-950">{t('explore.recommendations.title')}</h2>
-      <div className="mt-5 grid gap-4 md:grid-cols-2 xl:grid-cols-4">
+    <section className="${tw('mx-auto mt-12 max-w-7xl')}" data-mf-boundary="explore">
+      <h2 className="${tw('text-3xl font-black tracking-normal text-stone-950')}">{t('explore.recommendations.title')}</h2>
+      <div className="${tw('mt-5 grid gap-4 md:grid-cols-2 xl:grid-cols-4')}">
         {tractors.map(tractor => (
-          <a className="block rounded-2xl bg-white/90 p-4 text-stone-950 no-underline shadow-xl shadow-stone-900/10 transition hover:-translate-y-0.5 hover:shadow-2xl" href={\`/\${language}/tractors/\${tractor.slug}\`} key={tractor.slug}>
-            <img alt="" className="aspect-video w-full rounded-xl bg-stone-200 object-cover" src={tractor.image} />
-            <span className="mt-4 block text-xs font-black uppercase tracking-[0.16em] text-amber-700">{t(tractor.badge)}</span>
-            <strong className="mt-2 block text-xl font-black leading-tight">{tractor.name}</strong>
+          <a className="${tw('block rounded-2xl bg-white/90 p-4 text-stone-950 no-underline shadow-xl shadow-stone-900/10 transition hover:-translate-y-0.5 hover:shadow-2xl')}" href={\`/\${language}/tractors/\${tractor.slug}\`} key={tractor.slug}>
+            <img alt="" className="${tw('aspect-video w-full rounded-xl bg-stone-200 object-cover')}" src={tractor.image} />
+            <span className="${tw('mt-4 block text-xs font-black uppercase tracking-[0.16em] text-amber-700')}">{t(tractor.badge)}</span>
+            <strong className="${tw('mt-2 block text-xl font-black leading-tight')}">{tractor.name}</strong>
           </a>
         ))}
       </div>
@@ -3037,7 +3075,7 @@ export default function Recommendations() {
   );
 }
 `;
-    if ('remote-explore' === app.id && './StorePicker' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+    if ('explore' === app.id && './StorePicker' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 
 const fieldLoaderImage = '${commerceAssetUrl('field-loader.svg')}';
 const vineyardImage = '${commerceAssetUrl('vineyard.svg')}';
@@ -3047,32 +3085,32 @@ export default function StorePicker() {
   const t = i18nInstance['t'].bind(i18nInstance);
 
   return (
-    <section className="mx-auto mt-12 max-w-7xl" data-mf-boundary="explore">
-      <h2 className="text-3xl font-black tracking-normal text-stone-950">{t('explore.stores.title')}</h2>
-      <div className="mt-5 grid gap-4 md:grid-cols-2">
-        <article className="rounded-2xl bg-white/90 p-4 shadow-xl shadow-stone-900/10">
-          <img alt="" className="aspect-video w-full rounded-xl bg-stone-200 object-cover" src={fieldLoaderImage} />
-          <span className="mt-4 block text-xs font-black uppercase tracking-[0.16em] text-emerald-800">{t('explore.stores.northRegion')}</span>
-          <strong className="mt-2 block text-2xl font-black">Bohemia Field Supply</strong>
+    <section className="${tw('mx-auto mt-12 max-w-7xl')}" data-mf-boundary="explore">
+      <h2 className="${tw('text-3xl font-black tracking-normal text-stone-950')}">{t('explore.stores.title')}</h2>
+      <div className="${tw('mt-5 grid gap-4 md:grid-cols-2')}">
+        <article className="${tw('rounded-2xl bg-white/90 p-4 shadow-xl shadow-stone-900/10')}">
+          <img alt="" className="${tw('aspect-video w-full rounded-xl bg-stone-200 object-cover')}" src={fieldLoaderImage} />
+          <span className="${tw('mt-4 block text-xs font-black uppercase tracking-[0.16em] text-emerald-800')}">{t('explore.stores.northRegion')}</span>
+          <strong className="${tw('mt-2 block text-2xl font-black')}">Bohemia Field Supply</strong>
         </article>
-        <article className="rounded-2xl bg-white/90 p-4 shadow-xl shadow-stone-900/10">
-          <img alt="" className="aspect-video w-full rounded-xl bg-stone-200 object-cover" src={vineyardImage} />
-          <span className="mt-4 block text-xs font-black uppercase tracking-[0.16em] text-emerald-800">{t('explore.stores.southRegion')}</span>
-          <strong className="mt-2 block text-2xl font-black">Moravia Iron Works</strong>
+        <article className="${tw('rounded-2xl bg-white/90 p-4 shadow-xl shadow-stone-900/10')}">
+          <img alt="" className="${tw('aspect-video w-full rounded-xl bg-stone-200 object-cover')}" src={vineyardImage} />
+          <span className="${tw('mt-4 block text-xs font-black uppercase tracking-[0.16em] text-emerald-800')}">{t('explore.stores.southRegion')}</span>
+          <strong className="${tw('mt-2 block text-2xl font-black')}">Moravia Iron Works</strong>
         </article>
       </div>
     </section>
   );
 }
 `;
-    if ('remote-explore' === app.id && './Footer' === expose) return `export default function Footer() {
-  return <footer className="mx-auto mt-12 max-w-7xl text-sm font-bold text-stone-600" data-mf-boundary="explore">Acre & Iron</footer>;
+    if ('explore' === app.id && './Footer' === expose) return `export default function Footer() {
+  return <footer className="${tw('mx-auto mt-12 max-w-7xl text-sm font-bold text-stone-600')}" data-mf-boundary="explore">Acre & Iron</footer>;
 }
 `;
     if ('./Widget' === expose) return createRemoteWidget(app);
     const componentName = `${toPascalCase(app.domain ?? app.id)}${toPascalCase(expose.replace(/^\.\//u, ''))}`;
-    if ('remote-decide' === app.id && './ProductPage' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
-import { AddToCart, Recommendations } from './remote-components';
+    if ('decide' === app.id && './ProductPage' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+import { AddToCart, Recommendations } from './vertical-components';
 
 const fieldLoaderImage = '${commerceAssetUrl('field-loader.svg')}';
 
@@ -3082,16 +3120,16 @@ export default function ${componentName}() {
 
   return (
     <>
-      <section className="mx-auto mt-10 grid max-w-7xl items-center gap-8 md:grid-cols-[1fr_0.95fr] lg:gap-14" data-mf-boundary="decide" data-mf-remote="${app.id}" data-mf-expose="${expose}">
-        <img alt="" className="aspect-[1/0.9] w-full rounded-3xl border-[18px] border-amber-200 bg-stone-200 object-cover shadow-2xl shadow-stone-900/20" src={fieldLoaderImage} />
+      <section className="${tw('mx-auto mt-10 grid max-w-7xl items-center gap-8 md:grid-cols-[1fr_0.95fr] lg:gap-14')}" data-mf-boundary="decide" data-mf-remote="${app.id}" data-mf-expose="${expose}">
+        <img alt="" className="${tw('aspect-[1/0.9] w-full rounded-3xl border-[18px] border-amber-200 bg-stone-200 object-cover shadow-2xl shadow-stone-900/20')}" src={fieldLoaderImage} />
         <div>
-          <p className="text-xs font-black uppercase tracking-[0.18em] text-emerald-800">{t('decide.product.eyebrow')}</p>
-          <h1 className="mt-3 text-5xl font-black leading-none tracking-normal text-stone-950 md:text-7xl">Field Loader 112</h1>
-          <p className="mt-5 max-w-2xl text-lg leading-8 text-stone-600">{t('decide.product.lede')}</p>
-          <div className="mt-8 grid gap-4 sm:grid-cols-3">
-            <article className="rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10"><span className="block text-sm font-bold text-stone-500">{t('decide.product.price')}</span><strong className="mt-2 block text-lg font-black">EUR 42,500</strong></article>
-            <article className="rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10"><span className="block text-sm font-bold text-stone-500">{t('decide.product.power')}</span><strong className="mt-2 block text-lg font-black">112 hp</strong></article>
-            <article className="rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10"><span className="block text-sm font-bold text-stone-500">{t('decide.product.availability')}</span><strong className="mt-2 block text-lg font-black">{t('decide.product.inStock')}</strong></article>
+          <p className="${tw('text-xs font-black uppercase tracking-[0.18em] text-emerald-800')}">{t('decide.product.eyebrow')}</p>
+          <h1 className="${tw('mt-3 text-5xl font-black leading-none tracking-normal text-stone-950 md:text-7xl')}">Field Loader 112</h1>
+          <p className="${tw('mt-5 max-w-2xl text-lg leading-8 text-stone-600')}">{t('decide.product.lede')}</p>
+          <div className="${tw('mt-8 grid gap-4 sm:grid-cols-3')}">
+            <article className="${tw('rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10')}"><span className="${tw('block text-sm font-bold text-stone-500')}">{t('decide.product.price')}</span><strong className="${tw('mt-2 block text-lg font-black')}">EUR 42,500</strong></article>
+            <article className="${tw('rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10')}"><span className="${tw('block text-sm font-bold text-stone-500')}">{t('decide.product.power')}</span><strong className="${tw('mt-2 block text-lg font-black')}">112 hp</strong></article>
+            <article className="${tw('rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10')}"><span className="${tw('block text-sm font-bold text-stone-500')}">{t('decide.product.availability')}</span><strong className="${tw('mt-2 block text-lg font-black')}">{t('decide.product.inStock')}</strong></article>
           </div>
           <AddToCart />
         </div>
@@ -3101,7 +3139,7 @@ export default function ${componentName}() {
   );
 }
 `;
-    if ('remote-checkout' === app.id && './AddToCart' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+    if ('checkout' === app.id && './AddToCart' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 import { useCartLines } from '../cart-store';
 
 export default function ${componentName}() {
@@ -3110,18 +3148,18 @@ export default function ${componentName}() {
   const cart = useCartLines();
 
   return (
-    <div className="mt-8 flex flex-wrap gap-3" data-mf-boundary="checkout">
-      <button className="inline-flex min-h-11 items-center justify-center rounded-full bg-emerald-800 px-5 font-bold text-white shadow-lg shadow-stone-900/10" onClick={cart.addFieldLoader} type="button">
+    <div className="${tw('mt-8 flex flex-wrap gap-3')}" data-mf-boundary="checkout">
+      <button className="${tw('inline-flex min-h-11 items-center justify-center rounded-full bg-emerald-800 px-5 font-bold text-white shadow-lg shadow-stone-900/10')}" onClick={cart.addFieldLoader} type="button">
         {t('checkout.actions.addToCart')}
       </button>
-      <a className="inline-flex min-h-11 items-center justify-center rounded-full border border-stone-900/15 bg-white/90 px-5 font-bold text-stone-950 shadow-lg shadow-stone-900/10" href={\`/\${language}/cart\`}>
+      <a className="${tw('inline-flex min-h-11 items-center justify-center rounded-full border border-stone-900/15 bg-white/90 px-5 font-bold text-stone-950 shadow-lg shadow-stone-900/10')}" href={\`/\${language}/cart\`}>
         {t('checkout.actions.viewCart')}
       </a>
     </div>
   );
 }
 `;
-    if ('remote-checkout' === app.id && './MiniCart' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+    if ('checkout' === app.id && './MiniCart' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 import { useCartLines } from '../cart-store';
 
 export default function ${componentName}() {
@@ -3131,13 +3169,13 @@ export default function ${componentName}() {
   const count = cart.lines.reduce((sum, line) => sum + line.quantity, 0);
 
   return (
-    <a className="inline-flex h-10 shrink-0 items-center justify-center rounded-full border border-stone-900/15 bg-white px-4 text-sm font-extrabold text-stone-950 no-underline shadow-lg shadow-stone-900/5" data-mf-boundary="checkout" href={\`/\${language}/cart\`}>
+    <a className="${tw('inline-flex h-10 shrink-0 items-center justify-center rounded-full border border-stone-900/15 bg-white px-4 text-sm font-extrabold text-stone-950 no-underline shadow-lg shadow-stone-900/5')}" data-mf-boundary="checkout" href={\`/\${language}/cart\`}>
       {t('checkout.cart.title')} ({count})
     </a>
   );
 }
 `;
-    if ('remote-checkout' === app.id && './CartPage' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
+    if ('checkout' === app.id && './CartPage' === expose) return `import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 import { useCartLines } from '../cart-store';
 
 export default function ${componentName}() {
@@ -3146,24 +3184,24 @@ export default function ${componentName}() {
   const cart = useCartLines();
 
   return (
-    <section className="mx-auto mt-10 max-w-7xl" data-mf-boundary="checkout" data-mf-remote="${app.id}" data-mf-expose="${expose}">
-      <h1 className="text-5xl font-black leading-none tracking-normal text-stone-950 md:text-7xl">{t('checkout.cart.title')}</h1>
-      <div className="mt-8 rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10">
+    <section className="${tw('mx-auto mt-10 max-w-7xl')}" data-mf-boundary="checkout" data-mf-remote="${app.id}" data-mf-expose="${expose}">
+      <h1 className="${tw('text-5xl font-black leading-none tracking-normal text-stone-950 md:text-7xl')}">{t('checkout.cart.title')}</h1>
+      <div className="${tw('mt-8 rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10')}">
         {cart.lines.length === 0 ? (
           <p>{t('checkout.cart.empty')}</p>
         ) : (
           <>
             {cart.lines.map(line => (
-              <article className="grid gap-4 border-t border-stone-900/10 py-4 first:border-t-0 sm:grid-cols-[1fr_auto] sm:items-center" key={line.id}>
+              <article className="${tw('grid gap-4 border-t border-stone-900/10 py-4 first:border-t-0 sm:grid-cols-[1fr_auto] sm:items-center')}" key={line.id}>
                 <div>
-                  <strong className="text-lg font-black">{line.name}</strong>
-                  <p className="text-stone-600">EUR {line.price.toLocaleString('en-US')}</p>
+                  <strong className="${tw('text-lg font-black')}">{line.name}</strong>
+                  <p className="${tw('text-stone-600')}">EUR {line.price.toLocaleString('en-US')}</p>
                 </div>
-                <div className="flex flex-wrap items-center gap-2">
-                  <button className="inline-flex size-9 items-center justify-center rounded-full border border-stone-900/15 bg-white font-black" onClick={() => cart.decrement(line.id)} type="button">-</button>
-                  <span className="min-w-6 text-center font-black">{line.quantity}</span>
-                  <button className="inline-flex size-9 items-center justify-center rounded-full border border-stone-900/15 bg-white font-black" onClick={() => cart.increment(line.id)} type="button">+</button>
-                  <button className="inline-flex min-h-10 items-center justify-center rounded-full border border-stone-900/15 bg-white px-4 font-bold text-stone-950" onClick={() => cart.remove(line.id)} type="button">
+                <div className="${tw('flex flex-wrap items-center gap-2')}">
+                  <button className="${tw('inline-flex size-9 items-center justify-center rounded-full border border-stone-900/15 bg-white font-black')}" onClick={() => cart.decrement(line.id)} type="button">-</button>
+                  <span className="${tw('min-w-6 text-center font-black')}">{line.quantity}</span>
+                  <button className="${tw('inline-flex size-9 items-center justify-center rounded-full border border-stone-900/15 bg-white font-black')}" onClick={() => cart.increment(line.id)} type="button">+</button>
+                  <button className="${tw('inline-flex min-h-10 items-center justify-center rounded-full border border-stone-900/15 bg-white px-4 font-bold text-stone-950')}" onClick={() => cart.remove(line.id)} type="button">
                     {t('checkout.actions.remove')}
                   </button>
                 </div>
@@ -3179,20 +3217,21 @@ export default function ${componentName}() {
 `;
     return `export default function ${componentName}() {
   return (
-    <section className="rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10" data-mf-remote="${app.id}" data-mf-expose="${expose}">
-      <h2 className="text-2xl font-black">${app.displayName} ${expose.replace(/^\.\//u, '')}</h2>
-      <p className="mt-2 text-stone-600">Module Federation surface owned by ${app.ownership.team}.</p>
+    <section className="${tw('rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10')}" data-mf-remote="${app.id}" data-mf-expose="${expose}">
+      <h2 className="${tw('text-2xl font-black')}">${app.displayName} ${expose.replace(/^\.\//u, '')}</h2>
+      <p className="${tw('mt-2 text-stone-600')}">Module Federation surface owned by ${app.ownership.team}.</p>
     </section>
   );
 }
 `;
 }
-function createDecideRemoteComponents(scope) {
+function createDecideRemoteComponents(scope, app) {
+    const tw = createTw(tailwindPrefixForApp(app));
     return `import { createLazyComponent } from '@module-federation/modern-js-v3/react';
 import { getInstance, loadRemote } from '@module-federation/modern-js-v3/runtime';
 import { Suspense, useEffect, useMemo, useState, type ComponentType } from 'react';
-import RecommendationsServer from '${ultramodern_workspace_packageName(scope, 'remote-explore')}/Recommendations';
-import AddToCartServer from '${ultramodern_workspace_packageName(scope, 'remote-checkout')}/AddToCart';
+import RecommendationsServer from '${ultramodern_workspace_packageName(scope, 'explore')}/Recommendations';
+import AddToCartServer from '${ultramodern_workspace_packageName(scope, 'checkout')}/AddToCart';
 
 type RemoteComponentModule = {
   default: ComponentType;
@@ -3208,7 +3247,7 @@ const loadRemoteComponent = async (specifier: string) => {
 
 const remoteFallback =
   ({ error }: { error: Error }) =>
-    <div className="rounded-xl border border-red-900/20 bg-red-50 px-4 py-3 text-sm font-semibold text-red-900" data-remote-error={error.name}>Remote unavailable</div>;
+    <div className="${tw('rounded-xl border border-red-900/20 bg-red-50 px-4 py-3 text-sm font-semibold text-red-900')}" data-remote-error={error.name}>Vertical unavailable</div>;
 
 const createHydratedRemote = (
   ServerComponent: ComponentType,
@@ -3296,9 +3335,9 @@ function createAppLocaleMessages(app, language) {
                 switcher: 'en' === language ? 'Language' : 'Jazyk'
             },
             remotes: {
-                checkout: 'en' === language ? 'Checkout Remote' : 'Checkout remote',
-                decide: 'en' === language ? 'Decide Remote' : 'Decide remote',
-                explore: 'en' === language ? 'Explore Remote' : 'Explore remote'
+                checkout: 'en' === language ? 'Checkout Vertical' : 'Checkout remote',
+                decide: 'en' === language ? 'Decide Vertical' : 'Decide remote',
+                explore: 'en' === language ? 'Explore Vertical' : 'Explore remote'
             },
             boundaries: {
                 checkout: 'en' === language ? 'checkout' : 'pokladna',
@@ -3310,7 +3349,8 @@ function createAppLocaleMessages(app, language) {
                 cart: 'en' === language ? 'Cart' : 'Košík',
                 home: 'en' === language ? 'Home' : 'Domů',
                 listing: 'en' === language ? 'Tractors' : 'Traktory',
-                productDetail: 'en' === language ? 'Tractor detail' : 'Detail traktoru'
+                productDetail: 'en' === language ? 'Tractor detail' : 'Detail traktoru',
+                storePicker: 'en' === language ? 'Stores' : 'Prodejci'
             },
             title: 'en' === language ? 'Acre & Iron' : 'Acre & Iron'
         }
@@ -3383,10 +3423,11 @@ function createAppLocaleMessages(app, language) {
         }
     };
 }
-function createDesignButton() {
+function createDesignButton(app) {
+    const tw = createTw(tailwindPrefixForApp(app));
     return `export default function Button({ label }: { label: string }) {
   return (
-    <button className="rounded-full text-um-foreground" type="button">
+    <button className="${tw('rounded-full text-um-foreground')}" type="button">
       {label}
     </button>
   );
@@ -3511,35 +3552,35 @@ function createSharedDesignTokensCss() {
 }
 `;
 }
-function serviceEffectApiExport(service = effectService) {
+function serviceEffectApiExport(service) {
     return `${toCamelCase(effectApiStem(service))}EffectApi`;
 }
-function serviceEffectGroupName(service = effectService) {
+function serviceEffectGroupName(service) {
     return toCamelCase(effectApiStem(service));
 }
-function serviceEffectApiName(service = effectService) {
+function serviceEffectApiName(service) {
     return `${toPascalCase(effectApiStem(service))}EffectApi`;
 }
-function serviceEffectSchemaExport(service = effectService) {
+function serviceEffectSchemaExport(service) {
     return `${toCamelCase(effectApiStem(service))}ItemSchema`;
 }
-function serviceEffectMarkerSchemaExport(service = effectService) {
+function serviceEffectMarkerSchemaExport(service) {
     return `${toCamelCase(effectApiStem(service))}MarkerSchema`;
 }
-function serviceEffectReadinessSchemaExport(service = effectService) {
+function serviceEffectReadinessSchemaExport(service) {
     return `${toCamelCase(effectApiStem(service))}ReadinessSchema`;
 }
-function serviceEffectErrorStem(service = effectService) {
+function serviceEffectErrorStem(service) {
     const stem = effectApiStem(service);
     return 'recommendations' === stem ? 'recommendation' : stem;
 }
-function serviceEffectCreatePayloadSchemaExport(service = effectService) {
+function serviceEffectCreatePayloadSchemaExport(service) {
     return `${toCamelCase(effectApiStem(service))}CreatePayloadSchema`;
 }
-function serviceEffectNotFoundErrorExport(service = effectService) {
+function serviceEffectNotFoundErrorExport(service) {
     return `${toPascalCase(serviceEffectErrorStem(service))}NotFound`;
 }
-function serviceEffectNotFoundSchemaExport(service = effectService) {
+function serviceEffectNotFoundSchemaExport(service) {
     return `${toCamelCase(serviceEffectErrorStem(service))}NotFoundSchema`;
 }
 function createEffectSharedApiImports() {
@@ -3552,7 +3593,7 @@ function createEffectSharedApiImports() {
 } from '@modern-js/plugin-bff/effect-client';
 `;
 }
-function createEffectSharedApiContract(service = effectService) {
+function createEffectSharedApiContract(service) {
     const schemaExport = serviceEffectSchemaExport(service);
     const markerSchemaExport = serviceEffectMarkerSchemaExport(service);
     const readinessSchemaExport = serviceEffectReadinessSchemaExport(service);
@@ -3693,7 +3734,7 @@ ${createEffectSharedApiContract(service)}`;
 } as const;
 `;
 }
-function createEffectServiceEntry(scope, service = effectService, contractImportPath = ultramodern_workspace_packageName(scope, 'shared-effect-api')) {
+function createEffectServiceEntry(scope, service, contractImportPath = ultramodern_workspace_packageName(scope, 'shared-effect-api')) {
     const apiExport = serviceEffectApiExport(service);
     const groupName = serviceEffectGroupName(service);
     const notFoundErrorExport = serviceEffectNotFoundErrorExport(service);
@@ -3917,7 +3958,7 @@ function createShellEffectClient(scope) {
   getCheckoutReadiness,
   listCheckout,
   type CheckoutClientOptions,
-} from '${ultramodern_workspace_packageName(scope, 'remote-checkout')}/effect/client';
+} from '${ultramodern_workspace_packageName(scope, 'checkout')}/effect/client';
 
 export {
   createDecide,
@@ -3926,7 +3967,7 @@ export {
   getDecideReadiness,
   listDecide,
   type DecideClientOptions,
-} from '${ultramodern_workspace_packageName(scope, 'remote-decide')}/effect/client';
+} from '${ultramodern_workspace_packageName(scope, 'decide')}/effect/client';
 
 export {
   createExplore,
@@ -3935,7 +3976,7 @@ export {
   getExploreReadiness,
   listExplore,
   type ExploreClientOptions,
-} from '${ultramodern_workspace_packageName(scope, 'remote-explore')}/effect/client';
+} from '${ultramodern_workspace_packageName(scope, 'explore')}/effect/client';
 `;
 }
 function toPascalCase(value) {
@@ -4076,14 +4117,13 @@ function createTopology(scope) {
     return {
         schemaVersion: 1,
         id: 'ultramodern-superapp-workspace-reference-topology',
-        description: 'Generated UltraModern workspace skeleton based on the reference topology shape.',
+        description: 'Generated UltraModern workspace skeleton with full-stack vertical ownership.',
         preset: 'presetUltramodern',
-        sourceFixture: "scripts/mv-integration-pilot/__fixtures__/reference-topology.json",
         shell: {
             id: shellApp.id,
             kind: 'shell',
             package: ultramodern_workspace_packageName(scope, shellApp.packageSuffix),
-            remoteRefs: shellApp.remoteRefs,
+            verticalRefs: shellApp.verticalRefs,
             moduleFederation: {
                 role: 'host',
                 name: shellApp.mfName,
@@ -4094,31 +4134,31 @@ function createTopology(scope) {
             cloudflare: createCloudflareDeployContract(scope, shellApp),
             ownership: shellApp.ownership
         },
-        remotes: remoteApps.map((remote)=>({
-                id: remote.id,
-                kind: remote.kind,
-                domain: remote.domain,
-                package: ultramodern_workspace_packageName(scope, remote.packageSuffix),
+        verticals: verticalApps.map((vertical)=>({
+                id: vertical.id,
+                kind: vertical.kind,
+                domain: vertical.domain,
+                package: ultramodern_workspace_packageName(scope, vertical.packageSuffix),
+                path: vertical.directory,
                 moduleFederation: {
                     role: 'remote',
-                    name: remote.mfName,
-                    manifestUrl: `http://localhost:${remote.port}/mf-manifest.json`,
-                    exposes: Object.keys(remote.exposes ?? {}),
-                    ...remote.remoteRefs?.length ? {
-                        remoteRefs: remote.remoteRefs,
-                        remotes: createModuleFederationRemoteContracts(remote)
+                    name: vertical.mfName,
+                    manifestUrl: `http://localhost:${vertical.port}/mf-manifest.json`,
+                    exposes: Object.keys(vertical.exposes ?? {}),
+                    ...vertical.verticalRefs?.length ? {
+                        verticalRefs: vertical.verticalRefs,
+                        remotes: createModuleFederationRemoteContracts(vertical)
                     } : {},
                     ssr: true,
                     fallbackTelemetryEvent: 'modernjs:mv-runtime-parity',
                     sharedContractVersion: 'mf-ssr-contract-v1'
                 },
-                ...effectApiTopologyMetadata(remote) ? {
-                    api: effectApiTopologyMetadata(remote)
+                ...effectApiTopologyMetadata(vertical) ? {
+                    api: effectApiTopologyMetadata(vertical)
                 } : {},
-                cloudflare: createCloudflareDeployContract(scope, remote),
-                ownership: remote.ownership
+                cloudflare: createCloudflareDeployContract(scope, vertical),
+                ownership: vertical.ownership
             })),
-        effectServices: [],
         sharedPackages: sharedPackages.map((sharedPackage)=>({
                 id: sharedPackage.id,
                 package: ultramodern_workspace_packageName(scope, sharedPackage.id),
@@ -4128,7 +4168,7 @@ function createTopology(scope) {
         validation: {
             script: "scripts/validate-ultramodern-workspace.mjs",
             commands: [
-                'mise exec -- pnpm ultramodern:check'
+                'pnpm ultramodern:check'
             ]
         }
     };
@@ -4139,7 +4179,7 @@ function createOwnership(scope) {
         preset: 'presetUltramodern',
         owners: [
             shellApp,
-            ...remoteApps,
+            ...verticalApps,
             ...sharedPackages.map((sharedPackage)=>({
                     id: sharedPackage.id,
                     packageSuffix: sharedPackage.id,
@@ -4173,12 +4213,12 @@ function createDevelopmentOverlay() {
         preset: 'presetUltramodern',
         ports: Object.fromEntries([
             shellApp,
-            ...remoteApps
+            ...verticalApps
         ].map((app)=>[
                 app.id,
                 app.port
             ])),
-        manifests: Object.fromEntries(remoteApps.map((remote)=>[
+        manifests: Object.fromEntries(verticalApps.map((remote)=>[
                 remote.id,
                 `http://localhost:${remote.port}/mf-manifest.json`
             ])),
@@ -4260,8 +4300,9 @@ function createAppConfigContract(app) {
         output: {
             assetPrefix: {
                 envFallbackOrder: [
-                    'MODERN_PUBLIC_SITE_URL',
                     createCloudflarePublicUrlEnv(app),
+                    'MODERN_PUBLIC_SITE_URL',
+                    'ULTRAMODERN_CLOUDFLARE_WORKERS_DEV_SUBDOMAIN',
                     app.portEnv
                 ],
                 defaultLocalhostPort: app.port
@@ -4297,15 +4338,14 @@ function createAppConfigContract(app) {
 }
 function cssLayerName(app) {
     if ('shell' === app.kind) return 'ultramodern-shell-base';
-    return `ultramodern-remote-${app.domain ?? app.id}`;
+    return `ultramodern-vertical-${app.domain ?? app.id}`;
 }
 function cssRole(app) {
     if ('shell' === app.kind) return 'shell-base-overlay';
-    return 'horizontal-remote' === app.kind ? 'horizontal-remote-css' : 'vertical-remote-css';
+    return 'vertical-css';
 }
 function cssClassPrefix(app) {
-    if ('shell' === app.kind) return 'shell-';
-    return `${app.domain ?? app.id.replace(/^remote-/, '')}-`;
+    return `${tailwindPrefixForApp(app)}:`;
 }
 function createCssDedupeContract(scope) {
     return {
@@ -4323,7 +4363,7 @@ function createCssSsrContract(app) {
         cloudflare: true,
         firstPaintRequired: true,
         linkEmission: 'modern-ssr-css-assets',
-        remoteCss: 'shell' === app.kind ? 'host-preloads-shell-and-shared-css' : 'remote-manifest-owned-css'
+        verticalCss: 'shell' === app.kind ? 'host-preloads-shell-and-shared-css' : 'federated-manifest-owned-css'
     };
 }
 function createAppCssFederationContract(scope, app) {
@@ -4359,7 +4399,7 @@ function createAppCssFederationContract(scope, app) {
                 'src/routes/index.css'
             ],
             ...'shell' !== app.kind ? {
-                remoteEntry: 'src/remote-entry.tsx'
+                federationEntry: 'src/federation-entry.tsx'
             } : {}
         },
         assets: {
@@ -4421,10 +4461,10 @@ function createCssFederationContract(scope) {
                 'base',
                 'overlay'
             ],
-            remotes: [
+            verticals: [
                 'vertical-css'
             ],
-            forbiddenRemoteLayers: [
+            forbiddenVerticalLayers: [
                 'ultramodern-shell-base',
                 'ultramodern-shell-overlay'
             ]
@@ -4438,9 +4478,9 @@ function createStylingContract(scope, app, enableTailwind) {
             postcssPlugins: [
                 '@tailwindcss/postcss'
             ],
-            contentGlobs: [
-                './src/**/*.{js,jsx,ts,tsx}'
-            ]
+            prefix: tailwindPrefixForApp(app),
+            source: '..',
+            sourceMode: 'source(none)'
         } : {},
         federation: createAppCssFederationContract(scope, app)
     };
@@ -4448,7 +4488,7 @@ function createStylingContract(scope, app, enableTailwind) {
 function createAppGeneratedContract(scope, app, apps, enableTailwind) {
     const appWithResolvedRefs = 'shell' === app.kind ? {
         ...app,
-        remoteRefs: apps.filter((candidate)=>'shell' !== candidate.kind).map((candidate)=>candidate.id)
+        verticalRefs: apps.filter((candidate)=>'shell' !== candidate.kind).map((candidate)=>candidate.id)
     } : app;
     const consumedRemotes = createModuleFederationRemoteContracts(appWithResolvedRefs, apps);
     return {
@@ -4512,8 +4552,8 @@ function createAppGeneratedContract(scope, app, apps, enableTailwind) {
         },
         moduleFederation: {
             name: app.mfName,
-            ...appWithResolvedRefs.remoteRefs?.length ? {
-                remoteRefs: appWithResolvedRefs.remoteRefs,
+            ...appWithResolvedRefs.verticalRefs?.length ? {
+                verticalRefs: appWithResolvedRefs.verticalRefs,
                 remotes: consumedRemotes
             } : {},
             exposes: Object.keys(app.exposes ?? {}),
@@ -4554,7 +4594,7 @@ function createAppGeneratedContract(scope, app, apps, enableTailwind) {
 }
 function createGeneratedContract(scope, apps = [
     shellApp,
-    ...remoteApps
+    ...verticalApps
 ], enableTailwind = true) {
     return {
         schemaVersion: 1,
@@ -4586,7 +4626,7 @@ function createTemplateManifest(modernVersion, packageSource) {
             id: 'modernjs-ultramodern-superapp-workspace',
             version: modernVersion,
             displayName: 'Modern.js UltraModern SuperApp Workspace',
-            description: 'Canonical shell, remotes, Effect service, shared packages, and topology skeleton.',
+            description: 'Canonical shell, full-stack verticals, shared packages, and topology skeleton.',
             compatibilityLane: 'ultramodern-mv',
             minimumModernVersion: modernVersion
         },
@@ -4614,6 +4654,7 @@ function createTemplateManifest(modernVersion, packageSource) {
             targetRoot: 'generated-project-root',
             allowedPaths: [
                 '.agents/**',
+                '.codex/**',
                 '.github/**',
                 '.gitignore',
                 '.mise.toml',
@@ -4622,6 +4663,7 @@ function createTemplateManifest(modernVersion, packageSource) {
                 'README.md',
                 'apps/**',
                 'packages/**',
+                'lefthook.yml',
                 'package.json',
                 'oxfmt.config.ts',
                 'oxlint.config.ts',
@@ -4692,13 +4734,13 @@ function createTemplateManifest(modernVersion, packageSource) {
             ],
             expectedCommands: [
                 'mise install',
-                'mise exec -- pnpm install',
-                'mise exec -- pnpm run ultramodern:check'
+                'pnpm install',
+                'pnpm run ultramodern:check'
             ]
         }
     };
 }
-function createAssertMfTypesScript(remotes = remoteApps) {
+function createAssertMfTypesScript(remotes = verticalApps) {
     return `import fs from 'node:fs';
 import path from 'node:path';
 
@@ -4770,7 +4812,7 @@ for (const appDir of appDirs) {
 }
 `;
 }
-function createWorkspaceValidationScript(scope, enableTailwind, remotes = remoteApps) {
+function createWorkspaceValidationScript(scope, enableTailwind, remotes = verticalApps) {
     const verticals = remotes.filter(appHasEffectApi).map((remote)=>({
             id: remote.id,
             domain: remote.domain,
@@ -4779,19 +4821,18 @@ function createWorkspaceValidationScript(scope, enableTailwind, remotes = remote
             path: remote.directory,
             mfName: remote.mfName,
             apiPrefix: remote.effectApi.prefix,
+            tailwindPrefix: tailwindPrefixForApp(remote),
             packageName: ultramodern_workspace_packageName(scope, remote.packageSuffix),
             exposes: Object.keys(remote.exposes ?? {}),
             componentPaths: Object.keys(remote.exposes ?? {}).map((expose)=>remoteComponentOutputPath(remote, expose)).filter((componentPath)=>Boolean(componentPath)),
             namespace: appI18nNamespace(remote),
             routePagePaths: createRouteOwnedI18nPaths(remote).filter((route)=>'/' !== route.canonicalPath).map((route)=>createRoutePageFilePath(remote, route.canonicalPath)),
             localisedUrls: createLocalisedUrlsMap(remote),
-            remoteRefs: remote.remoteRefs ?? []
+            verticalRefs: remote.verticalRefs ?? []
         }));
     const shellNamespace = appI18nNamespace(shellApp);
     const oldRemotePaths = [
-        'apps/remotes/remote-commerce',
-        'apps/remotes/remote-identity',
-        'apps/remotes/remote-design-system'
+        'apps/remotes'
     ];
     return `import { execFileSync } from 'node:child_process';
 import fs from 'node:fs';
@@ -4828,7 +4869,7 @@ const activePnpmVersion = execFileSync('pnpm', ['--version'], {
 
 assert(
   activePnpmVersion === expectedPnpmVersion,
-  \`Generated workspace requires pnpm \${expectedPnpmVersion}; active pnpm is \${activePnpmVersion}. Run mise install, then rerun through mise exec -- pnpm ...\`,
+  \`Generated workspace requires pnpm \${expectedPnpmVersion}; active pnpm is \${activePnpmVersion}. Run mise install, then rerun pnpm from the activated shell.\`,
 );
 
 const requiredPaths = [
@@ -4884,7 +4925,7 @@ for (const vertical of fullStackVerticals) {
     \`\${vertical.path}/src/effect/\${vertical.stem}-client.ts\`,
     \`\${vertical.path}/src/modern-app-env.d.ts\`,
     \`\${vertical.path}/src/modern.runtime.ts\`,
-    \`\${vertical.path}/src/remote-entry.tsx\`,
+    \`\${vertical.path}/src/federation-entry.tsx\`,
     ...vertical.componentPaths,
     \`\${vertical.path}/locales/en/translation.json\`,
     \`\${vertical.path}/locales/en/\${vertical.namespace}.json\`,
@@ -4933,18 +4974,21 @@ assert(packageSource.strategy === 'workspace' || packageSource.strategy === 'ins
 assert(packageSource.generatedWorkspacePackages?.specifier === 'workspace:*', 'Generated workspace packages must keep workspace:* links');
 assert(
   rootPackage.scripts?.build ===
-    'pnpm -r --filter "./apps/remotes/**" run build && pnpm --filter "./apps/shell-super-app" run build && pnpm ultramodern:assert-mf-types',
-  'Root build script must build remotes before shell',
+    'pnpm -r --filter "./verticals/*" run build && pnpm --filter "./apps/shell-super-app" run build && pnpm ultramodern:assert-mf-types',
+  'Root build script must build verticals before shell',
 );
 assert(rootPackage.scripts?.['ultramodern:check'] === 'node ./scripts/validate-ultramodern-workspace.mjs', 'Root must expose ultramodern:check');
 assert(rootPackage.scripts?.['ultramodern:assert-mf-types'] === 'node ./scripts/assert-mf-types.mjs', 'Root must expose ultramodern:assert-mf-types');
 assert(rootPackage.scripts?.['cloudflare:deploy']?.includes('run cloudflare:deploy'), 'Root must expose cloudflare:deploy');
 assert(rootPackage.scripts?.['cloudflare:proof'] === 'node ./scripts/proof-cloudflare-version.mjs --out .codex/reports/cloudflare-version-proof/public-url-proof.json', 'Root must expose cloudflare:proof');
+assert(rootPackage.scripts?.['skills:install'] === 'node ./scripts/bootstrap-agent-skills.mjs', 'Root must expose skills:install');
+assert(rootPackage.scripts?.['skills:check'] === 'node ./scripts/bootstrap-agent-skills.mjs --check', 'Root must expose skills:check');
+assert(rootPackage.scripts?.postinstall === 'node ./scripts/bootstrap-agent-skills.mjs && (git rev-parse --is-inside-work-tree >/dev/null 2>&1 && lefthook install || true) && node ./scripts/setup-agent-reference-repos.mjs', 'Root postinstall must bootstrap agent skills and hooks before reference repositories');
 
 const expectedAppIds = ['shell-super-app', ...fullStackVerticals.map(vertical => vertical.id)];
 assert(
   JSON.stringify(generatedContract.apps?.map(app => app.id)) === JSON.stringify(expectedAppIds),
-  'Generated contract must contain shell plus the Tractor full-stack remotes',
+  'Generated contract must contain shell plus the Tractor full-stack verticals',
 );
 assert(generatedContract.cssFederation?.sharedDesignTokens?.owner?.id === 'shared-design-tokens', 'CSS federation must declare shared design token ownership');
 assert(generatedContract.cssFederation?.sharedDesignTokens?.role === 'shared-design-tokens', 'CSS federation must mark shared-design-tokens as token owner');
@@ -4966,7 +5010,7 @@ const expectedZephyrDependencies = Object.fromEntries(
 assert(
   JSON.stringify(shellPackage['zephyr:dependencies']) ===
     JSON.stringify(expectedZephyrDependencies),
-  'Shell Zephyr dependencies must reference every Tractor remote package',
+  'Shell Zephyr dependencies must reference every Tractor vertical package',
 );
 const shellContract = generatedContract.apps?.find(app => app.id === 'shell-super-app');
 assert(shellContract?.deploy?.cloudflare?.workerName === expectedWorkerName('shell-super-app'), 'Shell Cloudflare workerName is incorrect');
@@ -4975,7 +5019,7 @@ assert(topology.shell?.cloudflare?.workerName === expectedWorkerName('shell-supe
 assert(shellContract?.styling?.federation?.owner?.id === 'shell-super-app', 'Shell CSS federation owner is missing');
 assert(shellContract?.styling?.federation?.role === 'shell-base-overlay', 'Shell must own base and overlay CSS');
 assert(shellContract?.styling?.federation?.rootSelector === '[data-app-id="shell-super-app"]', 'Shell CSS root selector is incorrect');
-assert(shellContract?.styling?.federation?.classPrefix === 'shell-', 'Shell CSS class prefix is incorrect');
+assert(shellContract?.styling?.federation?.classPrefix === 'shell:', 'Shell CSS class prefix is incorrect');
 assert(shellContract?.styling?.federation?.layers?.owned?.includes('ultramodern-shell-base'), 'Shell must own the base CSS layer');
 assert(shellContract?.styling?.federation?.layers?.owned?.includes('ultramodern-shell-overlay'), 'Shell must own the overlay CSS layer');
 assert(shellContract?.styling?.federation?.entrypoints?.css?.includes('src/routes/index.css'), 'Shell CSS entrypoint is missing');
@@ -4983,23 +5027,24 @@ assert(shellContract?.styling?.federation?.assets?.shared?.some(asset => asset.e
 assert(shellContract?.styling?.federation?.dedupe?.duplicateBaseStylesAllowed === false, 'Shell CSS contract must forbid duplicated base styles');
 assert(shellContract?.styling?.federation?.ssr?.firstPaintRequired === true, 'Shell CSS must be required for SSR first paint');
 assert(
-  topology.shell?.remoteRefs?.join(',') === fullStackVerticals.map(vertical => vertical.id).join(','),
-  'Topology shell remoteRefs must match Tractor remotes',
+  topology.shell?.verticalRefs?.join(',') === fullStackVerticals.map(vertical => vertical.id).join(','),
+  'Topology shell verticalRefs must match Tractor verticals',
 );
-assert(topology.remotes?.length === fullStackVerticals.length, 'Topology must contain only Tractor remotes');
-assert((topology.effectServices ?? []).length === 0, 'Default APIs must be vertical-owned, not effectServices');
+assert(topology.verticals?.length === fullStackVerticals.length, 'Topology must contain only Tractor verticals');
+assert(!('remotes' in topology), 'Topology must not expose legacy remotes; use verticals');
+assert(!('effectServices' in topology), 'Default APIs must be vertical-owned, not effectServices');
 
 for (const vertical of fullStackVerticals) {
   const packageJson = readJson(\`\${vertical.path}/package.json\`);
   assert(packageJson.name === vertical.packageName, \`\${vertical.id} package name is incorrect\`);
-  assert(packageJson.scripts?.['cloudflare:deploy'] === 'MODERNJS_DEPLOY=cloudflare modern deploy', \`\${vertical.id} must expose cloudflare:deploy\`);
+  assert(packageJson.scripts?.['cloudflare:deploy'] === 'ULTRAMODERN_CLOUDFLARE_REQUIRE_PUBLIC_URLS=true pnpm run cloudflare:build && wrangler deploy --config .output/wrangler.json', \`\${vertical.id} must expose cloudflare:deploy\`);
   assert(packageJson.scripts?.['cloudflare:proof']?.includes(\`--app \${vertical.id}\`), \`\${vertical.id} must expose cloudflare:proof\`);
   assert(packageJson.dependencies?.['@modern-js/plugin-bff'], \`\${vertical.id} must depend on plugin-bff\`);
   assert(packageJson.exports?.['./effect/client'] === \`./src/effect/\${vertical.stem}-client.ts\`, \`\${vertical.id} must export its Effect client\`);
   assert(packageJson.exports?.['./shared/effect/api'] === './shared/effect/api.ts', \`\${vertical.id} must export its Effect API contract\`);
   const expectedVerticalZephyrDependencies = Object.fromEntries(
     fullStackVerticals
-      .filter(candidate => vertical.remoteRefs.includes(candidate.id))
+      .filter(candidate => vertical.verticalRefs.includes(candidate.id))
       .map(candidate => [
         candidate.domain,
         \`\${candidate.packageName}@workspace:*\`,
@@ -5008,7 +5053,7 @@ for (const vertical of fullStackVerticals) {
   assert(
     JSON.stringify(packageJson['zephyr:dependencies']) ===
       JSON.stringify(expectedVerticalZephyrDependencies),
-    \`\${vertical.id} Zephyr dependencies must match declared MF remote refs\`,
+    \`\${vertical.id} Zephyr dependencies must match declared vertical refs\`,
   );
 
   const contractEntry = generatedContract.apps?.find(app => app.id === vertical.id);
@@ -5020,11 +5065,11 @@ for (const vertical of fullStackVerticals) {
   assert(contractEntry?.moduleFederation?.name === vertical.mfName, \`\${vertical.id} MF name is incorrect\`);
   assert(JSON.stringify(contractEntry?.moduleFederation?.exposes) === JSON.stringify(vertical.exposes), \`\${vertical.id} MF exposes are incorrect\`);
   assert(contractEntry?.moduleFederation?.dts?.compilerInstance === '--package typescript -- tsc', \`\${vertical.id} must keep mandatory DTS compiler\`);
-  assert(JSON.stringify(contractEntry?.moduleFederation?.remoteRefs ?? []) === JSON.stringify(vertical.remoteRefs), \`\${vertical.id} MF remoteRefs are incorrect\`);
+  assert(JSON.stringify(contractEntry?.moduleFederation?.verticalRefs ?? []) === JSON.stringify(vertical.verticalRefs), \`\${vertical.id} MF verticalRefs are incorrect\`);
   assert(
     JSON.stringify((contractEntry?.moduleFederation?.remotes ?? []).map(remote => remote.id)) ===
-      JSON.stringify(vertical.remoteRefs),
-    \`\${vertical.id} MF consumed remotes are incorrect\`,
+      JSON.stringify(vertical.verticalRefs),
+    \`\${vertical.id} MF consumed verticals are incorrect\`,
   );
   assert(contractEntry?.effect?.prefix === vertical.apiPrefix, \`\${vertical.id} Effect API prefix is incorrect\`);
   assert(contractEntry?.effect?.group === vertical.group, \`\${vertical.id} Effect group is incorrect\`);
@@ -5041,23 +5086,23 @@ for (const vertical of fullStackVerticals) {
   assert(contractEntry?.routes?.source === 'route-owned', \`\${vertical.id} routes must be route-owned\`);
   assert(contractEntry?.routes?.metadataExport === './src/routes/ultramodern-route-metadata', \`\${vertical.id} route metadata export is incorrect\`);
   assert(contractEntry?.styling?.federation?.owner?.id === vertical.id, \`\${vertical.id} CSS federation owner is missing\`);
-  assert(contractEntry?.styling?.federation?.role === 'vertical-remote-css', \`\${vertical.id} must own only vertical CSS\`);
+  assert(contractEntry?.styling?.federation?.role === 'vertical-css', \`\${vertical.id} must own only vertical CSS\`);
   assert(contractEntry?.styling?.federation?.rootSelector === \`[data-app-id="\${vertical.id}"]\`, \`\${vertical.id} CSS root selector is incorrect\`);
-  assert(contractEntry?.styling?.federation?.classPrefix === \`\${vertical.domain}-\`, \`\${vertical.id} CSS class prefix is incorrect\`);
-  assert(contractEntry?.styling?.federation?.layers?.owned?.includes(\`ultramodern-remote-\${vertical.domain}\`), \`\${vertical.id} remote CSS layer is missing\`);
+  assert(contractEntry?.styling?.federation?.classPrefix === \`\${vertical.domain}:\`, \`\${vertical.id} CSS class prefix is incorrect\`);
+  assert(contractEntry?.styling?.federation?.layers?.owned?.includes(\`ultramodern-vertical-\${vertical.domain}\`), \`\${vertical.id} vertical CSS layer is missing\`);
   assert(!contractEntry?.styling?.federation?.layers?.owned?.includes('ultramodern-shell-base'), \`\${vertical.id} must not own shell base CSS\`);
-  assert(contractEntry?.styling?.federation?.entrypoints?.remoteEntry === 'src/remote-entry.tsx', \`\${vertical.id} remote CSS contract must include remote entry\`);
+  assert(contractEntry?.styling?.federation?.entrypoints?.federationEntry === 'src/federation-entry.tsx', \`\${vertical.id} CSS contract must include federation entry\`);
   assert(contractEntry?.styling?.federation?.assets?.shared?.some(asset => asset.endsWith('/shared-design-tokens/tokens.css')), \`\${vertical.id} must import shared design token CSS\`);
   assert(contractEntry?.styling?.federation?.dedupe?.runtimeLoad === 'once-per-content-hash', \`\${vertical.id} CSS dedupe strategy is incorrect\`);
-  assert(contractEntry?.styling?.federation?.ssr?.remoteCss === 'remote-manifest-owned-css', \`\${vertical.id} SSR CSS loading contract is incorrect\`);
+  assert(contractEntry?.styling?.federation?.ssr?.verticalCss === 'federated-manifest-owned-css', \`\${vertical.id} SSR CSS loading contract is incorrect\`);
 
-  const topologyEntry = topology.remotes?.find(remote => remote.id === vertical.id);
+  const topologyEntry = topology.verticals?.find(verticalEntry => verticalEntry.id === vertical.id);
   assert(topologyEntry?.kind === 'vertical', \`\${vertical.id} topology kind is incorrect\`);
   assert(topologyEntry?.package === vertical.packageName, \`\${vertical.id} topology package is incorrect\`);
   assert(topologyEntry?.cloudflare?.workerName === expectedWorkerName(vertical.id), \`\${vertical.id} topology Cloudflare workerName is incorrect\`);
   assert(topologyEntry?.moduleFederation?.name === vertical.mfName, \`\${vertical.id} topology MF name is incorrect\`);
   assert(JSON.stringify(topologyEntry?.moduleFederation?.exposes) === JSON.stringify(vertical.exposes), \`\${vertical.id} topology exposes are incorrect\`);
-  assert(JSON.stringify(topologyEntry?.moduleFederation?.remoteRefs ?? []) === JSON.stringify(vertical.remoteRefs), \`\${vertical.id} topology remoteRefs are incorrect\`);
+  assert(JSON.stringify(topologyEntry?.moduleFederation?.verticalRefs ?? []) === JSON.stringify(vertical.verticalRefs), \`\${vertical.id} topology verticalRefs are incorrect\`);
   assert(topologyEntry?.api?.effect?.bff?.prefix === vertical.apiPrefix, \`\${vertical.id} topology API prefix is incorrect\`);
   assert(topologyEntry?.api?.effect?.serverEntry === \`\${vertical.path}/api/effect/index.ts\`, \`\${vertical.id} topology server entry is incorrect\`);
   assert(topologyEntry?.api?.effect?.readiness?.endpoint === \`/effect/\${vertical.stem}/readiness\`, \`\${vertical.id} topology readiness endpoint is incorrect\`);
@@ -5124,10 +5169,10 @@ function parseArgs(argv) {
 
 function printHelp() {
   process.stdout.write(\`Usage:
-  node scripts/proof-cloudflare-version.mjs [--app remote-explore] [--out evidence.json] [--require-public-urls]
+  node scripts/proof-cloudflare-version.mjs [--app explore] [--out evidence.json] [--require-public-urls]
 
 Set each app's public URL using the contract env key, for example:
-  ULTRAMODERN_PUBLIC_URL_REMOTE_EXPLORE=https://remote-explore.example.workers.dev
+  ULTRAMODERN_PUBLIC_URL_EXPLORE=https://explore.example.workers.dev
 \`);
 }
 
@@ -5392,12 +5437,15 @@ main().then(
 );
 `;
 }
-function writeGeneratedWorkspaceScripts(targetDir, scope, enableTailwind, remotes = remoteApps) {
+function writeGeneratedWorkspaceScripts(targetDir, scope, enableTailwind, remotes = verticalApps) {
     writeFileReplacing(targetDir, "scripts/assert-mf-types.mjs", createAssertMfTypesScript());
     writeFileReplacing(targetDir, "scripts/validate-ultramodern-workspace.mjs", createWorkspaceValidationScript(scope, enableTailwind, remotes));
     writeFileReplacing(targetDir, "scripts/proof-cloudflare-version.mjs", createCloudflareVersionProofScript());
 }
 function writeApp(targetDir, scope, app, packageSource, enableTailwind) {
+    const writeAppFile = (relativePath, content)=>{
+        writeFile(targetDir, `${app.directory}/${relativePath}`, content);
+    };
     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`, createAppEnvDts(app));
@@ -5414,75 +5462,40 @@ function writeApp(targetDir, scope, app, packageSource, 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}/module-federation.config.ts`, 'shell' === app.kind ? createShellModuleFederationConfig(scope) : createRemoteModuleFederationConfig(scope, app));
+    writeAppFile('src/routes/layout.tsx', createLayout(app.id));
     for (const [relativePath, content] of Object.entries(commerceAssetsForApp(app)))writeFile(targetDir, `${app.directory}/${relativePath}`, content);
-    writeFile(targetDir, `${app.directory}/src/routes/[lang]/page.tsx`, 'shell' === app.kind ? createShellPage() : createRemotePage(app));
+    writeAppFile('src/routes/[lang]/page.tsx', 'shell' === app.kind ? createShellPage() : createRemotePage(app));
     for (const route of createRouteOwnedI18nPaths(app))if ('/' !== route.canonicalPath && 'shell' !== app.kind) writeFile(targetDir, createRoutePageFilePath(app, route.canonicalPath), createRouteAliasPage(route.canonicalPath));
     if ('shell' === app.kind) {
-        writeFile(targetDir, `${app.directory}/src/routes/remote-components.tsx`, createShellRemoteComponents(scope));
-        writeFile(targetDir, `${app.directory}/src/routes/shell-frame.tsx`, createShellFrameComponent());
-        writeFile(targetDir, `${app.directory}/src/routes/boundary-overlay.tsx`, createShellBoundaryOverlay());
+        writeAppFile('src/routes/vertical-components.tsx', createShellRemoteComponents(scope));
+        writeAppFile('src/routes/shell-frame.tsx', createShellFrameComponent());
+        writeAppFile('src/routes/boundary-overlay.tsx', createShellBoundaryOverlay());
         writeFile(targetDir, `${app.directory}/src/effect/recommendations-client.ts`, createShellEffectClient(scope));
-        writeFile(targetDir, `${app.directory}/src/routes/[lang]/tractors/page.tsx`, createShellTractorsPage());
-        writeFile(targetDir, `${app.directory}/src/routes/[lang]/tractors/[slug]/page.tsx`, createShellProductPage());
-        writeFile(targetDir, `${app.directory}/src/routes/[lang]/cart/page.tsx`, createShellCartPage());
+        writeAppFile('src/routes/[lang]/tractors/page.tsx', createShellTractorsPage());
+        writeAppFile('src/routes/[lang]/stores/page.tsx', createShellStoresPage());
+        writeAppFile('src/routes/[lang]/tractors/[slug]/page.tsx', createShellProductPage());
+        writeAppFile('src/routes/[lang]/cart/page.tsx', createShellCartPage());
     }
     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));
-        if ('remote-decide' === app.id) writeFile(targetDir, `${app.directory}/src/components/remote-components.tsx`, createDecideRemoteComponents(scope));
-        if ('remote-checkout' === app.id) writeFile(targetDir, `${app.directory}/src/cart-store.ts`, createCheckoutCartStore());
+    if ('vertical' === app.kind) {
+        writeAppFile('src/federation-entry.tsx', createRemoteEntry(app));
+        if ('decide' === app.id) writeAppFile('src/components/vertical-components.tsx', createDecideRemoteComponents(scope, app));
+        if ('checkout' === app.id) writeFile(targetDir, `${app.directory}/src/cart-store.ts`, createCheckoutCartStore());
         for (const expose of Object.keys(app.exposes ?? {})){
             const outputPath = remoteComponentOutputPath(app, expose);
-            if (outputPath) writeFile(targetDir, outputPath, createRemoteExposeComponent(app, expose));
+            if (outputPath) writeAppFile(outputPath.slice(app.directory.length + 1), createRemoteExposeComponent(app, expose));
         }
     }
     if ('horizontal-design-system' === app.kind) {
-        writeFile(targetDir, `${app.directory}/src/components/button.tsx`, createDesignButton());
+        writeAppFile('src/components/button.tsx', createDesignButton(app));
         writeFile(targetDir, `${app.directory}/src/tokens.ts`, createDesignTokens());
     }
 }
-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 className="min-h-screen bg-um-canvas px-4 py-6 text-um-foreground sm:px-8">
-      <section className="rounded-2xl bg-white/90 p-5 shadow-xl shadow-stone-900/10">
-        <h1 className="text-3xl font-black">${service.id} Effect service</h1>
-      </section>
-    </main>
-  );
-}
-`);
-    writeFile(targetDir, `${service.directory}/src/routes/index.css`, createServiceStyles(enableTailwind, scope, service));
-    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}';
-`);
-    if ('shared-design-tokens' === sharedPackage.id) writeFile(targetDir, `${sharedPackage.directory}/src/tokens.css`, createSharedDesignTokensCss());
-}
 function writeSharedPackages(targetDir, scope, packageSource) {
     for (const sharedPackage of sharedPackages){
         writeJson(targetDir, `${sharedPackage.directory}/package.json`, createSharedPackage(scope, sharedPackage.id, sharedPackage.description, packageSource));
@@ -5516,18 +5529,6 @@ function readJsonFile(filePath) {
 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,
@@ -5557,9 +5558,17 @@ function existingPackageSource(workspaceRoot, modernVersion, packageSource) {
         aliasPackageNamePrefix
     };
 }
-function assertValidMicroVerticalName(name) {
+function existingTailwindEnabled(workspaceRoot) {
+    const contractPath = node_path.join(workspaceRoot, GENERATED_CONTRACT_PATH);
+    if (!node_fs.existsSync(contractPath)) return true;
+    const contract = readJsonFile(contractPath);
+    const apps = isRecord(contract) && Array.isArray(contract.apps) ? contract.apps : [];
+    const shell = apps.find((app)=>isRecord(app) && app.id === shellApp.id);
+    return shell?.styling && isRecord(shell.styling) ? false !== shell.styling.tailwind : true;
+}
+function assertValidVerticalName(name) {
     const normalized = toKebabCase(name);
-    if (!normalized || normalized !== name) throw new Error(`Invalid MicroVertical name "${name}". Use lowercase kebab-case.`);
+    if (!normalized || normalized !== name) throw new Error(`Invalid Vertical name "${name}". Use lowercase kebab-case.`);
     return normalized;
 }
 function nextAvailablePort(ports) {
@@ -5595,30 +5604,31 @@ function addShellWorkspaceDependency(workspaceRoot, scope, remote) {
     shellPackage.dependencies[ultramodern_workspace_packageName(scope, remote.packageSuffix)] = WORKSPACE_PACKAGE_VERSION;
     writeJsonFile(packagePath, shellPackage);
 }
-function remoteTopologyEntry(scope, remote) {
+function verticalTopologyEntry(scope, vertical) {
     return {
-        id: remote.id,
-        kind: remote.kind,
-        domain: remote.domain,
-        package: ultramodern_workspace_packageName(scope, remote.packageSuffix),
+        id: vertical.id,
+        kind: vertical.kind,
+        domain: vertical.domain,
+        package: ultramodern_workspace_packageName(scope, vertical.packageSuffix),
+        path: vertical.directory,
         moduleFederation: {
             role: 'remote',
-            name: remote.mfName,
-            manifestUrl: `http://localhost:${remote.port}/mf-manifest.json`,
-            exposes: Object.keys(remote.exposes ?? {}),
-            ...remote.remoteRefs?.length ? {
-                remoteRefs: remote.remoteRefs,
-                remotes: createModuleFederationRemoteContracts(remote)
+            name: vertical.mfName,
+            manifestUrl: `http://localhost:${vertical.port}/mf-manifest.json`,
+            exposes: Object.keys(vertical.exposes ?? {}),
+            ...vertical.verticalRefs?.length ? {
+                verticalRefs: vertical.verticalRefs,
+                remotes: createModuleFederationRemoteContracts(vertical)
             } : {},
             ssr: true,
             fallbackTelemetryEvent: 'modernjs:mv-runtime-parity',
             sharedContractVersion: 'mf-ssr-contract-v1'
         },
-        ...effectApiTopologyMetadata(remote) ? {
-            api: effectApiTopologyMetadata(remote)
+        ...effectApiTopologyMetadata(vertical) ? {
+            api: effectApiTopologyMetadata(vertical)
         } : {},
-        cloudflare: createCloudflareDeployContract(scope, remote),
-        ownership: remote.ownership
+        cloudflare: createCloudflareDeployContract(scope, vertical),
+        ownership: vertical.ownership
     };
 }
 function ownershipEntry(scope, owner) {
@@ -5629,47 +5639,48 @@ function ownershipEntry(scope, owner) {
         ownership: owner.ownership
     };
 }
-function remotesFromTopology(topology, ports) {
-    return (topology.remotes ?? []).map((remote)=>{
-        const packageSuffix = remote.package?.split('/').at(-1) ?? remote.id;
-        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 : [
+function verticalsFromTopology(topology, ports) {
+    return (topology.verticals ?? []).map((vertical)=>{
+        const domain = vertical.domain ?? String(vertical.id);
+        const packageSuffix = vertical.package?.split('/').at(-1) ?? domain;
+        const effectApi = vertical.api?.effect ? {
+            stem: 'string' == typeof vertical.api.effect.basePath ? vertical.api.effect.basePath.split('/').filter(Boolean).at(-1) ?? domain : domain,
+            prefix: vertical.api.effect.bff?.prefix ?? `/${domain}-api`,
+            consumedBy: Array.isArray(vertical.api.effect.consumedBy) ? vertical.api.effect.consumedBy : [
                 shellApp.id,
-                remote.id
+                vertical.id
             ]
         } : void 0;
         return {
-            id: remote.id,
-            directory: 'string' == typeof remote.path ? remote.path : `apps/remotes/${packageSuffix}`,
+            id: vertical.id,
+            directory: 'string' == typeof vertical.path ? vertical.path : `verticals/${domain}`,
             packageSuffix,
-            displayName: remote.id,
-            kind: remote.kind ?? 'vertical',
-            domain: remote.domain ?? String(remote.id).replace(/^remote-/, ''),
+            displayName: vertical.displayName ?? `${toPascalCase(domain)} Vertical`,
+            kind: 'vertical',
+            domain,
             portEnv: '',
-            port: 'number' == typeof ports[remote.id] ? ports[remote.id] : 0,
-            mfName: remote.moduleFederation?.name ?? `remote${toPascalCase(remote.id)}`,
-            ...Array.isArray(remote.moduleFederation?.exposes) ? {
-                exposes: Object.fromEntries(remote.moduleFederation.exposes.map((expose)=>[
+            port: 'number' == typeof ports[vertical.id] ? ports[vertical.id] : 0,
+            mfName: vertical.moduleFederation?.name ?? `vertical${toPascalCase(domain)}`,
+            ...Array.isArray(vertical.moduleFederation?.exposes) ? {
+                exposes: Object.fromEntries(vertical.moduleFederation.exposes.map((expose)=>[
                         expose,
                         ''
                     ]))
             } : {},
-            ...Array.isArray(remote.moduleFederation?.remoteRefs) ? {
-                remoteRefs: remote.moduleFederation.remoteRefs
-            } : Array.isArray(remote.moduleFederation?.remotes) ? {
-                remoteRefs: remote.moduleFederation.remotes.map((entry)=>entry.id).filter((id)=>'string' == typeof id)
+            ...Array.isArray(vertical.moduleFederation?.verticalRefs) ? {
+                verticalRefs: vertical.moduleFederation.verticalRefs
+            } : Array.isArray(vertical.moduleFederation?.remotes) ? {
+                verticalRefs: vertical.moduleFederation.remotes.map((entry)=>entry.id).filter((id)=>'string' == typeof id)
             } : {},
             ...effectApi ? {
                 effectApi
             } : {},
-            ownership: remote.ownership ?? createNeutralOwnership(remote.id)
+            ownership: vertical.ownership ?? createNeutralOwnership(vertical.id)
         };
     });
 }
-function addUltramodernMicroVertical(options) {
-    const name = assertValidMicroVerticalName(options.name);
+function addUltramodernVertical(options) {
+    const name = assertValidVerticalName(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');
@@ -5685,124 +5696,63 @@ function addUltramodernMicroVertical(options) {
     const overlay = readJsonFile(overlayPath);
     overlay.ports ??= {};
     const packageSource = existingPackageSource(options.workspaceRoot, options.modernVersion, options.packageSource);
-    const enableTailwind = false !== options.enableTailwind;
+    const enableTailwind = options.enableTailwind ?? existingTailwindEnabled(options.workspaceRoot);
     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);
-        const updatedRemotes = remotesFromTopology(topology, overlay.ports);
-        writeJsonFile(node_path.join(options.workspaceRoot, GENERATED_CONTRACT_PATH), createGeneratedContract(scope, [
-            {
-                ...shellApp,
-                remoteRefs: updatedRemotes.map((remote)=>remote.id)
-            },
-            ...updatedRemotes
-        ], enableTailwind));
-        const shellConfigPath = node_path.join(options.workspaceRoot, `${shellApp.directory}/module-federation.config.ts`);
-        writeFileReplacing(options.workspaceRoot, `${shellApp.directory}/module-federation.config.ts`, createShellModuleFederationConfig(updatedRemotes));
-        if (!node_fs.existsSync(shellConfigPath)) throw new Error('Shell Module Federation config was not regenerated');
-        writeGeneratedWorkspaceScripts(options.workspaceRoot, scope, enableTailwind, updatedRemotes);
-        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}`);
+    const vertical = createVerticalDescriptor(name, port);
+    assertCanCreate(options.workspaceRoot, vertical.directory);
+    if ((topology.verticals ?? []).some((entry)=>entry.id === vertical.id)) throw new Error(`Topology already contains ${vertical.id}`);
+    if (Object.values(overlay.ports).includes(vertical.port)) throw new Error(`Development port ${vertical.port} is already in use`);
+    writeApp(options.workspaceRoot, scope, vertical, packageSource, enableTailwind);
+    topology.shell ??= {};
+    topology.shell.verticalRefs ??= [];
+    topology.shell.verticalRefs.push(vertical.id);
+    topology.shell.moduleFederation ??= {};
+    topology.shell.moduleFederation.remotes ??= [];
+    topology.shell.moduleFederation.remotes.push({
+        id: vertical.id,
+        name: vertical.mfName,
+        manifestUrl: `http://localhost:${vertical.port}/mf-manifest.json`
+    });
+    topology.verticals ??= [];
+    topology.verticals.push(verticalTopologyEntry(scope, vertical));
+    ownership.owners ??= [];
+    ownership.owners.push(ownershipEntry(scope, vertical));
+    overlay.ports[vertical.id] = vertical.port;
+    overlay.manifests ??= {};
+    overlay.manifests[vertical.id] = `http://localhost:${vertical.port}/mf-manifest.json`;
+    overlay.apis ??= {};
+    overlay.apis[vertical.id] = `http://localhost:${vertical.port}${effectApiPrefix(vertical)}`;
+    writeJsonFile(topologyPath, topology);
+    writeJsonFile(ownershipPath, ownership);
+    writeJsonFile(overlayPath, overlay);
+    const updatedVerticals = verticalsFromTopology(topology, overlay.ports);
+    assertUniqueTailwindPrefixes([
+        shellApp,
+        ...updatedVerticals
+    ]);
+    writeJsonFile(node_path.join(options.workspaceRoot, GENERATED_CONTRACT_PATH), createGeneratedContract(scope, [
+        {
+            ...shellApp,
+            verticalRefs: updatedVerticals.map((vertical)=>vertical.id)
+        },
+        ...updatedVerticals
+    ], enableTailwind));
+    const shellConfigPath = node_path.join(options.workspaceRoot, `${shellApp.directory}/module-federation.config.ts`);
+    writeFileReplacing(options.workspaceRoot, `${shellApp.directory}/module-federation.config.ts`, createShellModuleFederationConfig(scope, updatedVerticals));
+    if (!node_fs.existsSync(shellConfigPath)) throw new Error('Shell Module Federation config was not regenerated');
+    writeGeneratedWorkspaceScripts(options.workspaceRoot, scope, enableTailwind, updatedVerticals);
+    addShellZephyrDependency(options.workspaceRoot, scope, vertical);
+    addShellWorkspaceDependency(options.workspaceRoot, scope, vertical);
+    addRootDevScript(options.workspaceRoot, scope, vertical.packageSuffix, name);
 }
 function generateUltramodernWorkspace(options) {
     const scope = toPackageScope(options.packageName);
     const packageSource = resolvePackageSource(options);
     const enableTailwind = false !== options.enableTailwind;
+    assertUniqueTailwindPrefixes([
+        shellApp,
+        ...verticalApps
+    ]);
     node_fs.mkdirSync(options.targetDir, {
         recursive: true
     });
@@ -5821,10 +5771,10 @@ function generateUltramodernWorkspace(options) {
     writeJson(options.targetDir, '.modernjs/ultramodern-package-source.json', createPackageSourceMetadata(scope, packageSource));
     writeJson(options.targetDir, GENERATED_CONTRACT_PATH, createGeneratedContract(scope, [
         shellApp,
-        ...remoteApps
+        ...verticalApps
     ], enableTailwind));
     writeApp(options.targetDir, scope, shellApp, packageSource, enableTailwind);
-    for (const remote of remoteApps)writeApp(options.targetDir, scope, remote, packageSource, enableTailwind);
+    for (const remote of verticalApps)writeApp(options.targetDir, scope, remote, packageSource, enableTailwind);
     writeSharedPackages(options.targetDir, scope, packageSource);
     writeGeneratedWorkspaceScripts(options.targetDir, scope, enableTailwind);
 }
@@ -5839,7 +5789,7 @@ 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 src_PNPM_VERSION = '11.5.0';
 const requiredDeniedPaths = [
     '.git/**',
     '.npmrc',
@@ -5852,9 +5802,11 @@ const requiredDeniedPaths = [
 const requiredLifecycleDeniedScripts = [
     'preinstall',
     'install',
-    'postinstall',
     'prepare'
 ];
+const requiredLifecycleAllowedScripts = [
+    'postinstall'
+];
 function getOptionValue(args, names) {
     for (const name of names){
         const prefix = `${name}=`;
@@ -6024,6 +5976,7 @@ function createBuiltinTemplateManifest(version) {
             allowedPaths: [
                 '.agents/**',
                 '.browserslistrc',
+                '.codex/**',
                 '.github/**',
                 '.gitignore',
                 '.mise.toml',
@@ -6033,6 +5986,7 @@ function createBuiltinTemplateManifest(version) {
                 'README.md',
                 'api/**',
                 'config/**',
+                'lefthook.yml',
                 'modern.config.ts',
                 'oxfmt.config.ts',
                 'oxlint.config.ts',
@@ -6053,7 +6007,7 @@ function createBuiltinTemplateManifest(version) {
         lifecyclePolicy: {
             denyByDefault: true,
             deniedScripts: requiredLifecycleDeniedScripts,
-            allowedScripts: [],
+            allowedScripts: requiredLifecycleAllowedScripts,
             requiresExplicitOptIn: true
         },
         validation: {
@@ -6072,7 +6026,7 @@ function createBuiltinTemplateManifest(version) {
             ],
             postMaterializationValidation: [
                 'ultramodern-contract-check',
-                'dependency-install-with-lifecycle-deny',
+                'agent-skill-postinstall-allowed',
                 'github-workflow-security-enforced',
                 'package-source-retained',
                 'pnpm-11-policy-enforced',
@@ -6081,9 +6035,9 @@ function createBuiltinTemplateManifest(version) {
             ],
             expectedCommands: [
                 'mise install',
-                'mise exec -- pnpm install',
-                'mise exec -- pnpm test',
-                'mise exec -- pnpm run ultramodern:check'
+                'pnpm install',
+                'pnpm test',
+                'pnpm run ultramodern:check'
             ]
         }
     };
@@ -6146,7 +6100,7 @@ function validateTemplateManifest(manifest) {
     assertTemplateManifest(!manifest.materialization.overwritePolicy || 'deny-existing' === manifest.materialization.overwritePolicy || 'allow-generated-only' === manifest.materialization.overwritePolicy, 'materialization.overwritePolicy is unsupported');
     assertTemplateManifest(true === manifest.lifecyclePolicy.denyByDefault, 'lifecyclePolicy.denyByDefault must be true');
     for (const scriptName of requiredLifecycleDeniedScripts)assertTemplateManifest(manifest.lifecyclePolicy.deniedScripts.includes(scriptName), `lifecyclePolicy.deniedScripts must include ${scriptName}`);
-    assertTemplateManifest(0 === manifest.lifecyclePolicy.allowedScripts.length, 'lifecyclePolicy.allowedScripts must be empty for builtin materialization');
+    assertTemplateManifest(JSON.stringify(manifest.lifecyclePolicy.allowedScripts) === JSON.stringify(requiredLifecycleAllowedScripts), 'lifecyclePolicy.allowedScripts must only allow generated postinstall');
     assertTemplateManifest(true === manifest.validation.schemaValidation, 'validation.schemaValidation must be true');
     for (const token of [
         'source-type-supported',
@@ -6227,7 +6181,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));
+    if (localeKeys.help.optionVertical) console.log(i18n.t(localeKeys.help.optionVertical));
     console.log(i18n.t(localeKeys.help.optionSub));
     console.log('');
     console.log(i18n.t(localeKeys.help.examples));
@@ -6269,18 +6223,22 @@ function detectTailwindFlag() {
     const args = process.argv.slice(2);
     return !args.includes('--no-tailwind');
 }
+function detectExplicitTailwindFlag() {
+    const args = process.argv.slice(2);
+    if (args.includes('--no-tailwind')) return false;
+    if (args.includes('--tailwind')) return true;
+}
 function detectWorkspaceProtocolFlag() {
     const args = process.argv.slice(2);
     return args.includes('--workspace');
 }
-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 detectVerticalFlag() {
+    const args = process.argv.slice(2);
+    if (args.some((arg)=>arg.startsWith('--vertical='))) {
+        console.error('--vertical does not accept a value. Use: create <name> --vertical');
+        process.exit(1);
+    }
+    return args.includes('--vertical');
 }
 function detectUltramodernWorkspaceFlag(createPackage) {
     const args = process.argv.slice(2);
@@ -6382,8 +6340,7 @@ async function getProjectName() {
         '--ultramodern-package-version',
         '--ultramodern-package-registry',
         '--ultramodern-package-scope',
-        '--ultramodern-package-name-prefix',
-        '--microvertical'
+        '--ultramodern-package-name-prefix'
     ]);
     const optionWithoutValue = new Set([
         '--help',
@@ -6398,6 +6355,7 @@ async function getProjectName() {
         '--tailwind',
         '--no-tailwind',
         '--workspace',
+        '--vertical',
         ULTRAMODERN_WORKSPACE_FLAG
     ]);
     const positionalArgs = [];
@@ -6408,9 +6366,13 @@ 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=') || arg.startsWith('--microvertical='))) 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='))) positionalArgs.push(arg);
         }
     }
+    if (positionalArgs.length > 1) {
+        console.error(`Unexpected positional argument: ${positionalArgs[1]}`);
+        process.exit(1);
+    }
     const projectNameArg = positionalArgs[0];
     if (projectNameArg) return {
         name: projectNameArg,
@@ -6442,22 +6404,20 @@ async function main() {
     const createPackage = readCreatePackageJson();
     const version = createPackage.version || 'latest';
     const ultramodernPackageVersion = isBleedingDevCreatePackage(createPackage) ? getBleedingDevFrameworkVersion(createPackage, version) : version;
-    const microVerticalKind = detectMicroVerticalKind();
-    if (microVerticalKind) {
+    const addVertical = detectVerticalFlag();
+    if (addVertical) {
         const overridePackageSource = args.some((arg)=>arg.startsWith('--ultramodern-package-')) ? detectUltramodernPackageSource(args, ultramodernPackageVersion, createPackage) : void 0;
-        addUltramodernMicroVertical({
+        addUltramodernVertical({
             workspaceRoot: process.cwd(),
             name: generatedPackageName,
-            kind: microVerticalKind,
             modernVersion: version,
-            enableTailwind: detectTailwindFlag(),
+            enableTailwind: detectExplicitTailwindFlag(),
             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`);
+        console.log(`${dim}   pnpm ultramodern:check${reset}\n`);
         return;
     }
     if (node_fs.existsSync(targetDir)) {
@@ -6485,9 +6445,8 @@ 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}   mise exec -- pnpm ultramodern:check${reset}`);
+        console.log(`${dim}   pnpm ultramodern:check${reset}`);
         console.log(`${dim}   ${i18n.t(localeKeys.message.step3)}${reset}\n`);
         return;
     }
@@ -6542,14 +6501,23 @@ async function main() {
             delete packageJson.scripts['lint:fix'];
             delete packageJson.scripts['skills:install'];
             delete packageJson.scripts['skills:check'];
+            delete packageJson.scripts.postinstall;
         }
         if (packageJson.devDependencies) {
             delete packageJson.devDependencies['lint-staged'];
+            delete packageJson.devDependencies.lefthook;
             delete packageJson.devDependencies['simple-git-hooks'];
             delete packageJson.devDependencies.oxlint;
             delete packageJson.devDependencies.oxfmt;
             delete packageJson.devDependencies.ultracite;
         }
+        node_fs.rmSync(node_path.join(targetDir, '.codex'), {
+            recursive: true,
+            force: true
+        });
+        node_fs.rmSync(node_path.join(targetDir, 'lefthook.yml'), {
+            force: true
+        });
     }
     node_fs.writeFileSync(targetPackageJson, `${JSON.stringify(packageJson, null, 2)}\n`);
     writeTemplateManifestEvidence(targetDir, templateManifest);