diff --git a/.changeset/wizard-skip-required-fields.md b/.changeset/wizard-skip-required-fields.md
new file mode 100644
index 000000000..ec9e6e860
--- /dev/null
+++ b/.changeset/wizard-skip-required-fields.md
@@ -0,0 +1,42 @@
+---
+"@object-ui/plugin-form": patch
+---
+
+fix(form): a wizard with `allowSkip` no longer submits past the required fields you skipped
+
+`allowSkip` let the user jump to any step from the indicator, and
+`handleStepClick` did so without validating anything on the way. Since a wizard
+mounts ONE step at a time and react-hook-form only validates the fields currently
+**mounted**, a required field on a step nobody opened was never registered, never
+validated, and simply absent from the payload.
+
+Measured against the unfixed component — 3 steps, required `owner` on step 2,
+`allowSkip: true`, click step 3's indicator, fill it, hit Create:
+
+    createCalls: 1
+    payload:     { subject: 'S1', notes: 'S3' }   // `owner` missing entirely
+    UI mentions "required": false                 // nothing said so
+
+So an invalid create went out and the client said nothing about why — #2959's
+validation half, wearing a wizard's clothes.
+
+The final submit now checks the WHOLE declared field set, and when something is
+outstanding it returns the user to the first step that has one, marks that step's
+indicator (`data-error="true"`, destructive circle + icon), names the fields in a
+toast, and sends nothing. Conditional rules are honoured: the check runs on the
+canonical `resolveFieldRuleState`, the same engine the form renderer and the
+server's rule-validator use, so a field hidden by `visibleWhen` or not yet
+required by `requiredWhen` is not demanded. The sequential path is unaffected —
+a forward jump is refused without `allowSkip`, so Next already validated each step.
+
+Also in `WizardForm`:
+
+- `FormView.columns` is now honoured (spec key, previously dropped): the grid
+  width is the view's `columns`, else the step's own. Unlike the tabbed/split
+  hosts there is no widest-section fallback — wizard steps never share a viewport,
+  so each keeps its authored width.
+- the root gained `@container`. The step grid is sized with container queries, and
+  without a container ancestor every `@md:`/`@2xl:` variant was inert — a step
+  declaring 2 columns rendered single-column. Found by running it in a browser;
+  the class was present all along, which is why asserting the class alone had
+  missed it.
diff --git a/content/docs/plugins/plugin-form.mdx b/content/docs/plugins/plugin-form.mdx
index 75beca9a2..38ed3a250 100644
--- a/content/docs/plugins/plugin-form.mdx
+++ b/content/docs/plugins/plugin-form.mdx
@@ -69,9 +69,11 @@ A sectioned form renders as ONE grid. The form view's `columns` (spec
 densely that section fills it. The view's value wins; without it the grid takes
 the widest section's density, and without either it is single-column.
 
-`ObjectForm` (simple), `ModalForm`, `TabbedForm` and `SplitForm` all resolve it
-that way, so the same metadata lays out identically in every host. The grid is
-applied to the field container inside the form, never wrapped around the `<form>`.
+`ObjectForm` (simple), `ModalForm`, `TabbedForm`, `SplitForm` and `WizardForm` all
+resolve it that way, so the same metadata lays out identically in every host
+(`WizardForm` has no widest-section fallback — its steps never share a viewport,
+so each keeps its own authored width). The grid is applied to the field container
+inside the form, never wrapped around the `<form>`.
 
 ### Tabbed field layout (`fieldTabs`)
 
@@ -102,6 +104,20 @@ inactive tab unmount along with its values).
 
 `ModalForm` (`contentLayout: 'tabbed'`) and `TabbedForm` build on this.
 
+### Wizard steps and `allowSkip`
+
+`allowSkip` lets the user jump to any step from the indicator instead of walking
+through them in order. It is navigation freedom, not an exemption from the
+object's rules: the **final submit checks every step's required fields**, and if
+something is outstanding it returns the user to the first step that has one, marks
+that step's indicator (`data-error="true"`), and names the fields in a toast —
+nothing is sent. Conditional rules are respected (`visibleWhen` / `requiredWhen`
+are evaluated on the same canonical engine as the renderer and the server).
+
+This matters because react-hook-form only validates the fields currently mounted,
+and a wizard mounts one step at a time — so a required field on a step nobody
+opened used to be absent from the payload with nothing on screen saying so.
+
 ### Split field layout (`fieldPanes`)
 
 Side-by-side panels follow the same rule: the `<form>` wraps the whole panel
