You are a site generator. Create a static, single-page course site with hash-based routing (e.g., /#/lesson/1) and a left sidebar “content ladder.” Do not upload large media into the repo; embed videos and link docs by URL. Keep the bundle lightweight (plain HTML/CSS/JS is fine).

Brand & Layout

Title/brand (top left of sidebar): Client Journey Mastery — Module 1

Left sidebar lists lessons 01–05. Active lesson shows highlighted state.

Main pane shows: H1 title → video player → “Download Worksheet” button(s) → Next/Prev buttons.

Theme: dark, clean, high contrast, large readable text, mobile friendly.

Store a “viewed” status per lesson in localStorage and show a ✅ in the sidebar for lessons the user has opened.

Behavior

Routing: single page app with hash routes: /#/lesson/1…/#/lesson/5, plus /#/resources.

Videos: each lesson embeds a Google Drive preview (iframe) using the /preview URL format.

Docs: open worksheet links in a new tab (target="_blank").

Prev/Next buttons move between lessons. On the last lesson, “Next” is disabled.

Optional access code: scaffold a simple access code check (front-end only). If ACCESS_CODE is empty, skip the gate.

Data (use exactly these titles, videos, and documents)

Note: Convert each “file/view” Drive link to /preview for the iframe source.
Pattern: https://drive.google.com/file/d/FILE_ID/preview

Module title: Fat Loss Fundamentals (Module 1)

Lessons (01–05):

Basal Metabolic Rate & Energy Expenditure
Video (Drive preview): https://drive.google.com/file/d/10kpjrXhvW91Ea2z4Z6Onu9NfiU2EIlWa/preview

Worksheet: https://docs.google.com/document/d/1-AaCUxmN-vp5rrmdhctpm2-0YfkkP2ytuYJDz39eoYA/edit?usp=drive_link

Why Do We Gain Fat?
Video (Drive preview): https://drive.google.com/file/d/1Y103LdQxY2QnUEavk91XK6ec15mR0iPp/preview

Worksheet: https://docs.google.com/document/d/1nuZcMARA8P1cnbASn_tgOqasA8GLQ1rAROs3TgXQlbU/edit?usp=drive_link

How Do We Lose Fat?
Video (Drive preview): https://drive.google.com/file/d/1GeN_yq_ol9jEUUvGySxodtAvi9_6d-Kr/preview

Worksheet: https://docs.google.com/document/d/1FLkHVFVAnH9lbIa_s1haaX8NnCqAcla9b7wvyzm7mBY/edit?usp=drive_link

Fat-Loss Exercise
Video (Drive preview): https://drive.google.com/file/d/1HM2S5LpXZ5_7dqeM_Osa3z1moxLyFLuU/preview

Worksheet: https://docs.google.com/document/d/1GLJ11aNGHGDFRltm3RpXVBNLtDD44RsupFeEh6lzR_4/edit?usp=drive_link

What Hinders Fat Loss
Video (Drive preview): https://drive.google.com/file/d/1YhhE0UIACQOPf0lzF1NevQj-W9142eIq/preview

Worksheet: https://docs.google.com/document/d/1l1DL2KOUqq2GXAyB2COaUwF7s_UIhWnlzw9qb37COA8/edit?usp=drive_link

Additional resources page (add to bottom of sidebar as “Resources”):

Resource A: https://docs.google.com/document/d/1rT_sQEOkcQqUXEzcIK7jBmK_yN0ZaqSxS7s1fFSghdc/edit?usp=drive_link

Resource B: https://docs.google.com/document/d/1RKctMkeo3XzEeuXeISGByOPZFGrwPQ0LBuwN5SlXzFs/edit?usp=drive_link

Implementation Notes

Data source: hardcode a small JS object like:

const ACCESS_CODE = ""; // set non-empty to enable gate
const LESSONS = [
{ n:1, title:"Basal Metabolic Rate & Energy Expenditure",
video:"https://drive.google.com/file/d/10kpjrXhvW91Ea2z4Z6Onu9NfiU2EIlWa/preview",
docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1-AaCUxmN-vp5rrmdhctpm2-0YfkkP2ytuYJDz39eoYA/edit?usp=drive_link"}]
},
{ n:2, title:"Why Do We Gain Fat?",
video:"https://drive.google.com/file/d/1Y103LdQxY2QnUEavk91XK6ec15mR0iPp/preview",
docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1nuZcMARA8P1cnbASn_tgOqasA8GLQ1rAROs3TgXQlbU/edit?usp=drive_link"}]
},
{ n:3, title:"How Do We Lose Fat?",
video:"https://drive.google.com/file/d/1GeN_yq_ol9jEUUvGySxodtAvi9_6d-Kr/preview",
docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1FLkHVFVAnH9lbIa_s1haaX8NnCqAcla9b7wvyzm7mBY/edit?usp=drive_link"}]
},
{ n:4, title:"Fat-Loss Exercise",
video:"https://drive.google.com/file/d/1HM2S5LpXZ5_7dqeM_Osa3z1moxLyFLuU/preview",
docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1GLJ11aNGHGDFRltm3RpXVBNLtDD44RsupFeEh6lzR_4/edit?usp=drive_link"}]
},
{ n:5, title:"What Hinders Fat Loss",
video:"https://drive.google.com/file/d/1YhhE0UIACQOPf0lzF1NevQj-W9142eIq/preview",
docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1l1DL2KOUqq2GXAyB2COaUwF7s_UIhWnlzw9qb37COA8/edit?usp=drive_link"}]
},
];
const EXTRA_DOCS = [
{label:"Resource A", url:"https://docs.google.com/document/d/1rT_sQEOkcQqUXEzcIK7jBmK_yN0ZaqSxS7s1fFSghdc/edit?usp=drive_link"},
{label:"Resource B", url:"https://docs.google.com/document/d/1RKctMkeo3XzEeuXeISGByOPZFGrwPQ0LBuwN5SlXzFs/edit?usp=drive_link"},
];


Video embed: use <iframe src=".../preview" allow="autoplay; fullscreen" allowfullscreen></iframe>.

Progress ticks: when a lesson route is opened, set localStorage.setItem('m1_viewed_'+n, '1'). On render, show ✅ for any lesson with this flag.

Accessibility: keyboard focus styles, sufficient color contrast, and aria-current="page" on the active lesson link.

Deliverables

A single static site (index.html + CSS + JS) or a Hugging Face Space (Static) project with the above behavior.

Clear README with instructions to change ACCESS_CODE and how to add Module 2 later by extending the same data structure. - Initial Deployment

README.md

@@ -1,10 +1,12 @@
 ---
-title: Plantedinnutrition
-emoji: 🦀
-colorFrom: blue
-colorTo: purple
+title: plantedinnutrition
+emoji: 🐳
+colorFrom: green
+colorTo: blue
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html

@@ -1,19 +1,377 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Client Journey Mastery — Module 1</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
+    <style>
+        :root {
+            --primary: #3b82f6;
+            --primary-dark: #2563eb;
+            --bg-dark: #0f172a;
+            --bg-light: #1e293b;
+            --text-light: #f8fafc;
+        }
+        body {
+            @apply bg-[var(--bg-dark)] text-[var(--text-light)] min-h-screen;
+            font-family: 'Inter', sans-serif;
+        }
+        .sidebar {
+            scrollbar-width: thin;
+            scrollbar-color: var(--bg-light) var(--bg-dark);
+        }
+        .sidebar::-webkit-scrollbar {
+            width: 6px;
+        }
+        .sidebar::-webkit-scrollbar-track {
+            background: var(--bg-dark);
+        }
+        .sidebar::-webkit-scrollbar-thumb {
+            background-color: var(--bg-light);
+            border-radius: 3px;
+        }
+        .video-container {
+            aspect-ratio: 16/9;
+        }
+        .lesson-link.active {
+            @apply bg-[var(--bg-light)] border-l-4 border-[var(--primary)];
+        }
+        .lesson-link:hover:not(.active) {
+            @apply bg-[var(--bg-light)] bg-opacity-50;
+        }
+        .btn-primary {
+            @apply bg-[var(--primary)] hover:bg-[var(--primary-dark)] text-white font-medium py-2 px-4 rounded transition;
+        }
+        .btn-outline {
+            @apply border border-[var(--primary)] text-[var(--primary)] hover:bg-[var(--primary)] hover:text-white font-medium py-2 px-4 rounded transition;
+        }
+        .btn-disabled {
+            @apply bg-gray-600 text-gray-400 cursor-not-allowed font-medium py-2 px-4 rounded;
+        }
+        .access-code-input {
+            @apply bg-[var(--bg-light)] border border-gray-600 rounded px-4 py-2 text-white focus:outline-none focus:ring-2 focus:ring-[var(--primary)];
+        }
+    </style>
+</head>
+<body class="flex flex-col md:flex-row">
+    <!-- Sidebar -->
+    <div class="sidebar w-full md:w-64 bg-[var(--bg-dark)] border-r border-gray-800 h-screen overflow-y-auto fixed md:static">
+        <div class="p-4 border-b border-gray-800">
+            <h1 class="text-xl font-bold">Client Journey Mastery</h1>
+            <p class="text-sm text-gray-400">Module 1: Fat Loss Fundamentals</p>
+        </div>
+        <nav class="p-2">
+            <ul class="space-y-1" id="lessons-list">
+                <!-- Lessons will be populated by JS -->
+            </ul>
+            <div class="mt-8 p-2">
+                <a href="#/resources" class="flex items-center text-gray-400 hover:text-white transition">
+                    <i data-feather="book" class="w-5 h-5 mr-2"></i>
+                    <span>Resources</span>
+                </a>
+            </div>
+        </nav>
+    </div>
+
+    <!-- Main Content -->
+    <main class="flex-1 md:ml-64 p-4 md:p-8" id="main-content">
+        <!-- Access Code Gate (if enabled) -->
+        <div id="access-gate" class="max-w-md mx-auto mt-20 p-8 bg-[var(--bg-light)] rounded-lg shadow-lg hidden">
+            <h2 class="text-2xl font-bold mb-6 text-center">Enter Access Code</h2>
+            <div class="space-y-4">
+                <input type="password" id="access-code-input" placeholder="Enter access code" class="access-code-input w-full">
+                <button id="submit-code" class="btn-primary w-full">Continue</button>
+            </div>
+            <p id="code-error" class="text-red-400 text-sm mt-2 hidden">Invalid access code</p>
+        </div>
+
+        <!-- Lesson Content -->
+        <div id="lesson-content" class="max-w-4xl mx-auto hidden">
+            <h1 id="lesson-title" class="text-3xl font-bold mb-6"></h1>
+            
+            <div class="video-container mb-8 bg-black rounded-lg overflow-hidden">
+                <iframe id="lesson-video" class="w-full h-full" frameborder="0" allowfullscreen></iframe>
+            </div>
+            
+            <div id="lesson-docs" class="mb-8 space-y-2">
+                <!-- Worksheets will be populated by JS -->
+            </div>
+            
+            <div class="flex justify-between mt-8">
+                <button id="prev-lesson" class="btn-outline">Previous</button>
+                <button id="next-lesson" class="btn-primary">Next</button>
+            </div>
+        </div>
+
+        <!-- Resources Content -->
+        <div id="resources-content" class="max-w-4xl mx-auto hidden">
+            <h1 class="text-3xl font-bold mb-6">Additional Resources</h1>
+            <div id="resources-list" class="space-y-4">
+                <!-- Resources will be populated by JS -->
+            </div>
+        </div>
+    </main>
+
+    <script>
+        // Data
+        const ACCESS_CODE = ""; // set non-empty to enable gate
+        const LESSONS = [
+            { 
+                n:1, 
+                title:"Basal Metabolic Rate & Energy Expenditure",
+                video:"https://drive.google.com/file/d/10kpjrXhvW91Ea2z4Z6Onu9NfiU2EIlWa/preview",
+                docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1-AaCUxmN-vp5rrmdhctpm2-0YfkkP2ytuYJDz39eoYA/edit?usp=drive_link"}]
+            },
+            { 
+                n:2, 
+                title:"Why Do We Gain Fat?",
+                video:"https://drive.google.com/file/d/1Y103LdQxY2QnUEavk91XK6ec15mR0iPp/preview",
+                docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1nuZcMARA8P1cnbASn_tgOqasA8GLQ1rAROs3TgXQlbU/edit?usp=drive_link"}]
+            },
+            { 
+                n:3, 
+                title:"How Do We Lose Fat?",
+                video:"https://drive.google.com/file/d/1GeN_yq_ol9jEUUvGySxodtAvi9_6d-Kr/preview",
+                docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1FLkHVFVAnH9lbIa_s1haaX8NnCqAcla9b7wvyzm7mBY/edit?usp=drive_link"}]
+            },
+            { 
+                n:4, 
+                title:"Fat-Loss Exercise",
+                video:"https://drive.google.com/file/d/1HM2S5LpXZ5_7dqeM_Osa3z1moxLyFLuU/preview",
+                docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1GLJ11aNGHGDFRltm3RpXVBNLtDD44RsupFeEh6lzR_4/edit?usp=drive_link"}]
+            },
+            { 
+                n:5, 
+                title:"What Hinders Fat Loss",
+                video:"https://drive.google.com/file/d/1YhhE0UIACQOPf0lzF1NevQj-W9142eIq/preview",
+                docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1l1DL2KOUqq2GXAyB2COaUwF7s_UIhWnlzw9qb37COA8/edit?usp=drive_link"}]
+            },
+        ];
+        const EXTRA_DOCS = [
+            {label:"Resource A", url:"https://docs.google.com/document/d/1rT_sQEOkcQqUXEzcIK7jBmK_yN0ZaqSxS7s1fFSghdc/edit?usp=drive_link"},
+            {label:"Resource B", url:"https://docs.google.com/document/d/1RKctMkeo3XzEeuXeISGByOPZFGrwPQ0LBuwN5SlXzFs/edit?usp=drive_link"},
+        ];
+
+        // DOM Elements
+        const lessonsList = document.getElementById('lessons-list');
+        const mainContent = document.getElementById('main-content');
+        const lessonContent = document.getElementById('lesson-content');
+        const resourcesContent = document.getElementById('resources-content');
+        const accessGate = document.getElementById('access-gate');
+        const lessonTitle = document.getElementById('lesson-title');
+        const lessonVideo = document.getElementById('lesson-video');
+        const lessonDocs = document.getElementById('lesson-docs');
+        const resourcesList = document.getElementById('resources-list');
+        const prevLessonBtn = document.getElementById('prev-lesson');
+        const nextLessonBtn = document.getElementById('next-lesson');
+        const accessCodeInput = document.getElementById('access-code-input');
+        const submitCodeBtn = document.getElementById('submit-code');
+        const codeError = document.getElementById('code-error');
+
+        // State
+        let currentLesson = 1;
+
+        // Initialize
+        function init() {
+            renderLessonsList();
+            
+            if (ACCESS_CODE) {
+                showAccessGate();
+            } else {
+                handleRouting();
+            }
+            
+            window.addEventListener('hashchange', handleRouting);
+            prevLessonBtn.addEventListener('click', goToPrevLesson);
+            nextLessonBtn.addEventListener('click', goToNextLesson);
+            submitCodeBtn.addEventListener('click', checkAccessCode);
+            
+            feather.replace();
+        }
+
+        // Show access code gate
+        function showAccessGate() {
+            accessGate.classList.remove('hidden');
+            lessonContent.classList.add('hidden');
+            resourcesContent.classList.add('hidden');
+        }
+
+        // Check access code
+        function checkAccessCode() {
+            if (accessCodeInput.value === ACCESS_CODE) {
+                accessGate.classList.add('hidden');
+                handleRouting();
+            } else {
+                codeError.classList.remove('hidden');
+            }
+        }
+
+        // Handle routing
+        function handleRouting() {
+            const hash = window.location.hash;
+            
+            if (hash.startsWith('#/lesson/')) {
+                const lessonNum = parseInt(hash.split('/')[2]);
+                if (lessonNum >= 1 && lessonNum <= LESSONS.length) {
+                    showLesson(lessonNum);
+                } else {
+                    showLesson(1);
+                }
+            } else if (hash === '#/resources') {
+                showResources();
+            } else {
+                showLesson(1);
+            }
+        }
+
+        // Show lesson
+        function showLesson(lessonNum) {
+            currentLesson = lessonNum;
+            const lesson = LESSONS[lessonNum - 1];
+            
+            // Update URL
+            window.location.hash = `/lesson/${lessonNum}`;
+            
+            // Mark as viewed
+            localStorage.setItem(`m1_viewed_${lessonNum}`, '1');
+            updateLessonStatus(lessonNum);
+            
+            // Update UI
+            lessonTitle.textContent = `${lessonNum.toString().padStart(2, '0')}. ${lesson.title}`;
+            lessonVideo.src = lesson.video;
+            
+            // Render worksheets
+            lessonDocs.innerHTML = '';
+            lesson.docs.forEach(doc => {
+                const docElement = document.createElement('a');
+                docElement.href = doc.url;
+                docElement.target = "_blank";
+                docElement.className = "inline-flex items-center btn-outline mr-2 mb-2";
+                docElement.innerHTML = `<i data-feather="download" class="w-4 h-4 mr-2"></i>${doc.label}`;
+                lessonDocs.appendChild(docElement);
+            });
+            
+            // Update navigation buttons
+            prevLessonBtn.disabled = lessonNum === 1;
+            nextLessonBtn.disabled = lessonNum === LESSONS.length;
+            
+            if (lessonNum === 1) {
+                prevLessonBtn.className = "btn-disabled";
+            } else {
+                prevLessonBtn.className = "btn-outline";
+            }
+            
+            if (lessonNum === LESSONS.length) {
+                nextLessonBtn.className = "btn-disabled";
+            } else {
+                nextLessonBtn.className = "btn-primary";
+            }
+            
+            // Show content
+            lessonContent.classList.remove('hidden');
+            resourcesContent.classList.add('hidden');
+            
+            feather.replace();
+        }
+
+        // Show resources
+        function showResources() {
+            window.location.hash = '/resources';
+            
+            // Render resources
+            resourcesList.innerHTML = '';
+            EXTRA_DOCS.forEach(doc => {
+                const docElement = document.createElement('a');
+                docElement.href = doc.url;
+                docElement.target = "_blank";
+                docElement.className = "flex items-center p-4 bg-[var(--bg-light)] rounded-lg hover:bg-opacity-80 transition";
+                docElement.innerHTML = `
+                    <div class="bg-[var(--primary)] bg-opacity-10 p-3 rounded-full mr-4">
+                        <i data-feather="file-text" class="text-[var(--primary)]"></i>
+                    </div>
+                    <div>
+                        <h3 class="font-medium">${doc.label}</h3>
+                        <p class="text-sm text-gray-400">Google Document</p>
+                    </div>
+                    <div class="ml-auto">
+                        <i data-feather="external-link" class="text-gray-400"></i>
+                    </div>
+                `;
+                resourcesList.appendChild(docElement);
+            });
+            
+            // Show content
+            lessonContent.classList.add('hidden');
+            resourcesContent.classList.remove('hidden');
+            
+            feather.replace();
+        }
+
+        // Navigation functions
+        function goToPrevLesson() {
+            if (currentLesson > 1) {
+                showLesson(currentLesson - 1);
+            }
+        }
+
+        function goToNextLesson() {
+            if (currentLesson < LESSONS.length) {
+                showLesson(currentLesson + 1);
+            }
+        }
+
+        // Render lessons list
+        function renderLessonsList() {
+            lessonsList.innerHTML = '';
+            
+            LESSONS.forEach(lesson => {
+                const viewed = localStorage.getItem(`m1_viewed_${lesson.n}`);
+                
+                const li = document.createElement('li');
+                li.innerHTML = `
+                    <a href="#/lesson/${lesson.n}" 
+                       class="lesson-link flex items-center p-3 rounded-md ${window.location.hash === `#/lesson/${lesson.n}` ? 'active' : ''}"
+                       ${window.location.hash === `#/lesson/${lesson.n}` ? 'aria-current="page"' : ''}>
+                        <span class="text-gray-400 w-6">${lesson.n.toString().padStart(2, '0')}</span>
+                        <span class="flex-1">${lesson.title}</span>
+                        ${viewed ? '<i data-feather="check" class="text-green-400 w-4 h-4"></i>' : ''}
+                    </a>
+                `;
+                
+                lessonsList.appendChild(li);
+            });
+            
+            feather.replace();
+        }
+
+        // Update lesson status in sidebar
+        function updateLessonStatus(lessonNum) {
+            const lessonLinks = document.querySelectorAll('.lesson-link');
+            lessonLinks.forEach(link => {
+                link.classList.remove('active');
+                link.removeAttribute('aria-current');
+                
+                if (link.getAttribute('href') === `#/lesson/${lessonNum}`) {
+                    link.classList.add('active');
+                    link.setAttribute('aria-current', 'page');
+                    
+                    // Add checkmark if not already present
+                    if (!link.querySelector('i[data-feather="check"]')) {
+                        const checkIcon = document.createElement('i');
+                        checkIcon.setAttribute('data-feather', 'check');
+                        checkIcon.className = 'text-green-400 w-4 h-4';
+                        link.appendChild(checkIcon);
+                    }
+                }
+            });
+            
+            feather.replace();
+        }
+
+        // Initialize the app
+        init();
+    </script>
+</body>
 </html>

