Polish: imperial, clear-bed, keyboard nudging, empty states (#18)

Co-authored-by: Steve Dudenhoeffer <[email protected]>

web/src/editor/PlopMarker.tsx

@@ -37,6 +37,9 @@ export const PlopMarker = memo(function PlopMarker({
   const showIcon = scale >= SEMANTIC_FAR && !!plant?.icon
   const showText = scale >= SEMANTIC_NEAR && !!plant
   const count = plop.count ?? (plant ? computeDerivedCount(plop.radiusCm, plant.spacingCm) : plop.derivedCount)
+  // Keep the tap target at least ~44px across even when the plop draws tiny at
+  // low zoom (fill=transparent still receives pointer events, unlike fill=none).
+  const hitR = Math.max(r, 22 / scale)
 
   function down(e: PointerEvent) {
     e.stopPropagation()
@@ -45,6 +48,7 @@ export const PlopMarker = memo(function PlopMarker({
 
   return (
     <g transform={`translate(${plop.xCm} ${plop.yCm})`} onPointerDown={down} style={{ cursor: 'pointer' }}>
+      <circle cx={0} cy={0} r={hitR} fill="transparent" />
       <circle
         cx={0}
         cy={0}