[ndthanhdev]

Summary

Adds a handbook section to the website, with tree-style navigation and an "On this page" heading tree, and makes code blocks readable in light mode.

Handbook

• New /handbook section built from MDX in apps/app/content/handbook/. Pages live in three sections (Concepts, How-tos, How it works) at /handbook/<section>/<page>. They're placeholders for now ("To be written.").
• Layout:
  • Left: a section tree (@mui/x-tree-view v8, the last major that supports MUI 5).
  • Middle: the page content.
  • Right: an "On this page" tree of h2 and h3 headings that follows scrolling.
  • Both trees open fully on every page.
• On smaller screens, hidden columns move into a bottom tab bar ("Contents" and "On this page"). Each tab opens its tree in a drawer.
• MDX headings get anchor ids through gatsby-remark-autolink-headers. Posts are unchanged visually.
• A "handbook" header tab is added. On phones, the about, projects and handbook tabs move into the hamburger menu so the header fits.
• A Handbook card is added to the Projects page.

Light-mode code colors

• Light mode code blocks use a soft grey background with a border and a11y-light syntax colors. Every token measures at least 4.5:1, which meets WCAG AA.
• Inline code uses a light tint instead of a dark box.
• Dark mode is unchanged (Okaidia).

Other

• Updates the Browserslist database (caniuse-lite 1.0.30001818).
• Adds OpenSpec specs handbook, site-navigation and code-highlighting, and archives both changes under openspec/changes/archive/.

Testing

• moon run app:typecheck, ESLint, Prettier and moon run app:build pass. The sitemap lists the 7 handbook routes.
• Playwright checks on the dev server and the production build:
  • tree navigation and expansion
  • "On this page" jumps and active heading
  • collapse behavior
  • deep links and #heading URLs
  • responsive layout at 1400, 1100 and 390px
  • drawers and the bottom bar
  • header tabs and the phone menu
  • code colors and contrast in both modes, including mode switching with the header toggle and the settings drawer