diff --git a/packages/plugin-form/README.md b/packages/plugin-form/README.md
index e92b5328a..b484fb4bf 100644
--- a/packages/plugin-form/README.md
+++ b/packages/plugin-form/README.md
@@ -94,8 +94,10 @@ A sectioned form renders as ONE grid, and two keys decide its shape:
 
 The view's `columns` wins; without it the grid takes the widest section's
 density, and without either it is single-column. Every sectioned host resolves it
-the same way — `ObjectForm` (simple), `ModalForm`, `TabbedForm`, `SplitForm` —
-so one piece of metadata lays out identically wherever it is rendered.
+the same way — `ObjectForm` (simple), `ModalForm`, `TabbedForm`, `SplitForm`,
+`WizardForm` — so one piece of metadata lays out identically wherever it is
+rendered. (`WizardForm` has no widest-section fallback: its steps never share a
+viewport, so each step keeps its own authored width.)
 
 The grid is applied to the field container **inside** the form, never wrapped
 around the `<form>` (which would put the whole form in cell 1 and leave the other
@@ -132,6 +134,26 @@ the renderer distribute the fields:
 
 `ModalForm` (`contentLayout: 'tabbed'`) and `TabbedForm` are built on this.
 
+### Wizard steps and `allowSkip`
+
+`allowSkip` lets the user jump to any step from the indicator instead of walking
+through them in order. It is **navigation** freedom, not an exemption from the
+object's rules:
+
+- Next validates the step you are leaving, as always.
+- The **final submit checks every step's required fields** — not just the last
+  one's — and if something is outstanding it sends the user to the first step
+  that has one, marks that step's indicator (`data-error="true"`), and names the
+  fields in a toast. Nothing is sent.
+- Conditional rules are respected: a field whose `visibleWhen` is false, or whose
+  `requiredWhen` is false, is not demanded. The check runs on the same canonical
+  engine as the renderer and the server's rule-validator, so all three agree.
+
+This matters because react-hook-form only validates the fields currently
+**mounted**, and a wizard mounts one step at a time — so a required field on a
+step nobody opened used to be absent from the payload with nothing on screen
+saying so (#2959's validation half, in a wizard).
+
 ### Split field layout (`fieldPanes`)
 
 The same rule for side-by-side panels: the `<form>` wraps the whole panel group
diff --git a/packages/plugin-form/src/WizardForm.tsx b/packages/plugin-form/src/WizardForm.tsx
index 54c0e674c..8a79b9985 100644
--- a/packages/plugin-form/src/WizardForm.tsx
+++ b/packages/plugin-form/src/WizardForm.tsx
@@ -16,14 +16,28 @@
 import React, { useState, useCallback, useMemo } from 'react';
 import type { FormField, DataSource } from '@object-ui/types';
 import { Button, cn, toast } from '@object-ui/components';
-import { Check, ChevronLeft, ChevronRight, Loader2 } from 'lucide-react';
+import { AlertCircle, Check, ChevronLeft, ChevronRight, Loader2 } from 'lucide-react';
+import { resolveFieldRuleState } from '@object-ui/core';
+import { createSafeTranslation } from '@object-ui/i18n';
 import { FormSection } from './FormSection';
 import { SchemaRenderer, useSafeFieldLabel } from '@object-ui/react';
 import { buildSectionFields as buildSectionFieldsShared } from './sectionFields';
-import { sectionFormLayout } from './autoLayout';
+import { applyAutoColSpan, containerGridColsFor } from './autoLayout';
 import { resolveSuccessNavigate, isSameOriginUrl, type SubmitBehavior } from './successBehavior';
 import type { FormSectionConfig } from './TabbedForm';
 
+// Falls back to English when no i18n provider is mounted.
+const useWizardTranslation = createSafeTranslation(
+  {
+    'wizard.missingRequired': 'Please complete the required fields: {{fields}}',
+  },
+  'wizard.missingRequired',
+);
+
+/** Empty for the purposes of a required check: '' / null / undefined / []. */
+const isEmptyValue = (v: unknown): boolean =>
+  v === undefined || v === null || v === '' || (Array.isArray(v) && v.length === 0);
+
 export interface WizardFormSchema {
   type: 'object-form';
   formType: 'wizard';
@@ -49,10 +63,23 @@ export interface WizardFormSchema {
   sections: FormSectionConfig[];
   
   /**
-   * Allow navigation to any step (not just sequential)
+   * Allow navigation to any step (not just sequential).
+   *
+   * This is navigation freedom, NOT an exemption from the object's rules: the
+   * final submit still checks every step's required fields and sends the user
+   * back to the first step that has one outstanding (#2959's validation half —
+   * react-hook-form only validates the fields currently mounted, so a step
+   * nobody opened used to reach the server unvalidated).
    * @default false
    */
   allowSkip?: boolean;
+
+  /**
+   * Grid width for each step (1–4). Aligns with @objectstack/spec
+   * FormView.columns and OUTRANKS the per-step `columns`, which says how densely
+   * that step fills the grid. Omitted = the step's own `columns`, else 1.
+   */
+  columns?: number;
   
   /**
    * Show step indicators
@@ -181,6 +208,7 @@ export const WizardForm: React.FC<WizardFormProps> = ({
   className,
 }) => {
   const { fieldLabel } = useSafeFieldLabel();
+  const { t } = useWizardTranslation();
   const [objectSchema, setObjectSchema] = useState<any>(null);
   const [formData, setFormData] = useState<Record<string, any>>({});
   const [loading, setLoading] = useState(true);
@@ -188,6 +216,10 @@ export const WizardForm: React.FC<WizardFormProps> = ({
   const [currentStep, setCurrentStep] = useState(0);
   const [completedSteps, setCompletedSteps] = useState<Set<number>>(new Set());
   const [submitting, setSubmitting] = useState(false);
+  // Steps the final submit found an outstanding required field on, so their
+  // indicator can say so — a rejection on a step the user is not looking at is
+  // otherwise invisible and the submit just appears to do nothing.
+  const [invalidSteps, setInvalidSteps] = useState<Set<number>>(new Set());
   // Terminal state for `submitBehavior: { kind: 'thank-you' | 'next-record' }`.
   // Without this the last step's form stayed mounted and fully filled after a
   // successful create, with nothing disabling "Create" — a second click fired
@@ -284,15 +316,85 @@ export const WizardForm: React.FC<WizardFormProps> = ({
     return [];
   }, [currentStep, totalSteps, schema.sections, buildSectionFields]);
 
+  /**
+   * Required fields the record does not satisfy, grouped by the STEP that
+   * declares them.
+   *
+   * react-hook-form only validates the fields currently MOUNTED, and a wizard
+   * mounts one step at a time. Sequential navigation is safe (Next validates the
+   * step you are leaving), but `allowSkip` jumps straight to any step — so a
+   * required field on a step nobody opened was never registered, never
+   * validated, and simply absent from the create payload, with nothing on screen
+   * saying so. The final submit therefore re-checks the WHOLE declared field set
+   * here.
+   *
+   * Uses the canonical rule engine (`resolveFieldRuleState`), the same one the
+   * form renderer and the server's rule-validator use, so a conditionally
+   * required/hidden field gets the same verdict from all three rather than a
+   * second, divergent dialect.
+   */
+  const missingRequiredByStep = useCallback(
+    (record: Record<string, any>): Map<number, string[]> => {
+      const out = new Map<number, string[]>();
+      schema.sections.forEach((section, index) => {
+        for (const field of buildSectionFields(section)) {
+          const name = field?.name;
+          if (!name || (field as any).hidden === true) continue;
+          const state = resolveFieldRuleState(
+            {
+              visibleWhen: (field as any).visibleWhen,
+              readonlyWhen: (field as any).readonlyWhen,
+              requiredWhen: (field as any).requiredWhen,
+            },
+            record,
+            { required: !!field.required, readonly: (field as any).readonly === true },
+          );
+          // A hidden or read-only field is not the user's to fill in.
+          if (!state.visible || state.readonly || !state.required) continue;
+          if (!isEmptyValue(record[name])) continue;
+          out.set(index, [...(out.get(index) ?? []), (field as any).label || name]);
+        }
+      });
+      return out;
+    },
+    [schema.sections, buildSectionFields],
+  );
+
   // Handle step data collection (merge partial data into formData)
   const handleStepSubmit = useCallback(async (stepData: Record<string, any>) => {
     const mergedData = { ...formData, ...stepData };
     setFormData(mergedData);
-    
+
     // Mark step as completed
     setCompletedSteps(prev => new Set(prev).add(currentStep));
+    // This step just cleared its own validation, so drop any marker it carried.
+    setInvalidSteps(prev => {
+      if (!prev.has(currentStep)) return prev;
+      const next = new Set(prev);
+      next.delete(currentStep);
+      return next;
+    });
 
     if (isLastStep) {
+      // Gate the submit on the FULL field set, not just this step's (see
+      // missingRequiredByStep) — then point the user at the first step that is
+      // short something, instead of letting the server answer with a 400 that
+      // names fields the user cannot even see.
+      const missing = missingRequiredByStep(mergedData);
+      if (missing.size > 0) {
+        setInvalidSteps(new Set(missing.keys()));
+        const labels = [...missing.values()].flat();
+        const MAX = 3;
+        toast.error(
+          t('wizard.missingRequired', {
+            fields: labels.slice(0, MAX).join(', ') + (labels.length > MAX ? '…' : ''),
+          }),
+        );
+        goToStep(Math.min(...missing.keys()));
+        return;
+      }
+      setInvalidSteps(new Set());
+
       // Final submission
       setSubmitting(true);
       try {
@@ -371,7 +473,7 @@ export const WizardForm: React.FC<WizardFormProps> = ({
       // Move to next step
       goToStep(currentStep + 1);
     }
-  }, [formData, currentStep, isLastStep, schema, dataSource]);
+  }, [formData, currentStep, isLastStep, schema, dataSource, missingRequiredByStep, t]);
 
   // Navigation
   const goToStep = useCallback((step: number) => {
@@ -431,9 +533,17 @@ export const WizardForm: React.FC<WizardFormProps> = ({
   }
 
   const currentSection = schema.sections[currentStep];
+  const clampCol = (n: unknown): number | undefined =>
+    typeof n === 'number' && n > 0 ? Math.min(Math.floor(n), 4) : undefined;
+  const stepGridColumns = clampCol(schema.columns) ?? clampCol(currentSection?.columns) ?? 1;
+  const stepFieldContainerClass = containerGridColsFor(stepGridColumns);
 
   return (
-    <div className={cn('w-full', className, schema.className)}>
+    // `@container`: the step's field grid is sized with container queries
+    // (`@md:grid-cols-2` …), which need a container ancestor to resolve against —
+    // without one the classes are inert and a multi-column step silently stayed
+    // single-column. Same wrapper TabbedForm / SplitForm carry.
+    <div className={cn('w-full @container', className, schema.className)}>
       {/* Step Indicator */}
       {schema.showStepIndicator !== false && (
         <nav aria-label="Progress" className="mb-8">
@@ -442,6 +552,8 @@ export const WizardForm: React.FC<WizardFormProps> = ({
               const isActive = index === currentStep;
               const isCompleted = completedSteps.has(index);
               const isClickable = schema.allowSkip || isCompleted || index <= currentStep;
+              // The last submit found a required field outstanding on this step.
+              const hasError = invalidSteps.has(index);
 
               return (
                 <li
@@ -474,17 +586,24 @@ export const WizardForm: React.FC<WizardFormProps> = ({
                     )}
                     onClick={() => handleStepClick(index)}
                     disabled={!isClickable}
+                    data-testid={`wizard-step:${section.name || index}`}
+                    data-error={hasError || undefined}
                   >
                     {/* Step circle - smaller on mobile */}
                     <span
                       className={cn(
                         'flex h-6 w-6 sm:h-8 sm:w-8 items-center justify-center rounded-full text-xs sm:text-sm font-medium transition-colors',
-                        isCompleted && 'bg-primary text-primary-foreground',
-                        isActive && !isCompleted && 'border-2 border-primary bg-background text-primary',
-                        !isActive && !isCompleted && 'border-2 border-muted bg-background text-muted-foreground'
+                        // An outstanding required field outranks the completed
+                        // tick: the step needs attention, whatever else it is.
+                        hasError && 'border-2 border-destructive bg-background text-destructive',
+                        !hasError && isCompleted && 'bg-primary text-primary-foreground',
+                        !hasError && isActive && !isCompleted && 'border-2 border-primary bg-background text-primary',
+                        !hasError && !isActive && !isCompleted && 'border-2 border-muted bg-background text-muted-foreground'
                       )}
                     >
-                      {isCompleted ? (
+                      {hasError ? (
+                        <AlertCircle className="h-3 w-3 sm:h-4 sm:w-4" aria-hidden />
+                      ) : isCompleted ? (
                         <Check className="h-3 w-3 sm:h-4 sm:w-4" />
                       ) : (
                         index + 1
@@ -495,7 +614,9 @@ export const WizardForm: React.FC<WizardFormProps> = ({
                     <span className="ml-2 sm:ml-3 text-xs sm:text-sm font-medium hidden sm:block">
                       <span
                         className={cn(
-                          isActive ? 'text-foreground' : 'text-muted-foreground'
+                          hasError
+                            ? 'text-destructive'
+                            : isActive ? 'text-foreground' : 'text-muted-foreground'
                         )}
                       >
                         {section.label || `Step ${index + 1}`}
@@ -528,7 +649,19 @@ export const WizardForm: React.FC<WizardFormProps> = ({
                   id: stepFormId,
                   // Multi-column on the field container inside the form, not a
                   // grid around the whole form (which leaves columns empty).
-                  ...sectionFormLayout(currentSectionFields, currentSection.columns || 1),
+                  //
+                  // Grid width: the form view's own `columns` first (spec
+                  // FormView.columns — it was being dropped, so a view that
+                  // declared 3 columns rendered single-column here while the same
+                  // metadata gave 3 in a modal), else this step's own `columns`.
+                  // Unlike the tabbed/split hosts there is no widest-section
+                  // fallback: wizard steps never share a viewport, so there is no
+                  // shared grid to size, and each step keeps its authored width.
+                  fields: stepGridColumns > 1
+                    ? applyAutoColSpan(currentSectionFields, stepGridColumns, clampCol(currentSection.columns))
+                    : currentSectionFields,
+                  columns: stepGridColumns,
+                  ...(stepFieldContainerClass ? { fieldContainerClass: stepFieldContainerClass } : {}),
                   layout: 'vertical' as const,
                   defaultValues: formData,
                   showSubmit: false,
diff --git a/packages/plugin-form/src/wizardSkipValidation.test.tsx b/packages/plugin-form/src/wizardSkipValidation.test.tsx
new file mode 100644
index 000000000..8ba7e645d
--- /dev/null
+++ b/packages/plugin-form/src/wizardSkipValidation.test.tsx
@@ -0,0 +1,239 @@
+/**
+ * ObjectUI
+ * Copyright (c) 2024-present ObjectStack Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * `allowSkip` is navigation freedom, not an exemption from the object's rules.
+ *
+ * A wizard mounts ONE step at a time, and react-hook-form only validates the
+ * fields currently mounted — so a required field on a step the user jumped past
+ * was never registered, never validated, and simply absent from the payload.
+ * Measured against the unfixed component, the reported flow (3 steps, required
+ * `owner` on step 2, `allowSkip: true`, click step 3's indicator, fill it, hit
+ * Create) produced:
+ *
+ *     createCalls: 1
+ *     payload:     { subject: 'S1', notes: 'S3' }   // `owner` missing entirely
+ *     UI mentions "required": false                 // nothing said so
+ *
+ * i.e. an invalid create left the client with no indication of what was wrong —
+ * the same defect #2959 fixed for tabs, wearing a wizard's clothes. The final
+ * submit now checks every step's required fields and sends the user to the first
+ * step that is short one.
+ *
+ * The sequential path was never affected (a forward jump is refused without
+ * `allowSkip`, so Next validates each step on the way) and is pinned below so the
+ * new gate can't start blocking legitimate submits.
+ */
+
+import React from 'react';
+import { describe, it, expect, vi, afterEach } from 'vitest';
+import { render, screen, fireEvent, waitFor, cleanup } from '@testing-library/react';
+import { registerAllFields } from '@object-ui/fields';
+import { WizardForm } from './WizardForm';
+
+registerAllFields();
+
+afterEach(() => {
+  cleanup();
+  vi.restoreAllMocks();
+});
+
+const makeDataSource = (): any => ({
+  getObjectSchema: vi.fn().mockResolvedValue({
+    name: 'case',
+    fields: {
+      subject: { type: 'text', label: 'Subject' },
+      // Required, parked on the MIDDLE step — the one the user skips past.
+      owner: { type: 'text', label: 'Owner', required: true },
+      notes: { type: 'text', label: 'Notes' },
+    },
+  }),
+  create: vi.fn().mockResolvedValue({ id: 'case-1' }),
+  update: vi.fn(),
+  findOne: vi.fn(),
+});
+
+const SECTIONS = [
+  { name: 's1', label: 'Step 1', fields: ['subject'] },
+  { name: 's2', label: 'Step 2', fields: ['owner'] },
+  { name: 's3', label: 'Step 3', fields: ['notes'] },
+];
+
+const fill = (name: string, value: string) => {
+  const input = document.body.querySelector<HTMLInputElement>(`[data-field="${name}"] input`);
+  if (!input) throw new Error(`field not rendered: ${name}`);
+  fireEvent.change(input, { target: { value } });
+};
+
+/**
+ * The step indicator, located by position in the progress nav rather than by the
+ * `data-testid` this change also adds — so these assertions run unchanged against
+ * the unfixed component and fail on the DEFECT, not on a missing locator.
+ */
+const stepIndicator = (index: number) =>
+  document.body.querySelectorAll<HTMLButtonElement>('nav[aria-label="Progress"] button')[index];
+
+const renderWizard = (overrides: Record<string, unknown> = {}, dataSource = makeDataSource()) => {
+  render(
+    <WizardForm
+      schema={{
+        type: 'object-form',
+        formType: 'wizard',
+        objectName: 'case',
+        mode: 'create',
+        sections: SECTIONS,
+        ...overrides,
+      }}
+      dataSource={dataSource}
+    />,
+  );
+  return dataSource;
+};
+
+describe('WizardForm allowSkip — required fields on a skipped step (#2959)', () => {
+  it('refuses the submit and returns to the step holding the missing field', async () => {
+    const dataSource = renderWizard({ allowSkip: true });
+
+    await waitFor(() => expect(document.body.querySelector('[data-field="subject"]')).toBeTruthy());
+    fill('subject', 'S1');
+
+    // Jump straight to the last step, skipping step 2 entirely.
+    fireEvent.click(stepIndicator(2));
+    await waitFor(() => expect(document.body.querySelector('[data-field="notes"]')).toBeTruthy());
+    fill('notes', 'S3');
+    // `owner` was never mounted, so RHF has no rule registered for it.
+    expect(document.body.querySelector('[data-field="owner"]')).toBeNull();
+
+    fireEvent.click(screen.getByRole('button', { name: /Create/i }));
+
+    // Nothing is sent, and the wizard lands on the step that is short a field.
+    await waitFor(() => expect(document.body.querySelector('[data-field="owner"]')).toBeTruthy());
+    expect(dataSource.create).not.toHaveBeenCalled();
+    expect(stepIndicator(1)).toHaveAttribute('data-error', 'true');
+    expect(stepIndicator(0)).not.toHaveAttribute('data-error');
+  });
+
+  it('submits once the skipped step is filled in, and clears its marker', async () => {
+    const dataSource = renderWizard({ allowSkip: true });
+
+    await waitFor(() => expect(document.body.querySelector('[data-field="subject"]')).toBeTruthy());
+    fill('subject', 'S1');
+    fireEvent.click(stepIndicator(2));
+    await waitFor(() => expect(document.body.querySelector('[data-field="notes"]')).toBeTruthy());
+    fill('notes', 'S3');
+    fireEvent.click(screen.getByRole('button', { name: /Create/i }));
+
+    // Bounced to step 2 — fill it, then walk back to the end and submit.
+    await waitFor(() => expect(document.body.querySelector('[data-field="owner"]')).toBeTruthy());
+    fill('owner', 'Ada');
+    fireEvent.click(screen.getByRole('button', { name: /Next/i }));
+
+    await waitFor(() => expect(document.body.querySelector('[data-field="notes"]')).toBeTruthy());
+    expect(stepIndicator(1)).not.toHaveAttribute('data-error');
+
+    fireEvent.click(screen.getByRole('button', { name: /Create/i }));
+
+    await waitFor(() => expect(dataSource.create).toHaveBeenCalledTimes(1));
+    // Every step's values reach the server, the skipped one included.
+    expect(dataSource.create.mock.calls[0][1]).toMatchObject({
+      subject: 'S1',
+      owner: 'Ada',
+      notes: 'S3',
+    });
+  });
+
+  it('leaves a conditionally-required field alone while its predicate is false', async () => {
+    const dataSource: any = {
+      ...makeDataSource(),
+      getObjectSchema: vi.fn().mockResolvedValue({
+        name: 'case',
+        fields: {
+          subject: { type: 'text', label: 'Subject' },
+          // Required only for escalated cases — the same canonical predicate the
+          // renderer and the server evaluate, so the gate must agree with them
+          // rather than demanding the field unconditionally.
+          owner: { type: 'text', label: 'Owner', requiredWhen: "record.subject == 'urgent'" },
+          notes: { type: 'text', label: 'Notes' },
+        },
+      }),
+    };
+    renderWizard({ allowSkip: true }, dataSource);
+
+    await waitFor(() => expect(document.body.querySelector('[data-field="subject"]')).toBeTruthy());
+    fill('subject', 'routine');
+    fireEvent.click(stepIndicator(2));
+    await waitFor(() => expect(document.body.querySelector('[data-field="notes"]')).toBeTruthy());
+    fill('notes', 'S3');
+    fireEvent.click(screen.getByRole('button', { name: /Create/i }));
+
+    await waitFor(() => expect(dataSource.create).toHaveBeenCalledTimes(1));
+    expect(stepIndicator(1)).not.toHaveAttribute('data-error');
+  });
+
+  it('still lets the sequential wizard submit (the gate is not a new blocker)', async () => {
+    const dataSource = renderWizard();
+
+    await waitFor(() => expect(document.body.querySelector('[data-field="subject"]')).toBeTruthy());
+    fill('subject', 'S1');
+    fireEvent.click(screen.getByRole('button', { name: /Next/i }));
+
+    await waitFor(() => expect(document.body.querySelector('[data-field="owner"]')).toBeTruthy());
+    fill('owner', 'Ada');
+    fireEvent.click(screen.getByRole('button', { name: /Next/i }));
+
+    await waitFor(() => expect(document.body.querySelector('[data-field="notes"]')).toBeTruthy());
+    fill('notes', 'S3');
+    fireEvent.click(screen.getByRole('button', { name: /Create/i }));
+
+    await waitFor(() => expect(dataSource.create).toHaveBeenCalledTimes(1));
+    expect(dataSource.create.mock.calls[0][1]).toMatchObject({
+      subject: 'S1',
+      owner: 'Ada',
+      notes: 'S3',
+    });
+  });
+});
+
+describe('WizardForm — the form view’s own `columns`', () => {
+  it('honours the view’s columns for every step', async () => {
+    renderWizard({ columns: 3 });
+
+    await waitFor(() => expect(document.body.querySelector('[data-field="subject"]')).toBeTruthy());
+    const grid = document.body.querySelector('[class*="@2xl:grid-cols-3"]');
+    expect(grid).not.toBeNull();
+
+    // The grid is sized with CONTAINER queries, so it needs a container ancestor
+    // to resolve against. Asserting only the class caught nothing: the browser
+    // showed a declared 2-column step still rendering single-column because the
+    // wizard's root carried no `@container`, leaving every `@md:`/`@2xl:` variant
+    // inert.
+    expect(grid!.closest('.\\@container')).not.toBeNull();
+  });
+
+  it('falls back to the step’s own columns when the view declares none', async () => {
+    render(
+      <WizardForm
+        schema={{
+          type: 'object-form',
+          formType: 'wizard',
+          objectName: 'case',
+          mode: 'create',
+          sections: [
+            { name: 's1', label: 'Step 1', columns: 2, fields: ['subject', 'owner'] },
+            { name: 's2', label: 'Step 2', fields: ['notes'] },
+          ],
+        }}
+        dataSource={makeDataSource()}
+      />,
+    );
+
+    await waitFor(() => expect(document.body.querySelector('[data-field="subject"]')).toBeTruthy());
+    expect(document.body.querySelector('[class*="@md:grid-cols-2"]')).not.toBeNull();
+    expect(document.body.querySelector('[class*="@2xl:grid-cols-3"]')).toBeNull();
+  });
+});