Restructure blogs as Astro monorepo

sites/puzzles/src/components/problems/README.md

@@ -0,0 +1,116 @@
+# 100 Prisoners Problem - Interactive Blog Post
+
+This directory contains the interactive React components for the "100 Prisoners Problem" blog post, inspired by the interactive style of Nicky Case's explorable explanations.
+
+## Files Created
+
+### Blog Post
+
+- **`src/content/puzzles/100-prisoners.mdx`** - The main blog post with embedded interactive components
+
+### Interactive Components
+
+1. **`PrisonerGameSimulator.tsx`** - Interactive game simulation
+   - Allows users to play the prisoner game themselves
+   - Adjustable number of prisoners (5-100)
+   - Manual box clicking to experience the problem
+   - Visual feedback for success/failure
+   - Tracks current prisoner and attempts remaining
+
+2. **`ProbabilityChart.tsx`** - Probability visualization
+   - Shows probability curves for naive and loop strategies
+   - Uses logarithmic scale for naive strategy (values get extremely small)
+   - Interactive SVG chart with proper axes and labels
+   - Includes explanatory text
+
+3. **`PermutationExplorer.tsx`** - Cycle structure explorer
+   - Generates all permutations for n ∈ {3, 4, 5}
+   - Displays both standard and cycle notation
+   - Filter by presence of long cycles (> n/2)
+   - Color-coded display (red for long cycles, green for short)
+   - Shows statistics about cycle length distribution
+
+4. **`StrategyComparison.tsx`** - Side-by-side strategy comparison
+   - Compares naive vs. loop strategy on same chart
+   - Shows probabilities up to n=100
+   - Includes detailed numerical breakdown
+   - Highlights the key 31.18% result at n=100
+
+## Features
+
+All components are:
+
+- ✅ Fully interactive with React hooks
+- ✅ Styled with Tailwind CSS classes
+- ✅ Responsive for mobile and desktop
+- ✅ Self-contained with no external dependencies beyond React
+- ✅ Client-side only (using `client:only="react"` in Astro)
+
+## How It Works
+
+### The Problem
+
+100 prisoners must each find their own number among 100 boxes by opening at most 50 boxes. If all prisoners succeed, they go free. They can agree on a strategy beforehand but cannot communicate during the challenge.
+
+### The Naive Strategy
+
+Each prisoner opens 50 random boxes. Probability of success: (1/2)^100 ≈ 0%
+
+### The Clever Strategy (Loop Following)
+
+1. Open the box with your own number
+2. Look at the number inside
+3. Open the box with that number
+4. Repeat until you find your number
+
+This exploits the cycle structure of permutations. Success probability: ~31.18%!
+
+### Key Mathematical Insight
+
+The prisoners succeed if and only if the permutation of numbers in boxes has no cycle longer than n/2. For n=100, the probability of this is:
+
+P(success) = 1 - Σ(1/k) for k=51 to 100 ≈ 0.3118
+
+As n→∞, this converges to 1 - ln(2) ≈ 0.3069.
+
+## Usage in MDX
+
+The components are imported and used like this:
+
+\`\`\`mdx
+import PrisonerGameSimulator from '@/components/problems/PrisonerGameSimulator.tsx';
+import ProbabilityChart from '@/components/problems/ProbabilityChart.tsx';
+import PermutationExplorer from '@/components/problems/PermutationExplorer.tsx';
+import StrategyComparison from '@/components/problems/StrategyComparison.tsx';
+
+<PrisonerGameSimulator client:only="react" />
+<ProbabilityChart strategy="naive" client:only="react" />
+<PermutationExplorer client:only="react" />
+<StrategyComparison client:only="react" />
+\`\`\`
+
+## Design Philosophy
+
+Inspired by Nicky Case's "Parable of the Polygons", these components aim to:
+
+- Make abstract mathematical concepts tangible through interaction
+- Allow readers to explore and discover patterns themselves
+- Provide immediate visual feedback
+- Balance playfulness with mathematical rigor
+- Guide understanding through progressive disclosure
+
+## Future Enhancements
+
+Potential additions:
+
+- Auto-play mode for the game simulator using the loop strategy
+- Animation showing cycle formation in real-time
+- Monte Carlo simulation running multiple trials
+- Variant problems (different box-opening rules, malicious director, etc.)
+- 3D visualization of cycle structures for larger n
+
+## References
+
+- [Wikipedia: 100 Prisoners Problem](https://en.wikipedia.org/wiki/100_prisoners_problem)
+- [Nicky Case's Explorable Explanations](https://ncase.me/)
+- Original problem: Gál & Miltersen (2003)