Now let me pass priority to the first few visible cards from the dashboard:

Added a priority prop to CourseCard that passes through to the Next.js <Image> component. The first 3 cards (the ones above the fold in most viewports) now have priority={true}, which sets loading="eager" and preloads the image, resolving the LCP warning.

Now let me read the remaining components to understand the full system:

Good, I have a full understanding of the codebase. Now I need to build a Moodle-style course detail view with:

1. Course video content (video player area with embedded video sections)
2. Course reading/text content sections
3. Quizzes (multiple choice, true/false, etc.)

This requires: expanding the types and data, building a course detail view, a video player component, a content viewer, a quiz component, and wiring navigation from course cards into the course detail view.

Let me start by expanding the types and data layer with full course module content:

Now expand the data with full module content for all 6 courses:

Now let me build the course detail view -- the main container with the course outline sidebar and content area:

Now let me build the three activity content components:

Now the quiz component -- the most complex piece with Moodle-style question-by-question flow, immediate feedback, and scoring:

Now I need to wire the navigation. The course cards' "Resume" / "Review" buttons need to open the course detail view, and the main page needs to handle the course view state. Let me update the page, dashboard, and course card:

Now update the Dashboard to accept the onOpenCourse callback:

Now update the course card to accept and use the onOpen callback:

Each course now has full Moodle-style content inside. Clicking "Resume" or "Review" on any course card opens a course detail view with a collapsible outline sidebar listing all modules and their activities (video, reading, quiz), each with completion tracking. The video player has custom playback controls with seek bar, mute, and fullscreen. The reading content renders formatted markdown-style articles with headers, tables, blockquotes, and a "read more" expand for long content. The quiz component follows a Moodle-like flow: intro screen with passing threshold info, one question at a time with immediate correct/incorrect feedback and explanations, a final results screen with score breakdown and per-question review, and a retry option if the passing score isn't met. Activities auto-advance on completion, and progress updates live in the course header.