diff --git a/src/components/CCIP/TutorialBlockchainSelector/AdminSetupStep.tsx b/src/components/CCIP/TutorialBlockchainSelector/AdminSetupStep.tsx
index dffdb335175..79e684fd0f6 100644
--- a/src/components/CCIP/TutorialBlockchainSelector/AdminSetupStep.tsx
+++ b/src/components/CCIP/TutorialBlockchainSelector/AdminSetupStep.tsx
@@ -4,7 +4,6 @@ import { NetworkCheck } from "../TutorialSetup/NetworkCheck"
import { TutorialCard } from "../TutorialSetup/TutorialCard"
import { TutorialStep } from "../TutorialSetup/TutorialStep"
import { NetworkAddress } from "./NetworkAddress"
-import { StoredContractAddress } from "./StoredContractAddress"
import { StepCheckbox } from "../TutorialProgress/StepCheckbox"
import { SolidityParam } from "../TutorialSetup/SolidityParam"
import styles from "./AdminSetupStep.module.css"
diff --git a/src/components/CCIP/TutorialBlockchainSelector/DeployPoolStep.module.css b/src/components/CCIP/TutorialBlockchainSelector/DeployPoolStep.module.css
new file mode 100644
index 00000000000..bf7138b46f6
--- /dev/null
+++ b/src/components/CCIP/TutorialBlockchainSelector/DeployPoolStep.module.css
@@ -0,0 +1,176 @@
+.steps {
+ padding-left: var(--space-4x);
+ margin: 0;
+ display: flex;
+ flex-direction: column;
+ gap: var(--space-4x);
+}
+
+.parametersIntro {
+ margin-bottom: var(--space-3x);
+}
+
+.parameters {
+ background: var(--color-background-secondary);
+ border: 1px solid var(--color-border);
+ border-radius: var(--border-radius);
+ padding: var(--space-4x);
+ display: flex;
+ flex-direction: column;
+ gap: var(--space-3x);
+}
+
+.addressInput {
+ margin-top: var(--space-2x);
+}
+
+/* Pool-specific styles */
+.poolTypes {
+ display: flex;
+ gap: var(--space-2x);
+ margin-bottom: var(--space-3x);
+}
+
+.poolTypes button {
+ padding: var(--space-2x) var(--space-4x);
+ border: 1px solid var(--color-border);
+ border-radius: var(--border-radius);
+ background: var(--color-background);
+ color: var(--color-text);
+ cursor: pointer;
+ transition: all 0.2s ease;
+}
+
+.poolTypes button.active {
+ background: var(--color-accent);
+ color: white;
+ border-color: var(--color-accent);
+}
+
+.poolDescription {
+ color: var(--color-text-secondary);
+ font-size: var(--font-size-sm);
+ margin-bottom: var(--space-3x);
+}
+
+/* Responsive adjustments */
+@media (max-width: 768px) {
+ .poolTypes {
+ flex-direction: column;
+ }
+
+ .poolTypes button {
+ width: 100%;
+ }
+}
+
+.poolSelection {
+ margin-bottom: var(--space-6x);
+}
+
+.selectionHeader {
+ margin-bottom: var(--space-6x);
+}
+
+.selectionTitle {
+ font-size: var(--font-size-xl);
+ font-weight: 600;
+ color: var(--color-text-primary);
+ margin-bottom: var(--space-2x);
+}
+
+.selectionDescription {
+ color: var(--color-text-secondary);
+ font-size: var(--font-size-base);
+ margin-bottom: var(--space-4x);
+}
+
+.poolOptions {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ gap: var(--space-4x);
+}
+
+.poolOption {
+ position: relative;
+ padding: var(--space-4x);
+ border: 2px solid var(--color-border);
+ border-radius: var(--border-radius);
+ background: var(--color-background);
+ text-align: left;
+ cursor: pointer;
+ transition: all 0.2s ease;
+ display: flex;
+ flex-direction: column;
+ gap: var(--space-4x);
+}
+
+.poolOption:hover {
+ border-color: var(--color-accent);
+}
+
+.poolOption.selected {
+ border-color: var(--color-accent);
+ background: var(--color-background-secondary);
+}
+
+.poolTitle {
+ padding-bottom: var(--space-3x);
+ border-bottom: 1px solid var(--color-border);
+}
+
+.poolName {
+ font-size: var(--font-size-lg);
+ font-weight: 600;
+ color: var(--color-text-primary);
+}
+
+.selectedIndicator {
+ position: absolute;
+ top: var(--space-4x);
+ right: var(--space-4x);
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ background: var(--color-accent);
+ border: 2px solid white;
+ box-shadow: 0 0 0 2px var(--color-accent);
+}
+
+.selectedIndicator::after {
+ content: "✓";
+ color: white;
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: var(--font-size-base);
+ font-weight: bold;
+}
+
+.poolContent {
+ display: flex;
+ flex-direction: column;
+ gap: var(--space-3x);
+ padding-top: var(--space-2x);
+}
+
+.poolDescription {
+ color: var(--color-text);
+ font-size: var(--font-size-base);
+ line-height: 1.5;
+}
+
+.poolNote {
+ font-size: var(--font-size-sm);
+ color: var(--color-text-secondary);
+ padding: var(--space-2x);
+ background: var(--color-background);
+ border-radius: var(--border-radius);
+}
+
+@media (max-width: 768px) {
+ .poolOptions {
+ grid-template-columns: 1fr;
+ }
+}
diff --git a/src/components/CCIP/TutorialBlockchainSelector/DeployPoolStep.tsx b/src/components/CCIP/TutorialBlockchainSelector/DeployPoolStep.tsx
new file mode 100644
index 00000000000..68cf8d0866c
--- /dev/null
+++ b/src/components/CCIP/TutorialBlockchainSelector/DeployPoolStep.tsx
@@ -0,0 +1,165 @@
+import { useState } from "react"
+import { useStore } from "@nanostores/react"
+import { laneStore } from "@stores/lanes"
+import { ContractAddress } from "./ContractAddress"
+import { TutorialCard } from "../TutorialSetup/TutorialCard"
+import { TutorialStep } from "../TutorialSetup/TutorialStep"
+import { NetworkCheck } from "../TutorialSetup/NetworkCheck"
+import { SolidityParam } from "../TutorialSetup/SolidityParam"
+import { StoredContractAddress } from "./StoredContractAddress"
+import { NetworkAddress } from "./NetworkAddress"
+import styles from "./DeployPoolStep.module.css"
+
+interface DeployPoolStepProps {
+ chain: "source" | "destination"
+}
+
+export const DeployPoolStep = ({ chain }: DeployPoolStepProps) => {
+ const [poolType, setPoolType] = useState<"lock" | "burn">("lock")
+ const state = useStore(laneStore)
+ const network = chain === "source" ? state.sourceNetwork : state.destinationNetwork
+ const networkInfo = network ? { name: network.name, logo: network.logo } : { name: "loading..." }
+
+ return (
+ Configure your pool by setting these required parameters in Remix:
+
+
+
+
-
-