Why my UserControl with a template of a Path is not properly clickable?

I created a class derived from UserControl, directly on code (without XAML), and defined a ControlTemplate in a ResourceDictionary. This control template is a pair of ellipses, as follows:

<ControlTemplate x:Key="MusclePositionControlTemplate" TargetType="{x:Type local:MusclePositionControl}">
    <ControlTemplate.Resources>
        <EllipseGeometry x:Key="bolinha" RadiusX="{StaticResource radius}" RadiusY="{StaticResource radius}">
            <EllipseGeometry.Center>
                <Point X="0" Y="{StaticResource distance}"/>
            </EllipseGeometry.Center>
        </EllipseGeometry>                      
    </ControlTemplate.Resources>
        <Path Fill="#9900ffff" StrokeThickness="1" Stroke="Black">
            <Path.Data>
                <GeometryGroup>
                    <StaticResource ResourceKey="bolinha"/>
                    <GeometryGroup>
                        <GeometryGroup.Transform>
                            <ScaleTransform ScaleY="-1"/>
                        </GeometryGroup.Transform>
                        <StaticResource ResourceKey="bolinha"/>
                    </GeometryGroup>
                </GeometryGroup>                                
            </Path.Data>        
            <Path.RenderTransform>
                <TransformGroup>
                    <RotateTransform Angle="{Binding Angle, RelativeSource={RelativeSource Mode=TemplatedParent}}"/>
                    <TranslateTransform
                        X="{Binding X, RelativeSource={RelativeSource Mode=TemplatedParent}}"
                        Y="{Binding Y, RelativeSource={RelativeSource Mode=TemplatedParent}}"/>
                </TransformGroup>               
            </Path.RenderTransform>
        </Path>
</ControlTemplate>

When I edit this template in Blend, I can select the path clicking on it, and it displays its outlines like this:

But when I add the actual control to a canvas, with its X, Y and Angle properties set to some value, the control renders itself fine, but its defining geometry keeps being that of a rectangle at the origin, and this affects hit testing (I cannot select at design time, or click at runtime, by clicking at the shape itself):

So my questions are:

1. How should I create a ControlTemplate using a Path as "root" visual element, so that the clickable area of the control is that Path?
2. Assuming a Path should not or could not be used as root visual for a ControlTemplate, how should I achieve the same end result?