test 3

Role: Senior Front-End Developer. Objective: Create a a tablet-based Dyslexia Intervention App prototype. CRITICAL INFRASTRUCTURE INSTRUCTIONS: To satisfy the preview requirements, you MUST provide a package.json file. However, to avoid build errors, DO NOT use Vite, PostCSS, or any build-step plugins. Please provide exactly these two files: File 1: package.json Provide a bare-bones package.json with only the name and version. Do NOT add any dependencies or build scripts. { "name": "dyslexia-app-demo", "version": "1.0.0", "scripts": { "start": "echo 'Static HTML preview'" } } File 2: index.html Put the entire application in this single file. Styling: Use the Tailwind CSS Play CDN: <script src="https://cdn.tailwindcss.com"></script>. Logic: Use Vue.js 3 (via CDN) for the interactivity so no compilation is needed. Design: Background: Soft Cream (#FDFBF7). Font: Use Comic Sans MS, Andika, or Lexend. Layout: Tablet Landscape. Screens to implement (in one file using Vue v-if): Home Hub: 4 large, tactile, colorful circular buttons (🔊 Letter Sounds, 🦘 Syllable Jump, 🧱 Word Builder, 📖 Story Time). Reading Page: A "Sentence Chunking" area where a sentence is split into clickable word-chips that highlight yellow and log to the console when clicked. Settings: A simple button to toggle background colors (Cream, Blue, Green). Final Requirement: Ensure the index.html is the entry point. Do not add any other folders or configuration files.