diff --git a/.github/workflows/ci-deploy.yml b/.github/workflows/ci-deploy.yml
index b5598bab..46d5840a 100644
--- a/.github/workflows/ci-deploy.yml
+++ b/.github/workflows/ci-deploy.yml
@@ -2,9 +2,9 @@ name: CI / Build and Deploy
 
 on:
   push:
-    branches: [ main ]
+    branches: [dev]
   pull_request:
-    branches: [ main ]
+    branches: [dev]
 
 jobs:
   build:
@@ -15,7 +15,7 @@ jobs:
       - name: Use Node.js 24
         uses: actions/setup-node@v6
         with:
-          node-version: '24'
+          node-version: "24"
 
       - name: Install dependencies
         run: |
diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml
index e25ce3a1..c54462f9 100644
--- a/.github/workflows/e2e.yml
+++ b/.github/workflows/e2e.yml
@@ -2,9 +2,9 @@ name: Playwright E2E
 
 on:
   push:
-    branches: [ main ]
+    branches: [dev]
   pull_request:
-    branches: [ main ]
+    branches: [dev]
 
 jobs:
   e2e:
@@ -16,7 +16,7 @@ jobs:
       - name: Use Node.js 24
         uses: actions/setup-node@v6
         with:
-          node-version: '24'
+          node-version: "24"
 
       - name: Install dependencies
         run: npm ci
diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml
index 6fe2301c..8dc30a2a 100644
--- a/.github/workflows/lint.yml
+++ b/.github/workflows/lint.yml
@@ -3,9 +3,9 @@ name: Code Style/Lint
 
 on:
   push:
-    branches: ["main"]
+    branches: ["dev"]
   pull_request:
-    branches: ["main"]
+    branches: ["dev"]
 
 jobs:
   build:
diff --git a/.github/workflows/test-coverage.yml b/.github/workflows/test-coverage.yml
index 343ec145..5c9e3b4c 100644
--- a/.github/workflows/test-coverage.yml
+++ b/.github/workflows/test-coverage.yml
@@ -4,9 +4,9 @@ name: Coverage
 
 on:
   push:
-    branches: ["main", "test"]
+    branches: ["dev", "test"]
   pull_request:
-    branches: ["main", "test"]
+    branches: ["dev", "test"]
 
 jobs:
   build:
@@ -37,4 +37,4 @@ jobs:
           hide_complexity: true
           indicators: true
           output: console
-          thresholds: "80 80"
\ No newline at end of file
+          thresholds: "80 80"
diff --git a/src/app/core/configs/themes.config.ts b/src/app/core/configs/themes.config.ts
index 76bebca5..6eb8e085 100644
--- a/src/app/core/configs/themes.config.ts
+++ b/src/app/core/configs/themes.config.ts
@@ -1,22 +1,22 @@
-export interface WorkflowItem {
+export interface ToolItem {
   id: string;
   label: string;
   href: string;
   disabled?: boolean;
 }
 
-export interface ToolItem {
+export interface WorkflowItem {
   id: string;
   label: string;
   href: string;
   disabled?: boolean;
+  tools: ToolItem[];
 }
 
 export interface ThemeConfig {
   id: string;
   label: string;
   workflows: WorkflowItem[];
-  tools: ToolItem[];
 }
 
 export const THEMES: ThemeConfig[] = [
@@ -28,19 +28,47 @@ export const THEMES: ThemeConfig[] = [
         id: "de-novo-design",
         label: "De Novo Design",
         href: "/binder-design/de-novo-design",
+        tools: [
+          {
+            id: "bindcraft",
+            label: "BindCraft",
+            href: "/binder-design/de-novo-design",
+          },
+          {
+            id: "rfdiffusion",
+            label: "RFdiffusion",
+            href: "/binder-design/de-novo-design",
+            disabled: true,
+          },
+        ],
       },
-    ],
-    tools: [
       {
-        id: "bindcraft",
-        label: "BindCraft",
-        href: "/binder-design/de-novo-design",
+        id: "partial-diffusion",
+        label: "Partial Diffusion",
+        href: "/binder-design/partial-diffusion",
+        disabled: true,
+        tools: [
+          {
+            id: "rfdiffusion",
+            label: "RFdiffusion",
+            href: "/binder-design/partial-diffusion",
+            disabled: true,
+          },
+        ],
       },
       {
-        id: "rfdiffusion",
-        label: "RFdiffusion",
-        href: "/tools/rfdiffusion",
+        id: "motif-scaffolding",
+        label: "Motif Scaffolding",
+        href: "/binder-design/motif-scaffolding",
         disabled: true,
+        tools: [
+          {
+            id: "rfdiffusion",
+            label: "RFdiffusion",
+            href: "/binder-design/motif-scaffolding",
+            disabled: true,
+          },
+        ],
       },
     ],
   },
@@ -52,33 +80,57 @@ export const THEMES: ThemeConfig[] = [
         id: "single-prediction",
         label: "Single Prediction",
         href: "/structure-prediction/single-prediction",
+        tools: [
+          {
+            id: "colabfold",
+            label: "ColabFold",
+            href: "/structure-prediction/single-prediction",
+          },
+          {
+            id: "alphafold2",
+            label: "AlphaFold2",
+            href: "/structure-prediction/single-prediction",
+          },
+          {
+            id: "boltz",
+            label: "Boltz",
+            href: "/structure-prediction/single-prediction",
+          },
+        ],
       },
       {
         id: "bulk-prediction",
         label: "Bulk Prediction",
         href: "/structure-prediction/bulk-prediction",
+        tools: [
+          {
+            id: "boltz",
+            label: "Boltz",
+            href: "/structure-prediction/bulk-prediction",
+          },
+          {
+            id: "colabfold",
+            label: "ColabFold",
+            href: "/structure-prediction/bulk-prediction",
+          },
+        ],
       },
       {
         id: "interaction-screening",
         label: "Interaction Screening",
         href: "/structure-prediction/interaction-screening",
-      },
-    ],
-    tools: [
-      {
-        id: "boltz",
-        label: "Boltz",
-        href: "/structure-prediction/single-prediction",
-      },
-      {
-        id: "colabfold",
-        label: "ColabFold",
-        href: "/structure-prediction/single-prediction",
-      },
-      {
-        id: "alphafold2",
-        label: "AlphaFold2",
-        href: "/structure-prediction/single-prediction",
+        tools: [
+          {
+            id: "boltz",
+            label: "Boltz",
+            href: "/structure-prediction/interaction-screening",
+          },
+          {
+            id: "colabfold",
+            label: "ColabFold",
+            href: "/structure-prediction/interaction-screening",
+          },
+        ],
       },
     ],
   },
