**CRITICAL**: Strict Mobile-First SPA Layout (Max 540px).
**Structure**:
1. **Root**: ``
2. **Head**:
- Meta tags (viewport, charset, etc.).
- Tailwind CSS CDN.
- FontAwesome CDN.
- Custom Font (e.g., Inter, Roboto).
- **Global Scripts (Head)**: ``
- Style: `body { font-family: 'Inter', sans-serif; }`
3. **Body**: `body` class `bg-[#eff6ff] text-[#1e3a8a] min-h-screen overflow-x-hidden antialiased selection:bg-[#1d4ed8] selection:text-white flex flex-col`.
``
- **Background Layers (MUST be fixed/absolute z-0)**:
- **Base Gradient**: `div` class `fixed inset-0 z-0 bg-gradient-to-b from-[#eff6ff] via-[#ffffff] to-[#eff6ff] pointer-events-none`.
- **Theme Glow**: `div` class `fixed top-0 left-1/2 -translate-x-1/2 w-full max-w-[540px] h-[500px] bg-[radial-gradient(circle_at_center,#1d4ed830,transparent_70%)] blur-[80px] opacity-40 pointer-events-none`.
- **Accent Blur**: `div` class `fixed bottom-0 right-0 w-[300px] h-[300px] bg-[#1d4ed8]/10 rounded-full blur-[100px] pointer-events-none`.
- **Grid Pattern**: `div` class `fixed inset-0 z-0 opacity-[0.05] pointer-events-none bg-[linear-gradient(rgba(255,255,255,0.05)_1px,transparent_1px),linear-gradient(90deg,rgba(255,255,255,0.05)_1px,transparent_1px)] bg-[size:20px_20px]`.
- **App Container (MUST be the ONLY interactive root element)**:
- `main` id `app` class `relative z-10 w-full max-w-[540px] mx-auto min-h-screen bg-[#eff6ff]/95 shadow-[0_0_50px_rgba(0,0,0,0.5)] border-x border-[#bfdbfe]/20 flex flex-col`.
- **Top Highlight**: `div` class `absolute top-0 left-0 right-0 h-[1px] bg-gradient-to-r from-transparent via-[#1d4ed8] to-transparent opacity-50`.
- **Content Injection**: `
`, `` goes HERE inside `#app`.
- **Script Injection**:
- **Global JS**: Include `
` at the end of `body`. (NOTE: Use `global_scripts_body` placeholder instead of hardcoded script tag).
- **Game Scripts**: Include `` placeholder at the end of `body`.
**Constraints**:
- **STRICT DOM STRUCTURE**: `` MUST ONLY contain the background `div`s and ONE `