Add Pinwheel Clause support for zone-based encounters in route groups

Allows each sub-zone within a route group to have its own independent
encounter when the Pinwheel Clause rule is enabled (default on), instead
of the entire group sharing a single encounter.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/components/admin/RouteFormModal.tsx

@@ -13,10 +13,17 @@ interface RouteFormModalProps {
 export function RouteFormModal({ route, nextOrder, onSubmit, onClose, isSubmitting }: RouteFormModalProps) {
   const [name, setName] = useState(route?.name ?? '')
   const [order, setOrder] = useState(String(route?.order ?? nextOrder ?? 0))
+  const [pinwheelZone, setPinwheelZone] = useState(
+    route?.pinwheelZone != null ? String(route.pinwheelZone) : ''
+  )
 
   const handleSubmit = (e: FormEvent) => {
     e.preventDefault()
-    onSubmit({ name, order: Number(order) })
+    onSubmit({
+      name,
+      order: Number(order),
+      pinwheelZone: pinwheelZone !== '' ? Number(pinwheelZone) : null,
+    })
   }
 
   return (
@@ -47,6 +54,20 @@ export function RouteFormModal({ route, nextOrder, onSubmit, onClose, isSubmitti
           className="w-full px-3 py-2 border rounded-md dark:bg-gray-700 dark:border-gray-600"
         />
       </div>
+      <div>
+        <label className="block text-sm font-medium mb-1">Pinwheel Zone</label>
+        <input
+          type="number"
+          min={0}
+          value={pinwheelZone}
+          onChange={(e) => setPinwheelZone(e.target.value)}
+          placeholder="None"
+          className="w-full px-3 py-2 border rounded-md dark:bg-gray-700 dark:border-gray-600"
+        />
+        <p className="text-xs text-gray-500 dark:text-gray-400 mt-1">
+          Routes in the same zone share an encounter when the Pinwheel Clause is active
+        </p>
+      </div>
     </FormModal>
   )
 }