diff --git a/src/app/features/jobs/jobs-list/jobs-list.spec.ts b/src/app/features/jobs/jobs-list/jobs-list.spec.ts
index aff45d8e..fea8c502 100644
--- a/src/app/features/jobs/jobs-list/jobs-list.spec.ts
+++ b/src/app/features/jobs/jobs-list/jobs-list.spec.ts
@@ -182,7 +182,7 @@ describe("JobsListComponent", () => {
 
   it("should load jobs on init", () => {
     expect(mockJobsService.listJobs).toHaveBeenCalledWith({
-      limit: 50,
+      limit: 10,
       offset: 0,
     });
     expect(component.jobs()).toEqual([mockJob]);
@@ -280,8 +280,8 @@ describe("JobsListComponent", () => {
     component.loadJobs();
 
     expect(mockJobsService.listJobs).toHaveBeenCalledWith({
-      limit: 50,
-      offset: 50,
+      limit: 10,
+      offset: 10,
       search: "binder",
       status: ["Completed", "Failed"],
     });
diff --git a/src/app/features/jobs/jobs-list/jobs-list.ts b/src/app/features/jobs/jobs-list/jobs-list.ts
index e85a2e2d..063d45ec 100644
--- a/src/app/features/jobs/jobs-list/jobs-list.ts
+++ b/src/app/features/jobs/jobs-list/jobs-list.ts
@@ -94,7 +94,7 @@ export default class JobsListComponent implements OnInit, OnDestroy {
   searchQuery = signal<string>("");
   selectedStatuses = signal<string[]>([]);
   currentPage = signal<number>(1);
-  pageSize = signal<number>(50);
+  pageSize = signal<number>(10);
   scoreSortDirection = signal<"asc" | "desc">("desc");
   submittedSortDirection = signal<"asc" | "desc">("desc");
   activeSort = signal<"score" | "submitted">("submitted");
diff --git a/src/app/features/themes/binder-design/binder-design.html b/src/app/features/themes/binder-design/binder-design.html
index c7f2233c..4adda111 100644
--- a/src/app/features/themes/binder-design/binder-design.html
+++ b/src/app/features/themes/binder-design/binder-design.html
@@ -1,8 +1,4 @@
-<app-theme-layout
-  title="Protein Binder Design"
-  [workflows]="workflows()"
-  [tools]="tools()"
->
+<app-theme-layout title="Protein Binder Design" [workflows]="workflows()">
   <p description class="text-gray-500">
     Synthetic protein binders are emerging as powerful tools in therapeutics,
     diagnostics, and fundamental research, offering a highly tunable alternative
diff --git a/src/app/features/themes/binder-design/binder-design.spec.ts b/src/app/features/themes/binder-design/binder-design.spec.ts
index 7dd58305..0b856174 100644
--- a/src/app/features/themes/binder-design/binder-design.spec.ts
+++ b/src/app/features/themes/binder-design/binder-design.spec.ts
@@ -27,7 +27,7 @@ describe("BinderDesignComponent", () => {
   describe("workflows", () => {
     it("should have correct workflow structure", () => {
       expect(component.workflows()).toBeDefined();
-      expect(component.workflows().length).toBe(1);
+      expect(component.workflows().length).toBe(3);
     });
 
     it("workflows should contain de novo design workflow", () => {
@@ -39,6 +39,22 @@ describe("BinderDesignComponent", () => {
       expect(deNovoWorkflow?.href).toBe("/binder-design/de-novo-design");
     });
 
+    it("should contain disabled partial diffusion and motif scaffolding workflows", () => {
+      const partial = component
+        .workflows()
+        .find((w) => w.id === "partial-diffusion");
+      expect(partial?.label).toBe("Partial Diffusion");
+      expect(partial?.disabled).toBeTrue();
+      expect(partial?.tools.map((t) => t.id)).toEqual(["rfdiffusion"]);
+
+      const motif = component
+        .workflows()
+        .find((w) => w.id === "motif-scaffolding");
+      expect(motif?.label).toBe("Motif Scaffolding");
+      expect(motif?.disabled).toBeTrue();
+      expect(motif?.tools.map((t) => t.id)).toEqual(["rfdiffusion"]);
+    });
+
     it("should have all workflows with required properties", () => {
       component.workflows().forEach((workflow) => {
         expect(workflow.id).toBeDefined();
@@ -52,32 +68,32 @@ describe("BinderDesignComponent", () => {
   });
 
   describe("tools", () => {
-    it("tools should have correct tools structure", () => {
-      expect(component.tools()).toBeDefined();
-      expect(component.tools().length).toBe(2);
+    const deNovoTools = () =>
+      component.workflows().find((w) => w.id === "de-novo-design")?.tools ?? [];
+
+    it("de novo design workflow should have correct tools structure", () => {
+      expect(deNovoTools().length).toBe(2);
     });
 
     it("tools should contain BindCraft tool", () => {
-      const bindCraftTool = component
-        .tools()
-        .find((t) => t.label === "BindCraft");
+      const bindCraftTool = deNovoTools().find((t) => t.label === "BindCraft");
       expect(bindCraftTool).toBeDefined();
       expect(bindCraftTool?.id).toBe("bindcraft");
       expect(bindCraftTool?.href).toBe("/binder-design/de-novo-design");
     });
 
     it("tools should contain RFdiffusion tool", () => {
-      const rfdiffusionTool = component
-        .tools()
-        .find((t) => t.label === "RFdiffusion");
+      const rfdiffusionTool = deNovoTools().find(
+        (t) => t.label === "RFdiffusion"
+      );
       expect(rfdiffusionTool).toBeDefined();
       expect(rfdiffusionTool?.id).toBe("rfdiffusion");
-      expect(rfdiffusionTool?.href).toBe("/tools/rfdiffusion");
+      expect(rfdiffusionTool?.href).toBe("/binder-design/de-novo-design");
       expect(rfdiffusionTool?.disabled).toBeTrue();
     });
 
     it("should have all tools with required properties", () => {
-      component.tools().forEach((tool) => {
+      deNovoTools().forEach((tool) => {
         expect(tool.id).toBeDefined();
         expect(tool.id).not.toBe("");
         expect(tool.label).toBeDefined();
@@ -86,7 +102,7 @@ describe("BinderDesignComponent", () => {
     });
 
     it("should have unique tool IDs", () => {
-      const ids = component.tools().map((tool) => tool.id);
+      const ids = deNovoTools().map((tool) => tool.id);
       const uniqueIds = [...new Set(ids)];
       expect(ids.length).toBe(uniqueIds.length);
     });
@@ -153,11 +169,11 @@ describe("BinderDesignComponent", () => {
       component.workflows().forEach((workflow) => {
         expect(typeof workflow.id).toBe("string");
         expect(typeof workflow.label).toBe("string");
-      });
 
-      component.tools().forEach((tool) => {
-        expect(typeof tool.id).toBe("string");
-        expect(typeof tool.label).toBe("string");
+        workflow.tools.forEach((tool) => {
+          expect(typeof tool.id).toBe("string");
+          expect(typeof tool.label).toBe("string");
+        });
       });
 
       component.communityResources().forEach((resource) => {
@@ -168,33 +184,26 @@ describe("BinderDesignComponent", () => {
 
     it("should have proper data types", () => {
       expect(Array.isArray(component.workflows())).toBe(true);
-      expect(Array.isArray(component.tools())).toBe(true);
       expect(Array.isArray(component.communityResources())).toBe(true);
     });
   });
 
   describe("link rendering", () => {
-    it("should render enabled workflows and tools as routerLink anchors", () => {
-      const linkTexts = fixture.debugElement
+    it("should render an enabled card linking to the workflow", () => {
+      const hrefs = fixture.debugElement
         .queryAll(By.directive(RouterLink))
-        .map((link) => link.nativeElement.textContent.trim());
+        .map((link) => link.nativeElement.getAttribute("href"));
 
-      expect(linkTexts).toContain("De Novo Design");
-      expect(linkTexts).toContain("BindCraft");
+      expect(hrefs).toContain("/binder-design/de-novo-design");
     });
 
-    it("should render disabled workflows and tools as non-clickable spans", () => {
-      const disabledText = fixture.debugElement
-        .queryAll(By.css("span.cursor-not-allowed"))
+    it("should render workflow tools as badges", () => {
+      const badgeTexts = fixture.debugElement
+        .queryAll(By.css("li span"))
         .map((el) => el.nativeElement.textContent.trim());
-      const linkTexts = fixture.debugElement
-        .queryAll(By.directive(RouterLink))
-        .map((link) => link.nativeElement.textContent.trim());
 
-      ["RFdiffusion"].forEach((label) => {
-        expect(disabledText).toContain(label);
-        expect(linkTexts).not.toContain(label);
-      });
+      expect(badgeTexts).toContain("BindCraft");
+      expect(badgeTexts).toContain("RFdiffusion");
     });
   });
 });
diff --git a/src/app/features/themes/binder-design/binder-design.ts b/src/app/features/themes/binder-design/binder-design.ts
index 0b883834..31696f16 100644
--- a/src/app/features/themes/binder-design/binder-design.ts
+++ b/src/app/features/themes/binder-design/binder-design.ts
@@ -11,7 +11,6 @@ import { THEMES } from "../../../core/configs/themes.config";
 export class BinderDesignComponent {
   private readonly theme = THEMES.find((t) => t.id === "binder-design")!;
   workflows = signal(this.theme.workflows);
-  tools = signal(this.theme.tools);
 
   communityResources = signal([
     {
diff --git a/src/app/features/themes/layout/theme-layout/theme-layout.component.html b/src/app/features/themes/layout/theme-layout/theme-layout.component.html
index 38b1037f..e559d088 100644
--- a/src/app/features/themes/layout/theme-layout/theme-layout.component.html
+++ b/src/app/features/themes/layout/theme-layout/theme-layout.component.html
@@ -1,38 +1,65 @@
 <div
-  class="bg-gray-100 bg-[url('/assets/binder-design.png')] bg-no-repeat bg-size-[100%_auto] bg-top bg-fixed"
+  class="bg-gray-100 bg-[url('/assets/themes-bg.png')] bg-no-repeat bg-size-[100%_auto] bg-top bg-fixed"
 >
   <div class="max-w-7xl px-6 mx-auto py-12">
     <div class="bg-white rounded-lg shadow-sm border p-12 space-y-12">
       <!-- Title + projected intro copy -->
       <div class="space-y-6">
-        <h1 class="text-4xl font-semibold text-gray-900">{{ title() }}</h1>
+        <h1 class="text-4xl font-semibold">{{ title() }}</h1>
         <ng-content select="[description]"></ng-content>
       </div>
 
-      <!-- Workflows / Tools -->
-      @for (section of sections(); track section.heading) {
+      <!-- Workflows -->
       <div class="space-y-6">
-        <h2 class="text-2xl font-semibold text-gray-900">
-          {{ section.heading }}
-        </h2>
-        <div class="flex flex-wrap gap-4">
-          @for (item of section.items; track item.id) { @if (item.disabled) {
-          <span
-            class="inline-flex items-center px-6 py-3 text-sm font-medium border rounded-full shadow bg-white text-biocommons-primary opacity-50 cursor-not-allowed"
-          >
-            {{ item.label }}
-          </span>
-          } @else {
+        <h2 class="text-2xl font-semibold">Workflows</h2>
+        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+          @for (workflow of workflows(); track workflow.id) {
           <a
-            [routerLink]="item.href"
-            class="inline-flex items-center px-6 py-3 text-sm font-medium border rounded-full shadow hover:shadow-md hover:-translate-y-0.5 bg-white text-biocommons-primary hover:text-sky-700 transition-all no-underline"
+            [routerLink]="workflow.disabled ? null : workflow.href"
+            class="group rounded-xl border shadow-sm p-6 flex flex-col gap-4 no-underline text-inherit"
+            [class]="
+              workflow.disabled
+                ? 'bg-gray-100 opacity-50 cursor-not-allowed'
+                : 'bg-white hover:shadow-md hover:-translate-y-0.5 transition-all'
+            "
           >
-            {{ item.label }}
+            <h3 class="text-lg font-semibold">{{ workflow.label }}</h3>
+
+            @if (workflow.tools.length) {
+            <div class="space-y-2">
+              <p class="text-xs uppercase font-semibold text-gray-500">Tools</p>
+              <ul class="flex flex-wrap gap-2 list-none">
+                @for (tool of workflow.tools; track tool.id) {
+                <li>
+                  <span
+                    class="inline-flex items-center px-3 py-1 text-xs font-mono font-semibold border rounded-full"
+                    [class]="
+                      tool.disabled
+                        ? 'bg-gray-100 text-gray-400 border-gray-400'
+                        : 'text-gray-900 border-gray-900'
+                    "
+                    [attr.aria-label]="
+                      tool.disabled ? tool.label + ' (coming soon)' : null
+                    "
+                  >
+                    {{ tool.label }}
+                  </span>
+                </li>
+                }
+              </ul>
+            </div>
+            }
+
+            <div
+              class="flex justify-start items-center gap-1 text-sm font-semibold text-biocommons-primary transition-colors group-hover:text-sky-700"
+            >
+              Launch workflow
+              <ng-icon name="heroChevronRight" size="16" />
+            </div>
           </a>
-          } }
+          }
         </div>
       </div>
-      }
 
       <!-- Theme-specific extras (e.g. community resources) -->
       <ng-content></ng-content>
diff --git a/src/app/features/themes/layout/theme-layout/theme-layout.component.ts b/src/app/features/themes/layout/theme-layout/theme-layout.component.ts
index bbc14652..605fbb1e 100644
--- a/src/app/features/themes/layout/theme-layout/theme-layout.component.ts
+++ b/src/app/features/themes/layout/theme-layout/theme-layout.component.ts
@@ -1,15 +1,13 @@
-import { Component, computed, input } from "@angular/core";
+import { Component, input } from "@angular/core";
 import { RouterLink } from "@angular/router";
-import { ToolItem, WorkflowItem } from "../../../../core/configs/themes.config";
-
-interface ThemeSection {
-  heading: string;
-  items: (WorkflowItem | ToolItem)[];
-}
+import { NgIconComponent, provideIcons } from "@ng-icons/core";
+import { heroChevronRight } from "@ng-icons/heroicons/outline";
+import { WorkflowItem } from "../../../../core/configs/themes.config";
 
 @Component({
   selector: "app-theme-layout",
-  imports: [RouterLink],
+  imports: [RouterLink, NgIconComponent],
+  providers: [provideIcons({ heroChevronRight })],
   templateUrl: "./theme-layout.component.html",
   styleUrl: "./theme-layout.component.scss",
   host: { class: "block w-full" },
@@ -17,10 +15,4 @@ interface ThemeSection {
 export class ThemeLayoutComponent {
   readonly title = input.required<string>();
   readonly workflows = input.required<WorkflowItem[]>();
-  readonly tools = input.required<ToolItem[]>();
-
-  protected readonly sections = computed<ThemeSection[]>(() => [
-    { heading: "Workflows", items: this.workflows() },
-    { heading: "Tools", items: this.tools() },
-  ]);
 }
diff --git a/src/app/features/themes/structure-prediction/structure-prediction.html b/src/app/features/themes/structure-prediction/structure-prediction.html
index 5b56e181..bbdf7915 100644
--- a/src/app/features/themes/structure-prediction/structure-prediction.html
+++ b/src/app/features/themes/structure-prediction/structure-prediction.html
@@ -1,8 +1,4 @@
-<app-theme-layout
-  title="Structure Prediction"
-  [workflows]="workflows"
-  [tools]="tools"
->
+<app-theme-layout title="Structure Prediction" [workflows]="workflows">
   <p description class="text-gray-500">
     AlphaFold2 brought about a revolution in structural biology by enabling high
     quality predictions of protein structure using evolutionary information
diff --git a/src/app/features/themes/structure-prediction/structure-prediction.spec.ts b/src/app/features/themes/structure-prediction/structure-prediction.spec.ts
index b6b00671..e2b81b89 100644
--- a/src/app/features/themes/structure-prediction/structure-prediction.spec.ts
+++ b/src/app/features/themes/structure-prediction/structure-prediction.spec.ts
@@ -24,54 +24,45 @@ describe("StructurePredictionComponent", () => {
 
   it("should define workflows", () => {
     expect(component.workflows.length).toBe(3);
-    expect(component.workflows[0]).toEqual({
-      id: "single-prediction",
-      label: "Single Prediction",
-      href: "/structure-prediction/single-prediction",
-    });
-    expect(component.workflows[1]).toEqual({
-      id: "bulk-prediction",
-      label: "Bulk Prediction",
-      href: "/structure-prediction/bulk-prediction",
-    });
-    expect(component.workflows[2]).toEqual({
-      id: "interaction-screening",
-      label: "Interaction Screening",
-      href: "/structure-prediction/interaction-screening",
-    });
+    expect(component.workflows.map((w) => w.id)).toEqual([
+      "single-prediction",
+      "bulk-prediction",
+      "interaction-screening",
+    ]);
   });
 
-  it("should define tools", () => {
-    expect(component.tools.length).toBe(3);
-    expect(component.tools[0]).toEqual({
-      id: "boltz",
-      label: "Boltz",
-      href: "/structure-prediction/single-prediction",
-    });
-    expect(component.tools[1]).toEqual({
-      id: "colabfold",
-      label: "ColabFold",
-      href: "/structure-prediction/single-prediction",
-    });
-    expect(component.tools[2]).toEqual({
-      id: "alphafold2",
-      label: "AlphaFold2",
-      href: "/structure-prediction/single-prediction",
-    });
+  it("should map tools onto each workflow", () => {
+    const toolIds = (id: string) =>
+      component.workflows.find((w) => w.id === id)?.tools.map((t) => t.id);
+
+    expect(toolIds("single-prediction")).toEqual([
+      "colabfold",
+      "alphafold2",
+      "boltz",
+    ]);
+    expect(toolIds("bulk-prediction")).toEqual(["boltz", "colabfold"]);
+    expect(toolIds("interaction-screening")).toEqual(["boltz", "colabfold"]);
   });
 
-  it("should render enabled workflows and tools as routerLink anchors", () => {
-    const linkTexts = fixture.debugElement
+  it("should render an enabled card linking to each workflow", () => {
+    const hrefs = fixture.debugElement
       .queryAll(By.directive(RouterLink))
-      .map((link) => link.nativeElement.textContent.trim());
+      .map((link) => link.nativeElement.getAttribute("href"));
 
     [
-      "Single Prediction",
-      "Bulk Prediction",
-      "Interaction Screening",
-      "Boltz",
-      "ColabFold",
-      "AlphaFold2",
-    ].forEach((label) => expect(linkTexts).toContain(label));
+      "/structure-prediction/single-prediction",
+      "/structure-prediction/bulk-prediction",
+      "/structure-prediction/interaction-screening",
+    ].forEach((href) => expect(hrefs).toContain(href));
+  });
+
+  it("should render workflow tools as badges", () => {
+    const badgeTexts = fixture.debugElement
+      .queryAll(By.css("li span"))
+      .map((el) => el.nativeElement.textContent.trim());
+
+    ["Boltz", "ColabFold", "AlphaFold2"].forEach((label) =>
+      expect(badgeTexts).toContain(label)
+    );
   });
 });
diff --git a/src/app/features/themes/structure-prediction/structure-prediction.ts b/src/app/features/themes/structure-prediction/structure-prediction.ts
index d0fe5a4e..2cabb98d 100644
--- a/src/app/features/themes/structure-prediction/structure-prediction.ts
+++ b/src/app/features/themes/structure-prediction/structure-prediction.ts
@@ -11,5 +11,4 @@ import { THEMES } from "../../../core/configs/themes.config";
 export class StructurePredictionComponent {
   private readonly theme = THEMES.find((t) => t.id === "structure-prediction")!;
   workflows = this.theme.workflows;
-  tools = this.theme.tools;
 }
diff --git a/src/app/features/workflows/bulk-prediction/bulk-prediction.html b/src/app/features/workflows/bulk-prediction/bulk-prediction.html
index 4ddfb0e4..4b27375e 100644
--- a/src/app/features/workflows/bulk-prediction/bulk-prediction.html
+++ b/src/app/features/workflows/bulk-prediction/bulk-prediction.html
@@ -173,6 +173,7 @@ <h3 class="text-sm font-medium text-sky-800">
   <app-workflow-preview-modal
     [isOpen]="showPreview()"
     [credits]="creditsEnabled ? creditCost() : null"
+    [creditsRemaining]="creditsRemaining()"
     [isSubmitting]="workflowSubmission.isSubmitting()"
     workflowName="Bulk Prediction"
     [selectedTool]="selectedToolLabel()"
diff --git a/src/app/features/workflows/components/configuration-summary/configuration-summary.component.html b/src/app/features/workflows/components/configuration-summary/configuration-summary.component.html
deleted file mode 100644
index e6665bbb..00000000
--- a/src/app/features/workflows/components/configuration-summary/configuration-summary.component.html
+++ /dev/null
@@ -1,97 +0,0 @@
-<div class="space-y-4">
-  <!-- Configuration Summary -->
-  <div class="bg-gray-50 border rounded-lg p-4 space-y-4 text-sm">
-    <!-- Workflow & Tool -->
-    <div class="space-y-4">
-      <div class="grid gap-4 grid-cols-2 lg:grid-cols-3">
-        <div class="space-y-1">
-          <p class="font-medium">Workflow</p>
-          <p class="text-gray-600 wrap-break-word">
-            {{ workflowName() || "—" }}
-          </p>
-        </div>
-        <div class="space-y-1">
-          <p class="font-medium">Tool</p>
-          <div class="flex flex-wrap items-center gap-2">
-            <p class="text-gray-600 wrap-break-word">
-              {{ selectedTool() || "—" }}
-            </p>
-            @if (hasParameters()) {
-            <span
-              class="inline-block shrink-0 text-xs bg-sky-200 text-biocommons-primary px-2 py-1 rounded-full"
-            >
-              Has Parameters
-            </span>
-            } @else {
-            <span
-              class="inline-block shrink-0 text-xs bg-gray-200 px-2 py-1 rounded-full"
-            >
-              No Parameters
-            </span>
-            }
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <hr class="border-t border-gray-200" />
-
-    <!-- Input Configuration -->
-    <div class="space-y-4">
-      <div class="font-semibold">Input Configuration</div>
-      <div class="grid gap-4 grid-cols-2 lg:grid-cols-3">
-        @for (item of inputItems(); track item.fieldName) {
-        <div class="space-y-1">
-          <p class="font-medium">{{ item.label }}</p>
-          @if (item.url && item.value) {
-          <a
-            [href]="item.url"
-            target="_blank"
-            rel="noopener noreferrer"
-            download
-            class="text-sky-700 underline wrap-break-word hover:text-biocommons-primary"
-          >
-            {{ item.value }}
-          </a>
-          } @else {
-          <p class="text-gray-600 wrap-break-word">{{ item.value || "—" }}</p>
-          }
-        </div>
-        }
-      </div>
-      @if (inputEntities().length > 0) {
-      <div class="space-y-1">
-        <p class="font-medium">Entities</p>
-        <ul class="space-y-1">
-          @for (entity of inputEntities(); track $index) {
-          <li class="text-gray-600 wrap-break-word">
-            {{ entity.type }} — {{ entity.name }} @if (entity.sequence) { —
-            <span class="font-mono">{{ entity.sequence }}</span>
-            }
-          </li>
-          }
-        </ul>
-      </div>
-      }
-    </div>
-
-    <hr class="border-t border-gray-200" />
-
-    <!-- Tool Settings -->
-    <div class="space-y-4">
-      <div class="font-semibold">Tool Settings</div>
-      @if (toolSettingItems().length > 0) {
-      <div class="grid gap-4 grid-cols-2 lg:grid-cols-3">
-        @for (item of toolSettingItems(); track item.fieldName) {
-        <div class="space-y-1">
-          <p class="font-medium">{{ item.label }}</p>
-          <p class="text-gray-600 wrap-break-word">{{ item.value || "—" }}</p>
-        </div>
-        }
-      </div>
-      } @else {
-      <p class="text-gray-600">No tool settings</p>
-      }
-    </div>
-  </div>
-</div>
diff --git a/src/app/features/workflows/components/configuration-summary/configuration-summary.component.spec.ts b/src/app/features/workflows/components/configuration-summary/configuration-summary.component.spec.ts
deleted file mode 100644
index 96e66fa9..00000000
--- a/src/app/features/workflows/components/configuration-summary/configuration-summary.component.spec.ts
+++ /dev/null
@@ -1,84 +0,0 @@
-import { ComponentFixture, TestBed } from "@angular/core/testing";
-import {
-  ConfigurationSummaryComponent,
-  SummaryItem,
-} from "./configuration-summary.component";
-
-describe("ConfigurationSummaryComponent", () => {
-  let component: ConfigurationSummaryComponent;
-  let fixture: ComponentFixture<ConfigurationSummaryComponent>;
-
-  const mockInputItems: SummaryItem[] = [
-    { label: "Tool Name", value: "Test Tool", fieldName: "toolName" },
-    { label: "Input File", value: "test.txt", fieldName: "inputFile" },
-  ];
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [ConfigurationSummaryComponent],
-    }).compileComponents();
-
-    fixture = TestBed.createComponent(ConfigurationSummaryComponent);
-    component = fixture.componentInstance;
-
-    // Set required inputs
-    fixture.componentRef.setInput("workflowName", "Test Workflow");
-    fixture.componentRef.setInput("selectedTool", "Test Tool");
-    fixture.componentRef.setInput("inputItems", mockInputItems);
-  });
-
-  it("should create", () => {
-    expect(component).toBeTruthy();
-  });
-
-  it("should display selected tool", () => {
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.textContent).toContain("Test Tool");
-  });
-
-  it("should display summary items", () => {
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.textContent).toContain("Tool Name");
-    expect(compiled.textContent).toContain("test.txt");
-  });
-
-  it("should not render a validation status (form is validated before preview)", () => {
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.textContent).not.toContain("Configuration Valid");
-    expect(compiled.textContent).not.toContain("Configuration Incomplete");
-  });
-
-  it("should display parameter status correctly", () => {
-    fixture.componentRef.setInput("hasParameters", true);
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.textContent).toContain("Has Parameters");
-
-    fixture.componentRef.setInput("hasParameters", false);
-    fixture.detectChanges();
-    expect(compiled.textContent).toContain("No Parameters");
-  });
-
-  it("should not render a 'Not provided' fallback for empty values", () => {
-    fixture.componentRef.setInput("inputItems", [
-      { label: "Optional Field", value: "", fieldName: "optional" },
-    ]);
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.textContent).not.toContain("Not provided");
-    expect(compiled.textContent).toContain("Optional Field");
-  });
-
-  it("should display workflow name and tool settings", () => {
-    fixture.componentRef.setInput("toolSettingItems", [
-      { label: "num_recycles", value: "3", fieldName: "num_recycles" },
-    ]);
-    fixture.detectChanges();
-    const compiled = fixture.nativeElement as HTMLElement;
-    expect(compiled.textContent).toContain("Test Workflow");
-    expect(compiled.textContent).toContain("num_recycles");
-  });
-});
diff --git a/src/app/features/workflows/components/configuration-summary/configuration-summary.component.ts b/src/app/features/workflows/components/configuration-summary/configuration-summary.component.ts
deleted file mode 100644
index ed12b044..00000000
--- a/src/app/features/workflows/components/configuration-summary/configuration-summary.component.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import { Component, input } from "@angular/core";
-
-export interface SummaryItem {
-  label: string;
-  value: string;
-  fieldName: string;
-  url?: string;
-}
-
-export interface EntitySummaryItem {
-  type: string;
-  name: string;
-  sequence: string;
-}
-
-@Component({
-  selector: "app-configuration-summary",
-  imports: [],
-  templateUrl: "./configuration-summary.component.html",
-  host: { class: "block" },
-})
-export class ConfigurationSummaryComponent {
-  readonly workflowName = input("");
-  readonly selectedTool = input.required<string>();
-  readonly hasParameters = input(false);
-  readonly inputItems = input.required<SummaryItem[]>();
-  readonly inputEntities = input<EntitySummaryItem[]>([]);
-  readonly toolSettingItems = input<SummaryItem[]>([]);
-}
diff --git a/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.html b/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.html
index 4a7292c5..0565d43c 100644
--- a/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.html
+++ b/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.html
@@ -21,14 +21,113 @@ <h2 id="workflow-preview-title" class="text-lg font-semibold text-gray-900">
   </div>
 
   <div modalBody class="max-h-[70vh] overflow-y-auto p-4">
-    <app-configuration-summary
-      [workflowName]="workflowName()"
-      [selectedTool]="selectedTool()"
-      [hasParameters]="hasParameters()"
-      [inputItems]="inputItems()"
-      [inputEntities]="inputEntities()"
-      [toolSettingItems]="toolSettingItems()"
-    ></app-configuration-summary>
+    <div class="space-y-4">
+      <div class="bg-gray-50 border rounded-lg p-4 space-y-4 text-sm">
+        <!-- Workflow & Tool -->
+        <div class="space-y-4">
+          <div class="grid gap-4 grid-cols-2 lg:grid-cols-3">
+            <div class="space-y-1">
+              <p class="font-medium">Workflow</p>
+              <p class="text-gray-600 wrap-break-word">
+                {{ workflowName() || "—" }}
+              </p>
+            </div>
+            <div class="space-y-1">
+              <p class="font-medium">Tool</p>
+              <div class="flex flex-wrap items-center gap-2">
+                <p class="text-gray-600 wrap-break-word">
+                  {{ selectedTool() || "—" }}
+                </p>
+                @if (hasParameters()) {
+                <span
+                  class="inline-block shrink-0 text-xs bg-sky-200 text-biocommons-primary px-2 py-1 rounded-full"
+                >
+                  Has Parameters
+                </span>
+                } @else {
+                <span
+                  class="inline-block shrink-0 text-xs bg-gray-200 px-2 py-1 rounded-full"
+                >
+                  No Parameters
+                </span>
+                }
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <hr class="border-t border-gray-200" />
+
+        <!-- Input Configuration -->
+        <div class="space-y-4">
+          <div class="font-semibold">Input Configuration</div>
+          <div class="grid gap-4 grid-cols-2 lg:grid-cols-3">
+            @for (item of inputItems(); track item.fieldName) {
+            <div class="space-y-1">
+              <p class="font-medium">{{ item.label }}</p>
+              @if (item.url && item.value) {
+              <a
+                [href]="item.url"
+                target="_blank"
+                rel="noopener noreferrer"
+                download
+                class="text-sky-700 underline wrap-break-word hover:text-biocommons-primary"
+              >
+                {{ item.value }}
+              </a>
+              } @else {
+              <p class="text-gray-600 wrap-break-word">
+                {{ item.value || "—" }}
+              </p>
+              }
+            </div>
+            }
+          </div>
+          @if (inputEntities().length > 0) {
+          <div class="space-y-1">
+            <p class="font-medium">Entities</p>
+            <ul class="space-y-1">
+              @for (entity of inputEntities(); track $index) {
+              <li class="text-gray-600 wrap-break-word">
+                {{ entity.type }} — {{ entity.name }} @if (entity.sequence) { —
+                <span class="font-mono">{{ entity.sequence }}</span>
+                }
+              </li>
+              }
+            </ul>
+          </div>
+          }
+        </div>
+
+        @if (credits() !== null) {
+        <app-credit-summary
+          [total]="credits()"
+          [remaining]="creditsRemaining()"
+        ></app-credit-summary>
+        }
+
+        <hr class="border-t border-gray-200" />
+
+        <!-- Tool Settings -->
+        <div class="space-y-4">
+          <div class="font-semibold">Tool Settings</div>
+          @if (toolSettingItems().length > 0) {
+          <div class="grid gap-4 grid-cols-2 lg:grid-cols-3">
+            @for (item of toolSettingItems(); track item.fieldName) {
+            <div class="space-y-1">
+              <p class="font-medium">{{ item.label }}</p>
+              <p class="text-gray-600 wrap-break-word">
+                {{ item.value || "—" }}
+              </p>
+            </div>
+            }
+          </div>
+          } @else {
+          <p class="text-gray-600">No tool settings</p>
+          }
+        </div>
+      </div>
+    </div>
   </div>
 
   <div modalActions class="flex justify-end gap-4 p-4 pt-0 text-sm">
diff --git a/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.spec.ts b/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.spec.ts
index 98f92592..c52d1f1e 100644
--- a/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.spec.ts
+++ b/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.spec.ts
@@ -73,4 +73,23 @@ describe("WorkflowPreviewModalComponent", () => {
     expect(text).toContain("BindCraft");
     expect(text).toContain("my-job");
   });
+
+  it("should render the credit summary when credits are known", () => {
+    fixture.componentRef.setInput("isOpen", true);
+    fixture.componentRef.setInput("credits", 3);
+    fixture.componentRef.setInput("creditsRemaining", 10);
+    fixture.detectChanges();
+
+    expect(fixture.nativeElement.textContent).toContain("Total: 3 Credits");
+  });
+
+  it("should omit the credit summary when credits are unknown", () => {
+    fixture.componentRef.setInput("isOpen", true);
+    fixture.componentRef.setInput("credits", null);
+    fixture.detectChanges();
+
+    expect(
+      fixture.nativeElement.querySelector("app-credit-summary")
+    ).toBeNull();
+  });
 });
diff --git a/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.ts b/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.ts
index 3c5be63e..3f2b135f 100644
--- a/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.ts
+++ b/src/app/features/workflows/components/workflow-preview-modal/workflow-preview-modal.component.ts
@@ -4,11 +4,20 @@ import { heroXMark } from "@ng-icons/heroicons/outline";
 
 import { ButtonComponent } from "../../../../components/button/button.component";
 import { ModalComponent } from "../../../../components/modal/modal.component";
-import {
-  ConfigurationSummaryComponent,
-  EntitySummaryItem,
-  SummaryItem,
-} from "../configuration-summary/configuration-summary.component";
+import { CreditSummaryComponent } from "../credit-summary/credit-summary.component";
+
+export interface SummaryItem {
+  label: string;
+  value: string;
+  fieldName: string;
+  url?: string;
+}
+
+export interface EntitySummaryItem {
+  type: string;
+  name: string;
+  sequence: string;
+}
 
 @Component({
   selector: "app-workflow-preview-modal",
@@ -16,7 +25,7 @@ import {
     ModalComponent,
     ButtonComponent,
     NgIconComponent,
-    ConfigurationSummaryComponent,
+    CreditSummaryComponent,
   ],
   providers: [provideIcons({ heroXMark })],
   templateUrl: "./workflow-preview-modal.component.html",
@@ -26,6 +35,7 @@ export class WorkflowPreviewModalComponent {
   readonly isOpen = input(false);
   readonly title = input("Review & Submit");
   readonly credits = input<number | null>(null);
+  readonly creditsRemaining = input<number | null>(null);
   readonly isSubmitting = input(false);
 
   readonly workflowName = input("");
diff --git a/src/app/features/workflows/de-novo-design/de-novo-design.html b/src/app/features/workflows/de-novo-design/de-novo-design.html
index 6b47f67c..83450486 100644
--- a/src/app/features/workflows/de-novo-design/de-novo-design.html
+++ b/src/app/features/workflows/de-novo-design/de-novo-design.html
@@ -378,6 +378,7 @@ <h3 class="text-sm font-medium text-sky-800">
   <app-workflow-preview-modal
     [isOpen]="showPreview()"
     [credits]="creditsEnabled ? creditCost() : null"
+    [creditsRemaining]="creditsRemaining()"
     [isSubmitting]="workflowSubmission.isSubmitting()"
     workflowName="De Novo Design"
     [selectedTool]="selectedToolLabel()"
diff --git a/src/app/features/workflows/interaction-screening/interaction-screening.html b/src/app/features/workflows/interaction-screening/interaction-screening.html
index 8652778b..74d30093 100644
--- a/src/app/features/workflows/interaction-screening/interaction-screening.html
+++ b/src/app/features/workflows/interaction-screening/interaction-screening.html
@@ -211,6 +211,7 @@ <h3 class="text-sm font-medium text-sky-800">
   <app-workflow-preview-modal
     [isOpen]="showPreview()"
     [credits]="creditsEnabled ? creditCost() : null"
+    [creditsRemaining]="creditsRemaining()"
     [isSubmitting]="workflowSubmission.isSubmitting()"
     workflowName="Interaction Screening"
     [selectedTool]="selectedToolLabel()"
diff --git a/src/app/features/workflows/layout/workflow-layout/workflow-layout.component.html b/src/app/features/workflows/layout/workflow-layout/workflow-layout.component.html
index 58fdc7ab..4f8b5863 100644
--- a/src/app/features/workflows/layout/workflow-layout/workflow-layout.component.html
+++ b/src/app/features/workflows/layout/workflow-layout/workflow-layout.component.html
@@ -20,7 +20,7 @@
 ></app-dialog>
 
 <div
-  class="bg-gray-100 bg-[url('/assets/denovo-design.png')] bg-no-repeat bg-size-[100%_auto] bg-top bg-fixed"
+  class="bg-gray-100 bg-[url('/assets/workflows-bg.png')] bg-no-repeat bg-size-[100%_auto] bg-top bg-fixed"
 >
   <!-- Error Alert -->
   @if (showAlert()) {
diff --git a/src/app/features/workflows/single-prediction/single-prediction.html b/src/app/features/workflows/single-prediction/single-prediction.html
index a33b3d00..ca91b4dc 100644
--- a/src/app/features/workflows/single-prediction/single-prediction.html
+++ b/src/app/features/workflows/single-prediction/single-prediction.html
@@ -97,7 +97,7 @@
               cdkDragPreviewContainer="parent"
             >
               <div
-                class="grid gap-4 lg:grid-cols-[40px_170px_110px_170px_minmax(0,1fr)_40px] lg:items-start"
+                class="grid gap-4 lg:grid-cols-[40px_170px_110px_minmax(0,1fr)_40px] lg:items-start"
               >
                 <div class="flex shrink-0 cursor-grab flex-col items-center">
                   <span class="mb-1 block text-sm font-medium">
@@ -163,41 +163,6 @@
                   }
                 </div>
 
-                <div class="min-w-0">
-                  <label
-                    [for]="'sequence-name-' + row.id"
-                    class="mb-1 block text-sm font-medium"
-                  >
-                    Sequence Name
-                    <span class="text-red-500" aria-hidden="true">*</span>
-                  </label>
-                  <input
-                    type="text"
-                    [id]="'sequence-name-' + row.id"
-                    [attr.aria-label]="'Sequence name for entity ' + (i + 1)"
-                    [value]="row.name"
-                    (input)="updateRowName(row.id, $any($event.target).value)"
-                    (blur)="touchRowField(row.id, 'name')"
-                    [placeholder]="'seq' + (i + 1)"
-                    [class]="
-                    shouldShowRowFieldError(row, 'name') && getRowErrors(i).name
-                      ? 'border-red-500 focus:ring-red-100'
-                      : 'focus:ring-sky-100'
-                  "
-                    class="block h-10 w-full rounded-md border bg-white px-4 text-sm text-gray-900 placeholder-gray-400 focus:outline-none focus:ring-2 transition-colors"
-                    autocomplete="off"
-                    spellcheck="false"
-                    autocorrect="off"
-                    autocapitalize="off"
-                  />
-                  @if (shouldShowRowFieldError(row, 'name') &&
-                  getRowErrors(i).name) {
-                  <p class="mt-1 text-xs text-red-600" role="alert">
-                    {{ getRowErrors(i).name }}
-                  </p>
-                  }
-                </div>
-
                 <div class="min-w-0">
                   <label
                     [for]="'sequence-' + row.id"
@@ -431,6 +396,7 @@
   <app-workflow-preview-modal
     [isOpen]="showPreview()"
     [credits]="creditsEnabled ? creditCost() : null"
+    [creditsRemaining]="creditsRemaining()"
     [isSubmitting]="workflowSubmission.isSubmitting()"
     workflowName="Single Prediction"
     [selectedTool]="selectedToolLabel()"
diff --git a/src/app/features/workflows/single-prediction/single-prediction.spec.ts b/src/app/features/workflows/single-prediction/single-prediction.spec.ts
index 5cc8bbe9..2fcd2311 100644
--- a/src/app/features/workflows/single-prediction/single-prediction.spec.ts
+++ b/src/app/features/workflows/single-prediction/single-prediction.spec.ts
@@ -128,7 +128,6 @@ describe("SinglePredictionComponent", () => {
   ): number {
     const rowId = component.entityRows()[0].id;
     component.form.controls.jobName.setValue("test-run");
-    component.updateRowName(rowId, "pro");
     component.updateRowSequence(rowId, sequence);
     component.updateRowCopyNumber(rowId, copyNumber);
     component.updateRowMoleculeType(rowId, "protein");
@@ -217,7 +216,6 @@ describe("SinglePredictionComponent", () => {
   it("should validate DNA, RNA, and ligand formats", () => {
     const rowId = component.entityRows()[0].id;
     component.form.controls.jobName.setValue("test-run");
-    component.updateRowName(rowId, "entity1");
     component.selectTool("boltz");
 
     component.updateRowSequence(rowId, "ACGT");
@@ -249,7 +247,6 @@ describe("SinglePredictionComponent", () => {
   it("should mark CCD row valid when code is in the supported list", () => {
     const rowId = component.entityRows()[0].id;
     component.form.controls.jobName.setValue("test-run");
-    component.updateRowName(rowId, "ccdrow");
     component.selectTool("boltz");
     component.updateRowMoleculeType(rowId, "ccd");
     component.updateRowSequence(rowId, "ATP");
@@ -361,7 +358,6 @@ describe("SinglePredictionComponent", () => {
   it("should allow Boltz with non-protein molecules and generate FASTA-like content", () => {
     const rowId = component.entityRows()[0].id;
     component.form.controls.jobName.setValue("test-run");
-    component.updateRowName(rowId, "dna");
 
     component.selectTool("boltz");
     component.updateRowSequence(rowId, "ACGT");
@@ -369,8 +365,8 @@ describe("SinglePredictionComponent", () => {
     component.updateRowCopyNumber(rowId, "2");
 
     expect(component.isStep1Valid()).toBe(true);
-    expect(component.generatedFastaContent()).toContain(">dna_1|dna");
-    expect(component.generatedFastaContent()).toContain(">dna_2|dna");
+    expect(component.generatedFastaContent()).toContain(">seq1_1|dna");
+    expect(component.generatedFastaContent()).toContain(">seq1_2|dna");
   });
 
   it("should tag generated FASTA headers with the molecule type", () => {
@@ -378,7 +374,6 @@ describe("SinglePredictionComponent", () => {
     component.form.controls.jobName.setValue("test-run");
     component.selectTool("boltz");
 
-    component.updateRowName(rowId, "seq1");
     component.updateRowSequence(rowId, "ACDEFGHIK");
     component.updateRowMoleculeType(rowId, "protein");
     expect(component.generatedFastaContent()).toBe(">seq1|protein\nACDEFGHIK");
@@ -525,7 +520,7 @@ describe("SinglePredictionComponent", () => {
     expect(payload["tool"]).toBe("alphafold2");
     expect(payload["alphafold2_random_seed"]).toBe(42);
     expect(payload["alphafold2_full_dbs"]).toBe(true);
-    expect(payload["fastaContent"]).toContain(">pro_1");
+    expect(payload["fastaContent"]).toContain(">seq1_1");
     expect(payload["fastaFileUrl"]).toBe(MOCK_FASTA_RESPONSE.s3Uri);
     expect(payload["sample_id"]).toBe(samplesheetId);
     expect(component.isFormValid()).toBe(true);
@@ -641,18 +636,8 @@ describe("SinglePredictionComponent", () => {
     expect(errors["copyNumber"]).toContain("greater than or equal to 1");
   });
 
-  it("should reject sequence names containing underscores", () => {
-    const rowId = component.entityRows()[0].id;
-    component.updateRowSequence(rowId, "ACDEFGHIK");
-    component.updateRowName(rowId, "seq_1");
-
-    const errors = component.entityValidationResults()[0];
-    expect(errors.name).toContain("underscore");
-  });
-
   it("should require jobName in step 1 validation", () => {
     const rowId = component.entityRows()[0].id;
-    component.updateRowName(rowId, "entity1");
     component.updateRowSequence(rowId, "ACDEFGHIK");
 
     component.form.controls.jobName.setValue("");
@@ -704,7 +689,6 @@ describe("SinglePredictionComponent", () => {
 
   it("should keep input-config invalid until jobName is filled", () => {
     const rowId = component.entityRows()[0].id;
-    component.updateRowName(rowId, "entity1");
     component.updateRowSequence(rowId, "ACDEFGHIK");
     component.form.controls.jobName.setValue("");
     expect(component.isSectionValid("input-config")).toBe(false);
diff --git a/src/app/features/workflows/single-prediction/single-prediction.ts b/src/app/features/workflows/single-prediction/single-prediction.ts
index f4995f94..c30d419e 100644
--- a/src/app/features/workflows/single-prediction/single-prediction.ts
+++ b/src/app/features/workflows/single-prediction/single-prediction.ts
@@ -40,7 +40,6 @@ import {
   isValidSmiles,
   lookupCcdCompound,
   validateDnaSequence,
-  validateFastaHeader,
   validateProteinSequence,
   validateRnaSequence,
 } from "../shared/fasta.utils";
@@ -63,12 +62,10 @@ interface ToolChip extends ToolOption {
 
 interface EntityRow {
   id: number;
-  name: string;
   sequence: string;
   copyNumber: string;
   moleculeType: MoleculeType;
   touched: {
-    name: boolean;
     sequence: boolean;
     copyNumber: boolean;
     moleculeType: boolean;
@@ -76,7 +73,6 @@ interface EntityRow {
 }
 
 interface EntityRowErrors {
-  name?: string;
   sequence?: string;
   copyNumber?: string;
   tool?: string;
@@ -215,8 +211,7 @@ export default class SinglePredictionComponent extends WorkflowPageBase {
       this.form.controls.jobName.valid &&
       this.entityRows().length > 0 &&
       this.entityValidationResults().every(
-        (errors) =>
-          !errors.name && !errors.sequence && !errors.copyNumber && !errors.tool
+        (errors) => !errors.sequence && !errors.copyNumber && !errors.tool
       )
     );
   });
@@ -252,11 +247,15 @@ export default class SinglePredictionComponent extends WorkflowPageBase {
       type: `${this.getMoleculeTypeLabel(
         row.moleculeType
       )} x${this.getParsedCopyNumber(row.copyNumber)}`,
-      name: row.name.trim() || `Entity ${index + 1}`,
+      name: this.getEntityName(index),
       sequence: this.getNormalizedSequence(row),
     }))
   );
 
+  private getEntityName(index: number): string {
+    return `seq${index + 1}`;
+  }
+
   readonly generatedFastaContent = computed(() => {
     if (!this.isStep1Valid()) {
       return "";
@@ -264,17 +263,17 @@ export default class SinglePredictionComponent extends WorkflowPageBase {
 
     const fastaRecords: string[] = [];
 
-    for (const row of this.entityRows()) {
+    this.entityRows().forEach((row, index) => {
       const copies = this.getParsedCopyNumber(row.copyNumber);
       const sequence = this.getNormalizedSequence(row);
-      const name = row.name.trim();
+      const name = this.getEntityName(index);
       const type = this.getFastaMoleculeType(row.moleculeType);
 
       for (let copyIndex = 0; copyIndex < copies; copyIndex += 1) {
         const headerId = copies > 1 ? `${name}_${copyIndex + 1}` : name;
         fastaRecords.push(`>${headerId}|${type}\n${sequence}`);
       }
-    }
+    });
 
     return fastaRecords.join("\n");
   });
@@ -335,10 +334,6 @@ export default class SinglePredictionComponent extends WorkflowPageBase {
     this.patchRow(id, { copyNumber: value });
   }
 
-  updateRowName(id: number, value: string): void {
-    this.patchRow(id, { name: value });
-  }
-
   updateRowMoleculeType(id: number, value: string): void {
     this.patchRow(id, { moleculeType: value as MoleculeType });
     if (value === "ccd") {
@@ -515,12 +510,10 @@ export default class SinglePredictionComponent extends WorkflowPageBase {
     const id = this.nextRowId++;
     return {
       id,
-      name: "",
       sequence: "",
       copyNumber: "1",
       moleculeType: "protein",
       touched: {
-        name: false,
         sequence: false,
         copyNumber: false,
         moleculeType: false,
@@ -583,7 +576,6 @@ export default class SinglePredictionComponent extends WorkflowPageBase {
       rows.map((row) => ({
         ...row,
         touched: {
-          name: true,
           sequence: true,
           copyNumber: true,
           moleculeType: true,
@@ -601,14 +593,6 @@ export default class SinglePredictionComponent extends WorkflowPageBase {
   private validateEntityRow(row: EntityRow): EntityRowErrors {
     const errors: EntityRowErrors = {};
 
-    const otherNames = this.entityRows()
-      .filter((r) => r.id !== row.id)
-      .map((r) => r.name);
-    const headerValidation = validateFastaHeader(row.name, otherNames);
-    if (!headerValidation.valid) {
-      errors.name = headerValidation.errorMessage;
-    }
-
     const normalizedSequence = this.getNormalizedSequence(row);
 
     if (
@@ -832,8 +816,8 @@ export default class SinglePredictionComponent extends WorkflowPageBase {
       workflow: "single-prediction",
       tool: this.selectedTool(),
       runName: this.jobName().trim(),
-      entities: this.entityRows().map((row) => ({
-        id: row.name.trim(),
+      entities: this.entityRows().map((row, index) => ({
+        id: this.getEntityName(index),
         moleculeType: row.moleculeType,
         copyNumber: this.getParsedCopyNumber(row.copyNumber),
         sequence: this.getNormalizedSequence(row),
diff --git a/src/assets/binder-design.png b/src/assets/binder-design.png
deleted file mode 100644
index b3497153..00000000
Binary files a/src/assets/binder-design.png and /dev/null differ
diff --git a/src/assets/denovo-design.png b/src/assets/denovo-design.png
deleted file mode 100644
index 7f304447..00000000
Binary files a/src/assets/denovo-design.png and /dev/null differ
diff --git a/src/assets/themes-bg.png b/src/assets/themes-bg.png
new file mode 100644
index 00000000..428de50e
Binary files /dev/null and b/src/assets/themes-bg.png differ
diff --git a/src/assets/workflows-bg.png b/src/assets/workflows-bg.png
new file mode 100644
index 00000000..b5c092a7
Binary files /dev/null and b/src/assets/workflows-bg.png differ