feat: clarify PMO01 learning flow and polish learner UX

[tim8es]

Goal

Remove learner-facing ambiguity and make the reference prototype easier to use before the M01 cohort validation.

Changes

• one explicit primary learning path: lesson → practice → completion → next lesson
• visible completion gate and progress state instead of a transient toast-only failure
• completion advances to the next lesson
• course/module navigation points to the first unfinished lesson
• diagnostics reframed as optional self-check rather than an alternate course path
• learner-facing M01 validation CTA hidden from the normal course path; direct validation route remains available for research
• lighter premium visual system using native system fonts and restrained motion/shadows
• simplified M01 learner copy via isolated content overrides
• clearer navigation labels: Home / Learning path / Self-check / Templates

Verification

• RED: CI #79 reproduced all three new learning-flow expectations as failures
• GREEN: CI #80 passed the functional fix
• integration: CI #83 passed with design/content integration
• clean gh-pages deploy created separately after GREEN; no tests or feature-branch files copied into Pages beyond production assets

Scope

• main unchanged
• telemetry unchanged
• no PR merged
• content simplification intentionally limited to M01 pending validation of the direction

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 976f80c893

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[chatgpt-codex-connector]

Align the mobile breakpoint with the hidden sidebar

At viewport widths from 761px through 820px, styles.css already hides .sidebar and enables the mobile header, but this override does not reset main until 760px. Because v1-1.css is loaded last, its desktop main { margin-left: var(--sidebar) } wins in that range, leaving a blank 220px gutter and squeezing every page into the remaining width. Use the same 820px breakpoint for the sidebar and main-layout overrides.

Useful? React with 👍 / 👎.