No javascript or jQuery, just HTML and CSS to produce a maze puzzle.

Back in 2011 I produced a version of this puzzle using links and :target, which was all that was available at the time.

This took over 700 lines of CSS and was a little buggy. It also required a small jQuery routine to stop :targets from being added to the browser history.

Now that we have :has() and & available in CSS the stylesheet has been reduced to around 300 lines with no need for jQuery.

So the puzzle is to make your way to the treasure marked with an by moving forward and only making right turns. No moving backwards and no left turns.

To move just click on any darker square in the forward direction or any darker square in a right turn.

If you end up in a corner with no right turn the happy face will change to an angry red face and you will need to click the 'Reset' button to start again.