prompts.txt

@@ -0,0 +1,110 @@
+You are a site generator. Create a static, single-page course site with hash-based routing (e.g., /#/lesson/1) and a left sidebar “content ladder.” Do not upload large media into the repo; embed videos and link docs by URL. Keep the bundle lightweight (plain HTML/CSS/JS is fine).
+
+Brand & Layout
+
+Title/brand (top left of sidebar): Client Journey Mastery — Module 1
+
+Left sidebar lists lessons 01–05. Active lesson shows highlighted state.
+
+Main pane shows: H1 title → video player → “Download Worksheet” button(s) → Next/Prev buttons.
+
+Theme: dark, clean, high contrast, large readable text, mobile friendly.
+
+Store a “viewed” status per lesson in localStorage and show a ✅ in the sidebar for lessons the user has opened.
+
+Behavior
+
+Routing: single page app with hash routes: /#/lesson/1…/#/lesson/5, plus /#/resources.
+
+Videos: each lesson embeds a Google Drive preview (iframe) using the /preview URL format.
+
+Docs: open worksheet links in a new tab (target="_blank").
+
+Prev/Next buttons move between lessons. On the last lesson, “Next” is disabled.
+
+Optional access code: scaffold a simple access code check (front-end only). If ACCESS_CODE is empty, skip the gate.
+
+Data (use exactly these titles, videos, and documents)
+
+Note: Convert each “file/view” Drive link to /preview for the iframe source.
+Pattern: https://drive.google.com/file/d/FILE_ID/preview
+
+Module title: Fat Loss Fundamentals (Module 1)
+
+Lessons (01–05):
+
+Basal Metabolic Rate & Energy Expenditure
+Video (Drive preview): https://drive.google.com/file/d/10kpjrXhvW91Ea2z4Z6Onu9NfiU2EIlWa/preview
+
+Worksheet: https://docs.google.com/document/d/1-AaCUxmN-vp5rrmdhctpm2-0YfkkP2ytuYJDz39eoYA/edit?usp=drive_link
+
+Why Do We Gain Fat?
+Video (Drive preview): https://drive.google.com/file/d/1Y103LdQxY2QnUEavk91XK6ec15mR0iPp/preview
+
+Worksheet: https://docs.google.com/document/d/1nuZcMARA8P1cnbASn_tgOqasA8GLQ1rAROs3TgXQlbU/edit?usp=drive_link
+
+How Do We Lose Fat?
+Video (Drive preview): https://drive.google.com/file/d/1GeN_yq_ol9jEUUvGySxodtAvi9_6d-Kr/preview
+
+Worksheet: https://docs.google.com/document/d/1FLkHVFVAnH9lbIa_s1haaX8NnCqAcla9b7wvyzm7mBY/edit?usp=drive_link
+
+Fat-Loss Exercise
+Video (Drive preview): https://drive.google.com/file/d/1HM2S5LpXZ5_7dqeM_Osa3z1moxLyFLuU/preview
+
+Worksheet: https://docs.google.com/document/d/1GLJ11aNGHGDFRltm3RpXVBNLtDD44RsupFeEh6lzR_4/edit?usp=drive_link
+
+What Hinders Fat Loss
+Video (Drive preview): https://drive.google.com/file/d/1YhhE0UIACQOPf0lzF1NevQj-W9142eIq/preview
+
+Worksheet: https://docs.google.com/document/d/1l1DL2KOUqq2GXAyB2COaUwF7s_UIhWnlzw9qb37COA8/edit?usp=drive_link
+
+Additional resources page (add to bottom of sidebar as “Resources”):
+
+Resource A: https://docs.google.com/document/d/1rT_sQEOkcQqUXEzcIK7jBmK_yN0ZaqSxS7s1fFSghdc/edit?usp=drive_link
+
+Resource B: https://docs.google.com/document/d/1RKctMkeo3XzEeuXeISGByOPZFGrwPQ0LBuwN5SlXzFs/edit?usp=drive_link
+
+Implementation Notes
+
+Data source: hardcode a small JS object like:
+
+const ACCESS_CODE = ""; // set non-empty to enable gate
+const LESSONS = [
+  { n:1, title:"Basal Metabolic Rate & Energy Expenditure",
+    video:"https://drive.google.com/file/d/10kpjrXhvW91Ea2z4Z6Onu9NfiU2EIlWa/preview",
+    docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1-AaCUxmN-vp5rrmdhctpm2-0YfkkP2ytuYJDz39eoYA/edit?usp=drive_link"}]
+  },
+  { n:2, title:"Why Do We Gain Fat?",
+    video:"https://drive.google.com/file/d/1Y103LdQxY2QnUEavk91XK6ec15mR0iPp/preview",
+    docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1nuZcMARA8P1cnbASn_tgOqasA8GLQ1rAROs3TgXQlbU/edit?usp=drive_link"}]
+  },
+  { n:3, title:"How Do We Lose Fat?",
+    video:"https://drive.google.com/file/d/1GeN_yq_ol9jEUUvGySxodtAvi9_6d-Kr/preview",
+    docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1FLkHVFVAnH9lbIa_s1haaX8NnCqAcla9b7wvyzm7mBY/edit?usp=drive_link"}]
+  },
+  { n:4, title:"Fat-Loss Exercise",
+    video:"https://drive.google.com/file/d/1HM2S5LpXZ5_7dqeM_Osa3z1moxLyFLuU/preview",
+    docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1GLJ11aNGHGDFRltm3RpXVBNLtDD44RsupFeEh6lzR_4/edit?usp=drive_link"}]
+  },
+  { n:5, title:"What Hinders Fat Loss",
+    video:"https://drive.google.com/file/d/1YhhE0UIACQOPf0lzF1NevQj-W9142eIq/preview",
+    docs:[{label:"Worksheet", url:"https://docs.google.com/document/d/1l1DL2KOUqq2GXAyB2COaUwF7s_UIhWnlzw9qb37COA8/edit?usp=drive_link"}]
+  },
+];
+const EXTRA_DOCS = [
+  {label:"Resource A", url:"https://docs.google.com/document/d/1rT_sQEOkcQqUXEzcIK7jBmK_yN0ZaqSxS7s1fFSghdc/edit?usp=drive_link"},
+  {label:"Resource B", url:"https://docs.google.com/document/d/1RKctMkeo3XzEeuXeISGByOPZFGrwPQ0LBuwN5SlXzFs/edit?usp=drive_link"},
+];
+
+
+Video embed: use <iframe src=".../preview" allow="autoplay; fullscreen" allowfullscreen></iframe>.
+
+Progress ticks: when a lesson route is opened, set localStorage.setItem('m1_viewed_'+n, '1'). On render, show ✅ for any lesson with this flag.
+
+Accessibility: keyboard focus styles, sufficient color contrast, and aria-current="page" on the active lesson link.
+
+Deliverables
+
+A single static site (index.html + CSS + JS) or a Hugging Face Space (Static) project with the above behavior.
+
+Clear README with instructions to change ACCESS_CODE and how to add Module 2 later by extending the same data structure.