feat(landing): port Sapling Landing v5

[Darkest-Teddy]

Ports Sapling Landing v5.dc.html (from docs/frontend-audit/Sapling landing page import (1).zip) into the Next.js frontend. v5 is now the landing page at /, replacing the previous marketing landing.

Supersedes #523. Based on feat/landing-v4-port, so its four commits ride along — v5 reuses that branch's scroll engine, course-graph model and editorial content. If v5 is the direction, #523 can be closed unmerged.

The title screen is a ground-up rebuild

Not a v4 tweak. Reading the source rather than the summary that accompanied the task turned up six divergences:

	Assumed	Actual v5 source
Wordmark	Archivo 800, ink #12201A	Playfair Display 600, #0C5638
Reveal	heroWipe clip-path	character scramble — heroWipe is defined, never referenced
Eyebrow	mono "GROW YOUR KNOWLEDGE"	Playfair "Grow Your Knowledge", title case, scrambled
Cascade	—	tagline leads (760ms), wordmark follows 260ms behind — v4 ran the reverse
Right bloom	mirrored green	teal rgba(43,140,150,0.2)
Panel rig	CSS perspective cards	three.js WebGL scene

Act III is likewise not the clipped 918×348 card track described in the brief — the source has a rotating triangular-prism carousel.

The v4 title screen was deleted rather than kept alongside. three/@types/three were already dependencies.

Four dead branches in the source

The design component carries a lot of machinery its own markup never reaches. Documented at each site:

1. const wantDark = false — the navbar's full two-theme colour table is built, then pinned to light. Wired live here, driven off the section under the viewport centre, as the brief calls for.
2. heroWipe / heroChar keyframes — defined, unreferenced. Not ported.
3. setHero0/1/2 + mode pills — exist only in renderVals(), so heroMode is pinned at 0 and only the panel scene can ever be seen. The constellation and growth-field shaders are unreachable; porting them would be porting dead code.
4. "Plant a concept" — plantVal, plantedCount, _plant(), a localStorage-backed grove and a canvas ref, none of it referenced. The CTA is heading + line + button.

Two engine bugs fixed

Both pre-existing in the v4 port, both invisible until a section actually had drag clusters:

• sim.ts reads a ring's halo via previousElementSibling and its caption via nextElementSibling; a <g> wrapper broke the adjacency and it threw on a null label.
• Clusters were anchored once, in page coordinates. The source captures each cluster's offset within its field, parks the overlay in a position:fixed shell, and re-applies anchor + field.rect every frame — which is what lets a cluster track its sticky section, and where the ≤150px drift inside a pinned act comes from.

Verified against the original served side by side: at 45% through act-tutor the source puts its 7 rings on screen at y≈121–608. This port now matches; before the fix it was 0 of 7, parked 8752px down.

Generated, not retyped

• galleryMinis.tsx — the 8 card miniatures, mechanically converted from the source's <article data-tk> blocks. Dense decorative animation where exact geometry and per-element delays are the effect. Regenerate rather than hand-edit.
• dragClusters.ts — the 8 course clusters, ~2KB of inline SVG each in the source, reduced to data + one component.
• companionContent.ts — 18 copy arrays lifted verbatim from the sibling pages.

Also in this PR

• The old marketing landing is retired. Deleting / orphaned marketing/graph/ (~95KB of passing tests for a surface no route mounts), marketing/surfaces/, FeatureBand, SurfaceBento, featureBands. HeroCard/SignInModal stay — the nav's Sign In opens the real OAuth modal.
• e2e/landing-graph.spec.ts goes with the component it pinned. public-seo.spec.ts's SSR guard is retargeted, not deleted: its failure mode (an ssr: false silently dropping the landing's copy from crawled HTML) outlived its selectors, and is sharper on a canvas/WebGL page. It deliberately does not assert the wordmark — that scrambles in client-side, so the h1's aria-label is checked instead. All 7 assertions verified against raw SSR output.
• The five companion pages the nav links to (/team, /wiki, /gallery, /news, /faq). Once v5 took /, those links 404'd. They use the warm paper palette deliberately — that is not a mistake to unify.

Known gaps

• Feature lab demo pane. The source mounts a separate FeatureLab design component per kind via <dc-import> — a distinct 75KB file the task's file list did not scope in. Layout, FLIP, rail, copy and close are faithful; the pane shows the card's miniature enlarged.
• Gallery tiles have no artwork — the import ships no screenshots.

Verification

• tsc --noEmit exit 0 · eslint exit 0 · next build exit 0, all 5 new routes prerendered static
• Unit suite 59 files / 423 tests passing
• Every section walked in a real browser at multiple scroll positions, no console errors; all 9 public routes return 200

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features
  • Introduced a redesigned landing experience with interactive knowledge graphs, tutoring modes, feature demos, gallery, journal, FAQ, and beta signup.
  • Added public FAQ, Gallery, News, Team, and Wiki pages with responsive navigation and searchable or filterable content.
  • Added interactive demonstrations for quizzes, flashcards, grades, calendars, notes, study rooms, guides, and tutoring.
• Documentation
  • Improved server-rendered landing-page checks for key accessible content and beta messaging.
• Refactor
  • Retired the previous marketing sections and legacy landing-page presentation.

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ebab108d-0405-4ae1-8d00-108ba83a0144

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Replaced the landing page with a component-based v5 experience, added interactive feature labs and companion pages, introduced shared animation engines and content data, and updated SSR coverage. Removed the former marketing graph, surface components, and related tests.

Changes

Landing v5 experience

Layer / File(s)	Summary
Landing content and data contracts frontend/src/lib/landing/*	Added landing content, course graph data, drag clusters, color utilities, and companion-page datasets.
Animation and interaction engines frontend/src/lib/landing/engine/*, frontend/src/lib/landing/hero3d/*	Added graph rendering, canvas effects, layout measurement, marquee and FLIP behavior, planting, drag simulation, and WebGL hero support.
Landing composition frontend/src/app/(public)/page.tsx, frontend/src/components/landing-v5/*, frontend/src/components/landing/useLanding.ts	Replaced the previous landing implementation with v5 hero, graph, ingest, tutor, gallery, FAQ, journal, CTA, navigation, modal, and lifecycle components.
Interactive feature labs frontend/src/components/landing-v5/lab/*	Added interactive quiz, flashcard, guide, grade, calendar, notes, rooms, and tutor demos with shared fixture data and controls.
Companion pages frontend/src/components/companion/*, frontend/src/app/(public)/{about,team,wiki,faq,gallery,news}/*	Added shared companion navigation and public About, Team, Wiki, FAQ, Gallery, and News routes.
Styling and SSR validation frontend/src/app/globals.css, frontend/e2e/public-seo.spec.ts, frontend/eslint-suppressions.json, frontend/src/lib/api.ts	Added scoped landing and companion styles, responsive animations, newsletter API wiring, and SSR checks for landing-page copy. Removed obsolete ESLint suppressions.

Estimated code review effort: 5 (Critical) | ~120 minutes

Possibly related PRs

• SaplingLearn/Sapling#513: Replaced the related knowledge-graph landing implementation and its supporting components.
• SaplingLearn/Sapling#63: Uses the same beta/newsletter signup flow implemented through BetaModal.
• SaplingLearn/Sapling#286: Also modifies the public landing page and shared styling layer.

Suggested reviewers:andresl230

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 36.59% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the primary change: porting Sapling Landing v5 into the landing page.
Description check	✅ Passed	The description explains the purpose, major changes, known gaps, related issue context, and verification results in substantial detail.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/landing-v5-port

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[supabase]

This pull request has been ignored for the connected project ybgqdonkoqftwrmweuyv because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[cloudflare-workers-and-pages]

Deploying with Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	frontend-staging	fc36068	Commit Preview URL Branch Preview URL	Aug 16 2026, 09:58 PM

[coderabbitai]

Actionable comments posted: 8

Note

Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.

🟡 Minor comments (14)

frontend/src/components/landing-v5/lab/NotesDemo.tsx-57-80 (1)

57-80: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

extract and summarize timeouts are untracked.

saveT is cleared on unmount, but the 700 ms timeouts at line 60 and line 71 are not stored and not cleared. If the lab panel closes within that window, the callbacks still run and set state on an unmounted component. Hold both handles in refs and clear them in the existing unmount effect.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` around lines 57 - 80,
Update the extract and summarize timeout flows to store their setTimeout handles
in dedicated refs, and clear both refs in the existing unmount effect alongside
saveT. Ensure the callbacks still perform their current state updates when they
complete, while preventing them from running after the component unmounts.

frontend/src/components/landing-v5/lab/CardsDemo.tsx-46-53 (1)

46-53: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The global space handler blocks button activation.

The keydown listener calls e.preventDefault() for every space press on window. A focused button then cannot be activated with space, including "Study again" at line 90. Skip the flip and the preventDefault call when the event target is an interactive element.

♿ Proposed fix

 const onKey = (e: KeyboardEvent) => {
+ const el = e.target as HTMLElement | null;+ if (el?.closest('button, input, textarea, select, [contenteditable]')) return;
if (e.key === ' ') { e.preventDefault(); flip(); }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 46 - 53,
Update the keydown handler in the useEffect to detect when the event target is
an interactive element, such as a button or link, and skip both flip() and
preventDefault() for those targets. Preserve the existing global space-to-flip
and rate-key behavior for non-interactive targets.

frontend/src/components/landing-v5/lab/NotesDemo.tsx-63-63 (1)

63-63: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The "no concepts" sentinel is counted as a linked concept.

When no matcher hits, concepts receives one placeholder entry. The footer at line 141 then renders "1 concepts linked to your MA 242 graph." The count is wrong and contradicts the placeholder. Keep concepts empty and track the empty result separately.

🔧 Proposed fix

+ const [ran, setRan] = useState(false);
@@
- setConcepts(found.length ? found : [{ name: 'No concepts found', tier: 'unexplored' }]);+ setConcepts(found);+ setRan(true);
setBusy(false);
@@
+ {ran && concepts.length === 0 && !busy && (+ <span style={{ fontSize: 12, color: '`#9AA5A0`' }}>No concepts found.</span>+ )}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` at line 63, Update the
concept-loading logic around the setConcepts call to keep concepts empty when
found has no matches instead of inserting a “No concepts found” sentinel; track
the empty-result state separately and use it for the empty-state display while
ensuring the footer count reflects only actual linked concepts.

frontend/src/lib/landing/engine/dom.ts-49-73 (1)

49-73: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Do not cache a zero-sized canvas measurement.

cv() caches w/h from clientWidth/clientHeight on the first call. The cache is dropped only by invalidateCanvas, which measure() calls only when the viewport dimensions change (see frontend/src/lib/landing/engine/measure.ts lines 98-104). If the first cv() call happens while the canvas is not laid out yet, or while its section is hidden, the cache stores 0 × 0. Every later frame then draws into a 0-pixel backing store, and the canvas stays blank until the viewport itself changes.

Skip the cache write when the measured size is zero, so the next frame re-reads it.

🐛 Proposed fix

 if (!c) {
const w = canvas.clientWidth;
const h = canvas.clientHeight;
const dpr = Math.min(window.devicePixelRatio || 1, 1.5);
let ctx = rec.__ctx as CanvasRenderingContext2D | undefined;
if (!ctx) {
ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
rec.__ctx = ctx;
}
c = { ctx, w, h, dpr };
- rec.__cv = c;+ // An unlaid-out or hidden canvas measures 0; don't freeze that in the+ // cache, or the next frames draw into a 0-pixel backing store.+ if (w > 0 && h > 0) rec.__cv = c;
const pw = Math.round(w * dpr);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/dom.ts` around lines 49 - 73, Update cv so
zero-sized measurements are not stored in the CanvasCache: when clientWidth or
clientHeight is zero, avoid assigning the newly measured cache to rec.__cv while
preserving the current context and sizing behavior. Ensure subsequent calls
re-read dimensions until both measurements are nonzero, while retaining normal
caching for valid sizes.

frontend/src/components/landing-v5/Journal.tsx-96-101 (1)

96-101: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Each post card links back to its own section.

href="#newsletter" points at the section that contains the card. The card presents as a link to an article, and activating it does nothing. This PR adds a /news route. Point each card at the article, or at /news until per-post routes exist.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 96 - 101, Update
the post card anchor in the Journal component to navigate to the new /news route
instead of the containing `#newsletter` section, while preserving the existing
card styling and behavior.

frontend/src/lib/landing/engine/sim.ts-184-203 (1)

184-203: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Label binding depends on an SVG sibling order that the markup does not guarantee.engine/sim.ts locates a node's caption through ring.nextElementSibling and casts it to SVGTextElement, while DragField renders that <text> only when a label exists for the node. When a label is missing, the sim binds the following node's glow <circle> and writes x/y onto it every frame, and ly becomes NaN.

• frontend/src/lib/landing/engine/sim.ts#L184-L203: check nextElementSibling.tagName === 'text' before the cast, type SimNode.label as SVGTextElement | null, and skip the label writes at lines 377-378 when it is null.
• frontend/src/components/landing-v5/DragField.tsx#L60-L92: alternatively, or in addition, always emit a <text> element per node so the documented glow → ring → label order holds for every node.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 184 - 203, Prevent
incorrect label binding in sim.ts by verifying ring.nextElementSibling is a text
element before assigning it, type SimNode.label as SVGTextElement | null, and
skip label position updates when it is null; update DragField.tsx to always
render a text element per node so the expected glow, ring, label order is
maintained.

frontend/src/components/landing-v5/Faq.tsx-66-71 (1)

66-71: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

"Read the full FAQ" links to its own section.

href="#faq" targets the section that contains the link, so the control does nothing. This PR adds a /faq route. Point the link there.

🔗 Proposed fix

- <a href="`#faq`" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>+ <a href="/faq" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 66 - 71, Update the
“Read the full FAQ” anchor in the FAQ component to navigate to the newly added
/faq route instead of the local `#faq` section, preserving its existing styling
and text.

frontend/src/components/landing-v5/Journal.tsx-184-199 (1)

184-199: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Set type="email" and guard the current submit flow.

The Journal input is an email address, so use type="email" for mobile keyboard and browser validation. The current actions.subscribe, at frontend/src/components/landing/useLanding.ts:624, only checks email.includes('@') and sets local subscribed state. If this should be a stub, make that intent explicit; otherwise wire onSubscribe to a newsletter endpoint before showing “You’re on the tree”.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 184 - 199,
Update the Journal email input in the landing component to use type="email" and
preserve the existing onSubscribe flow only as an explicit stub, or wire
onSubscribe to the newsletter endpoint and show the subscribed state only after
a successful submission. Locate the handler through actions.subscribe/useLanding
and ensure invalid emails cannot enter the success state.

frontend/src/components/landing-v5/Faq.tsx-79-116 (1)

79-116: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Closed answers stay in the accessibility tree, and the button has no aria-controls.

The collapsed panel uses maxHeight: 0, opacity: 0, and overflow: hidden. None of these remove the content from assistive technology, so a screen reader reads every answer even when the accordion is closed. The button also declares aria-expanded without naming the region it controls.

Add aria-controls with a stable id, and set aria-hidden on the panel while it is closed. aria-hidden does not disturb the max-height transition, because the content holds no focusable elements.

♿ Proposed fix

 <button
onClick={() => onToggle(open ? -1 : i)}
aria-expanded={open}
+ aria-controls={`faq-answer-${i}`}
style={{ width: '100%', background: 'none', border: 'none', cursor: 'pointer', padding: '22px 4px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 20, textAlign: 'left' }}
>

 <div
+ id={`faq-answer-${i}`}+ role="region"+ aria-hidden={!open}
style={{

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 79 - 116, Update the
FAQ accordion around the toggle button and answer panel to give each panel a
stable unique id, reference it from the button via aria-controls, and set
aria-hidden based on the open state so closed answers are excluded from the
accessibility tree. Preserve the existing visual transition and aria-expanded
behavior.

frontend/src/components/landing-v5/Navbar.tsx-199-235 (1)

199-235: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

role="menu" is applied to navigation disclosures whose children are not menu items. Both new navigation panels declare role="menu", but their children are plain button elements and next/link anchors. The ARIA menu pattern permits only menuitem, menuitemradio, and menuitemcheckbox children, so screen readers report both groups incorrectly. Both panels are page navigation, not application menus, so the correct fix in each place is to remove the role rather than to add menuitem roles.

• frontend/src/components/landing-v5/Navbar.tsx#L199-L235: remove role="menu" from the compact panel, and remove aria-haspopup="menu" from the trigger at line 120. Keep aria-expanded.
• frontend/src/components/landing-v5/Closing.tsx#L154-L182: remove role="menu" from the jump panel, and remove aria-haspopup="menu" from the pill at line 188. The enclosing nav with aria-label="Page sections" already carries the correct semantics.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Navbar.tsx` around lines 199 - 235, The
navigation disclosures use menu semantics with ordinary links and buttons;
remove those menu roles and triggers’ menu-haspopup attributes. In
frontend/src/components/landing-v5/Navbar.tsx lines 199-235, remove role="menu"
from the compact panel and remove aria-haspopup="menu" from its trigger while
retaining aria-expanded. In frontend/src/components/landing-v5/Closing.tsx lines
154-182, remove role="menu" from the jump panel and remove aria-haspopup="menu"
from the pill trigger; keep the enclosing navigation semantics and existing
expansion state.

frontend/src/app/(public)/page.tsx-115-116 (1)

115-116: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Clear the deferred openGal timers on unmount.

actions.openGal schedules actions.enterExplore / actions.openGal 260 ms later from onQuiz and onLearn. If the page unmounts before those timers fire, openGal runs after cleanup and writes document.body.style.overflow = 'hidden' after the landing cleanup reset that overflow. Keep the timer refs in useLanding so cleanup can call clearTimeout for them.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/page.tsx around lines 115 - 116, Update useLanding
and the onQuiz/onLearn handlers to store each 260 ms openGal timeout in refs,
rather than discarding the timer IDs. In the landing cleanup, clear both
deferred timers before resetting document.body overflow, preventing
actions.openGal from running after unmount.

frontend/src/components/landing-v5/ActTutor.tsx-93-109 (1)

93-109: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Expose the selected tutor mode, and keep the hidden pills out of the tab order.

Two gaps in this control group:

1. The pills are a mode selector, but the selected state is carried only by background and color. Assistive technology cannot report which mode is active. Add aria-pressed={tutorMode === i}.
2. The container starts at opacity: 0 with pointerEvents: 'none', and the engine fades it in later. The buttons stay focusable while invisible, so a keyboard user can focus a control that is not visible. Mirror the visual state in the tab order.

Also add type="button", which the other sections in this PR set consistently.

♻️ Proposed fix for the pill group

- {CAPTIONS.map(([tag], i) => (- <button- key={tag}- onClick={() => onSetMode(i)}+ {CAPTIONS.map(([tag], i) => (+ <button+ key={tag}+ type="button"+ aria-pressed={tutorMode === i}+ onClick={() => onSetMode(i)}

The engine already writes opacity on the container. Have it also clear visibility or the inert attribute so the pills leave the tab order until the handover:

- <div data-tutor-pills="1" style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>+ <div data-tutor-pills="1" inert style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActTutor.tsx` around lines 93 - 109,
Update the tutor pill group in ActTutor’s CAPTIONS map to add type="button" and
aria-pressed={tutorMode === i} to each button. Keep the hidden container’s
buttons out of the tab order while the engine-controlled opacity is zero by
mirroring its hidden state with inert or an equivalent visibility-based
mechanism, and ensure the existing handover clears that state when the pills
become visible.

frontend/src/components/landing-v5/ActGraph.tsx-333-340 (1)

333-340: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Add an Escape key exit for explore mode.

Explore mode covers the act and closes the navbar, but useLanding only handles Escape for gallery and jump controls. If explore mode is active, call onExitExplore from the key handler so keyboard-only users can leave the mode safely.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActGraph.tsx` around lines 333 - 340,
Update the existing keyboard handler in useLanding to detect Escape while
explore mode is active and call onExitExplore. Preserve the current Escape
behavior for gallery and jump controls, and ensure the explore-mode exit path is
available to keyboard-only users.

frontend/src/lib/landing/hero3d/index.ts-175-189 (1)

175-189: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Release the WebGL context in stop().

stop() already disposes three.js resources and cancels the render loop. WebGLRenderer.dispose() does not release the WebGL context, and this rig creates a new context on its canvas each mount. Add renderer.forceContextLoss() after renderer.dispose() so repeated navigation can reclaim the browser contexts sooner.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/hero3d/index.ts` around lines 175 - 189, Update the
returned stop() method to call renderer.forceContextLoss() immediately after
renderer.dispose(), ensuring the WebGL context is released during cleanup while
preserving the existing resource disposal and animation cancellation behavior.

🧹 Nitpick comments (14)

frontend/src/components/landing-v5/lab/LabShell.tsx (1)

51-84: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Segmented is unused; two demos duplicate it inline.

The comment states that the tutor and calendar demos use this control. They do not import it. CalendarDemo.tsx lines 61-76 and TutorDemo.tsx lines 65-80 each contain an inline copy of the same markup and style logic. Use Segmented in both demos, or delete it and correct the comment.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx` around lines 51 - 84,
Resolve the unused Segmented component by replacing the duplicated inline
segmented-control markup in CalendarDemo and TutorDemo with the shared Segmented
component, passing each demo’s options, current value, and change handler.
Preserve the existing labels, selection behavior, and styling, and keep the
component’s public API unchanged.

frontend/src/components/landing-v5/lab/QuizDemo.tsx (1)

33-35: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Difficulty badge changes while the same question is shown.

submit updates streak before it sets phase to review. qi does not change. The badge therefore flips from MEDIUM to HARD or EASY while the user still reads question 1 and its explanation. Derive the badge from the difficulty that applied when the question was served, for example from answers.length captured at question start.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 33 - 35,
Update the difficulty derivation in QuizDemo so the badge remains tied to the
difficulty assigned when the current question was served, rather than
recomputing from the mutable streak during review. Capture or derive the
question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.

frontend/src/components/landing-v5/lab/GradesDemo.tsx (1)

62-65: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Row percentage is unclamped while the weighted grade is clamped.

Line 25 clamps the score into [0, r.possible]. Line 64 uses the unclamped raw. If the user types 70 in a 50-point row, the row shows 140% while the category bar and the overall grade cap at 100%. Apply the same clamp in both places.

♻️ Proposed fix

 const raw = parseFloat(earned[i]);
- const pct = isNaN(raw) ? null : Math.round((raw / r.possible) * 100);+ const pct = isNaN(raw) ? null : Math.round((Math.max(0, Math.min(raw, r.possible)) / r.possible) * 100);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx` around lines 62 - 65,
Clamp the parsed score used in the row percentage calculation within the same
[0, r.possible] bounds already applied to the weighted grade. Update the
percentage logic in the GB_ROWS map callback, preserving the existing null
handling and color thresholds while ensuring values above or below the row
limits cannot produce percentages outside 0–100.

frontend/src/components/landing-v5/lab/labData.ts (1)

13-13: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Remove duplicated TIER from labData.ts.

labData.ts exports TIER, but the lab demos import LAB_TIER and render with labData.ts content. The four hex values and keys match LAB_TIER, so two copies of this swatch set can drift. Drop TIER from labData.ts and keep using LAB_TIER.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/labData.ts` at line 13, Remove the
exported TIER constant from labData.ts, since it duplicates the matching
LAB_TIER swatch set. Update any references in labData.ts to use LAB_TIER
instead, preserving the existing keys and color values.

frontend/src/lib/landing/engine/graph.ts (1)

122-127: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Replace the random-comparator shuffle with Fisher–Yates.

sort(() => Math.random() - 0.5) uses an inconsistent comparator. The resulting permutation is biased and depends on the engine's sort implementation, so many nodes keep positions close to their original index. That works against the documented intent of an organic reveal order.

♻️ Proposed fix

- // Shuffle the reveal order so the graph assembles organically.- const order = nodes.map((_, i) => i).sort(() => Math.random() - 0.5);+ // Shuffle the reveal order so the graph assembles organically.+ const order = nodes.map((_, i) => i);+ for (let i = order.length - 1; i > 0; i--) {+ const j = Math.floor(Math.random() * (i + 1));+ [order[i], order[j]] = [order[j], order[i]];+ }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/graph.ts` around lines 122 - 127, Replace the
random-comparator sort in the reveal-order logic with an unbiased Fisher–Yates
shuffle of the index array. Keep the existing spawnAt and colorAt calculations
and node ordering behavior after shuffling unchanged.

frontend/src/app/(public)/wiki/page.tsx (1)

31-39: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Make lede optional so the privacy section does not render an empty paragraph.

The privacy section passes lede="". Section always renders the <p>, so the page emits an empty paragraph with 0 0 20px margins. That adds dead space and an empty node in the accessibility tree.

♻️ Proposed fix

-function Section({ id, title, lede, children }: { id: string; title: string; lede: string; children?: React.ReactNode }) {+function Section({ id, title, lede, children }: { id: string; title: string; lede?: string; children?: React.ReactNode }) {
return (
<section style={{ marginTop: 56, scrollMarginTop: 110 }} id={id}>
<SectionHeading>{title}</SectionHeading>
- <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ {lede ? (+ <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ ) : null}
{children}

Then drop lede="" at line 147.

Also applies to: 147-149

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/wiki/page.tsx around lines 31 - 39, Make the lede
prop optional in Section and render the paragraph only when lede has content, so
the privacy section does not produce an empty element or spacing. Remove the
lede="" argument from the privacy Section usage while preserving existing lede
rendering for other sections.

frontend/src/lib/landing/engine/marquee.ts (1)

136-144: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick win

Avoid the per-frame layout read in update().

update() runs from the engine tick on every frame the gallery is on screen. Line 136 reads wrap.clientWidth on each of those frames, and line 156 writes track.style.transform. The write dirties style, so the next frame's read forces a style recalculation and layout. That contradicts the engine invariant documented in frontend/src/lib/landing/engine/index.ts lines 4-8, which states the tick never reads layout.

Observe the container width instead, and re-measure only when it changes.

♻️ Proposed approach

- // measure one card set only when the container width changed- if (!m.setW || m.measuredW !== wrap.clientWidth) {+ // measure one card set only when a ResizeObserver marked it stale+ if (!m.setW) {

Then in bind, mark the state stale from an observer and add its teardown to cleanups:

constro=newResizeObserver(()=>{m.setW=0;});if(wrap)ro.observe(wrap);cleanups.push(()=>ro.disconnect());

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/marquee.ts` around lines 136 - 144, Remove
the per-frame wrap.clientWidth read from update() and move width-change
detection to bind using a ResizeObserver on wrap. Have the observer mark m.setW
stale, register ro.disconnect in cleanups, and preserve the existing measurement
logic when update() sees stale state without reading layout every tick.

frontend/src/components/landing-v5/FeatureLab.tsx (1)

94-119: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Mark the active rail button for assistive technology.

on changes only the colors. Add aria-current="true" on the selected button so the active tool is conveyed without color.

♿ Proposed change

 data-rail={i}
type="button"
+ aria-current={on || undefined}
onClick={() => onPick(i)}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 94 - 119, Add
an aria-current="true" attribute to the selected rail button rendered in the
GAL.map callback, using the existing on condition so assistive technology
identifies the active tool without relying on color.

frontend/src/components/landing-v5/Gallery.tsx (1)

71-73: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

The wrapper duplicates the miniature's own container.

The <div> here sets height: 166, borderRadius: 13, overflow: hidden, the same background, and the same border. Every entry in GALLERY_MINIS opens with a <div> carrying that identical style set (see galleryMinis.tsx line 16). One of the two layers is redundant. Because the minis are generated, drop the wrapper here rather than editing the generated file.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 71 - 73, Remove
the redundant wrapper div around GALLERY_MINIS[i] in Gallery, rendering the
miniature directly while preserving its existing placement and aria-hidden
behavior. Do not modify the generated galleryMinis.tsx entries.

frontend/src/lib/landing/engine/flip.ts (1)

24-25: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

FlipState.ran is never read.

armFlip sets ran = false and flipClose resets it, but no code in this module or in frontend/src/components/landing/useLanding.ts reads it. The consumer tracks the same guard with its own flipRan ref (see useLanding.ts lines 158, 552, 574-575). Two guards for one invariant can drift. Either remove ran from FlipState or make flipOpen own the guard and delete flipRan from the hook.

Also applies to: 78-78

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/flip.ts` around lines 24 - 25, Remove the
unused FlipState.ran field and its assignments in armFlip and flipClose, since
useLanding already owns this guard through flipRan. Keep the existing
flipRan-based behavior unchanged and avoid maintaining duplicate state for the
same invariant.

frontend/src/lib/landing/engine/hero.ts (1)

99-136: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Points behind the camera reach the link pass with a degenerate scale.

sc = FL / (FL + z) is computed for every node. Rotation mixes ox into z, and ox reaches about ±740 while oz reaches about ±340, so z can pass -1000. At z === -FL the divide produces Infinity, and below -FL it produces a negative scale.

The point pass guards this at line 139 with p.z > -FL. The link pass at lines 116-136 does not. A node with Infinity scale gives reach === Infinity, so the break at line 122 never fires for that row and the inner loop degrades to a full scan.

Filter the projection once, so both passes share the guard.

♻️ Proposed change

 const proj = nodes
.map((n) => {
...
})
+ // drop anything at or behind the projection plane: `sc` is not finite+ // there, which breaks both the link reach and the point radius+ .filter((p) => p.z > -FL)
.sort((a, b) => b.z - a.z);

The p.z > -FL test at line 139 then becomes redundant and can go.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/hero.ts` around lines 99 - 136, Filter the
projected nodes immediately after the `proj` mapping so only entries with `p.z >
-FL` remain before sorting and running the link pass. Reuse this filtered
collection for both link rendering and the later point-rendering pass, then
remove the now-redundant `p.z > -FL` guard in the point pass.

frontend/src/components/landing/useLanding.ts (1)

378-392: 🚀 Performance & Scalability | 🔵 Trivial | 💤 Low value

The reveal scan polls every 900ms for the page lifetime.

scan() re-queries [data-reveal] across the whole landing root twice per second, forever, to catch elements that mount later. A MutationObserver on root would react to the same additions without the standing timer. This is a nice-to-have; the current cost is one querySelectorAll per tick.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 378 - 392,
Replace the lifetime polling interval in the reveal setup around scan with a
MutationObserver watching root for added elements, invoking scan when matching
content mounts later. Keep the initial scan, existing seen/io behavior, and
cleanup, but disconnect the mutation observer instead of clearing an interval.

frontend/src/lib/landing/engine/sim.ts (1)

282-299: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

up ignores pointerId, and the window listeners are registered once per cluster.

Two small points in bindDrag:

• up does not compare e.pointerId with f.drag.id. A second pointer that lifts cancels the active drag. onMove does compare the id, so the handlers are inconsistent.
• onMove and up are added to window inside the per-cluster loop. With N clusters in one group, every window pointer event runs N identical handlers. Bind the window listeners once per group instead.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 282 - 299, Update
bindDrag so up ignores pointer events whose pointerId does not match f.drag.id,
matching onMove’s active-pointer validation. Move the window-level pointermove,
pointerup, and pointercancel listener registration out of the per-cluster
binding loop and register each once per group, while keeping the per-SVG
listeners on the individual cluster SVG.

frontend/src/components/landing-v5/Closing.tsx (1)

75-92: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Share the companion-page list, and make the footer icon decorative.

Two points:

1. FOOTER_LINKS repeats PAGES in Navbar.tsx (lines 26-33) with the same six label and href pairs. Both files are new in this PR, so the two lists will drift the first time a companion page is added or renamed. Export one list and import it in both places.
2. Line 91 sets alt="Sapling" on the icon, and the adjacent text already reads "Sapling · © 2026". A screen reader announces the name twice. Navbar.tsx line 100 already uses alt="" for the same icon beside the same wordmark.

♻️ Proposed fix

- <Image src="/sapling-icon.svg" alt="Sapling" width={20} height={20} />+ <Image src="/sapling-icon.svg" alt="" width={20} height={20} />

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Closing.tsx` around lines 75 - 92, Share
the companion-page link list currently duplicated as FOOTER_LINKS in SiteFooter
and PAGES in Navbar by exporting one canonical list and importing it in both
components, preserving all six label/href pairs. Update the footer Image in
SiteFooter to use an empty alt value so the adjacent Sapling text is announced
only once.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/app/globals.css`:
- Around line 1957-2005: Rename the camelCase keyframe declarations in the
affected stylesheet to kebab-case, including symbols such as s1Stem,
saplingBlob, introOrbit, popHold, and the additional reported ranges. Update
every corresponding animation and animation-name reference to the new kebab-case
identifiers, preserving all animation behavior.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 41-50: Update the modal container identified by panelRef in
FeatureLab to add role="dialog", aria-modal="true", and an accessible name. On
mount, move focus into the panel; while open, trap Tab navigation within it so
focus cannot reach the page behind the overlay. Capture and restore focus to the
triggering element stored in FlipState.el when the panel closes, while
preserving the existing Escape close behavior.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 62-85: Update Card so non-ghost cards are keyboard-focusable and
activatable, using the existing track click-delegation contract, while ghost
duplicates remain excluded from the tab order and accessibility tree. Add the
corresponding keyboard activation handling to the card or track using the
existing feature-lab target behavior, and correct the nearby doc comment to
match the implemented accessibility behavior. Add a visible
.ld-galcard:focus-visible style in globals.css.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 37-44: Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout
in the rate handler is stored in a useRef, cleared before scheduling each new
rating and during unmount, and remove the ineffective returned cleanup. Update
NotesDemo.tsx at lines 57-80 so the 700 ms extract and summarize timeouts use
refs and are cleared in the existing unmount effect alongside saveT.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx`:
- Around line 21-24: Update the RECENT entries’ pick values to exactly match an
existing exam option in the corresponding GUIDES course fixture, preserving
openRecent’s assignment and keeping the select value consistent with the guide
heading.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 104-124: Fix the quiz option accessibility semantics in the
q.options mapping: either make each button a radio with role="radio" and
aria-checked bound to isPicked while retaining the radiogroup, or remove the
radiogroup role and expose isPicked through aria-pressed. Preserve the existing
selection and reviewing behavior in the option onClick handler.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 213-224: Update the hero canvas useEffect around startHeroCanvas
to track a cancelled/unmounted flag. Set it during cleanup, check it after the
asynchronous hero module import resolves before starting the canvas, and stop
the returned controller when appropriate so no animation loop or resize listener
remains after unmount.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 423-430: Update the initialization and destroy flow around
ensureInit and destroy to retain each cluster element’s original parent before
moving it into the overlay. During destroy, restore every cluster to that
parent, clear the inline styles applied by ensureInit, then remove the overlay
and reset state so a later ensureInit can rebuild the field without disrupting
React-owned nodes.
---
Minor comments:
In `@frontend/src/app/`(public)/page.tsx:
- Around line 115-116: Update useLanding and the onQuiz/onLearn handlers to
store each 260 ms openGal timeout in refs, rather than discarding the timer IDs.
In the landing cleanup, clear both deferred timers before resetting
document.body overflow, preventing actions.openGal from running after unmount.
In `@frontend/src/components/landing-v5/ActGraph.tsx`:
- Around line 333-340: Update the existing keyboard handler in useLanding to
detect Escape while explore mode is active and call onExitExplore. Preserve the
current Escape behavior for gallery and jump controls, and ensure the
explore-mode exit path is available to keyboard-only users.
In `@frontend/src/components/landing-v5/ActTutor.tsx`:
- Around line 93-109: Update the tutor pill group in ActTutor’s CAPTIONS map to
add type="button" and aria-pressed={tutorMode === i} to each button. Keep the
hidden container’s buttons out of the tab order while the engine-controlled
opacity is zero by mirroring its hidden state with inert or an equivalent
visibility-based mechanism, and ensure the existing handover clears that state
when the pills become visible.
In `@frontend/src/components/landing-v5/Faq.tsx`:
- Around line 66-71: Update the “Read the full FAQ” anchor in the FAQ component
to navigate to the newly added /faq route instead of the local `#faq` section,
preserving its existing styling and text.
- Around line 79-116: Update the FAQ accordion around the toggle button and
answer panel to give each panel a stable unique id, reference it from the button
via aria-controls, and set aria-hidden based on the open state so closed answers
are excluded from the accessibility tree. Preserve the existing visual
transition and aria-expanded behavior.
In `@frontend/src/components/landing-v5/Journal.tsx`:
- Around line 96-101: Update the post card anchor in the Journal component to
navigate to the new /news route instead of the containing `#newsletter` section,
while preserving the existing card styling and behavior.
- Around line 184-199: Update the Journal email input in the landing component
to use type="email" and preserve the existing onSubscribe flow only as an
explicit stub, or wire onSubscribe to the newsletter endpoint and show the
subscribed state only after a successful submission. Locate the handler through
actions.subscribe/useLanding and ensure invalid emails cannot enter the success
state.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 46-53: Update the keydown handler in the useEffect to detect when
the event target is an interactive element, such as a button or link, and skip
both flip() and preventDefault() for those targets. Preserve the existing global
space-to-flip and rate-key behavior for non-interactive targets.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx`:
- Around line 57-80: Update the extract and summarize timeout flows to store
their setTimeout handles in dedicated refs, and clear both refs in the existing
unmount effect alongside saveT. Ensure the callbacks still perform their current
state updates when they complete, while preventing them from running after the
component unmounts.
- Line 63: Update the concept-loading logic around the setConcepts call to keep
concepts empty when found has no matches instead of inserting a “No concepts
found” sentinel; track the empty-result state separately and use it for the
empty-state display while ensuring the footer count reflects only actual linked
concepts.
In `@frontend/src/components/landing-v5/Navbar.tsx`:
- Around line 199-235: The navigation disclosures use menu semantics with
ordinary links and buttons; remove those menu roles and triggers’ menu-haspopup
attributes. In frontend/src/components/landing-v5/Navbar.tsx lines 199-235,
remove role="menu" from the compact panel and remove aria-haspopup="menu" from
its trigger while retaining aria-expanded. In
frontend/src/components/landing-v5/Closing.tsx lines 154-182, remove role="menu"
from the jump panel and remove aria-haspopup="menu" from the pill trigger; keep
the enclosing navigation semantics and existing expansion state.
In `@frontend/src/lib/landing/engine/dom.ts`:
- Around line 49-73: Update cv so zero-sized measurements are not stored in the
CanvasCache: when clientWidth or clientHeight is zero, avoid assigning the newly
measured cache to rec.__cv while preserving the current context and sizing
behavior. Ensure subsequent calls re-read dimensions until both measurements are
nonzero, while retaining normal caching for valid sizes.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 184-203: Prevent incorrect label binding in sim.ts by verifying
ring.nextElementSibling is a text element before assigning it, type
SimNode.label as SVGTextElement | null, and skip label position updates when it
is null; update DragField.tsx to always render a text element per node so the
expected glow, ring, label order is maintained.
In `@frontend/src/lib/landing/hero3d/index.ts`:
- Around line 175-189: Update the returned stop() method to call
renderer.forceContextLoss() immediately after renderer.dispose(), ensuring the
WebGL context is released during cleanup while preserving the existing resource
disposal and animation cancellation behavior.
---
Nitpick comments:
In `@frontend/src/app/`(public)/wiki/page.tsx:
- Around line 31-39: Make the lede prop optional in Section and render the
paragraph only when lede has content, so the privacy section does not produce an
empty element or spacing. Remove the lede="" argument from the privacy Section
usage while preserving existing lede rendering for other sections.
In `@frontend/src/components/landing-v5/Closing.tsx`:
- Around line 75-92: Share the companion-page link list currently duplicated as
FOOTER_LINKS in SiteFooter and PAGES in Navbar by exporting one canonical list
and importing it in both components, preserving all six label/href pairs. Update
the footer Image in SiteFooter to use an empty alt value so the adjacent Sapling
text is announced only once.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 94-119: Add an aria-current="true" attribute to the selected rail
button rendered in the GAL.map callback, using the existing on condition so
assistive technology identifies the active tool without relying on color.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 71-73: Remove the redundant wrapper div around GALLERY_MINIS[i] in
Gallery, rendering the miniature directly while preserving its existing
placement and aria-hidden behavior. Do not modify the generated galleryMinis.tsx
entries.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx`:
- Around line 62-65: Clamp the parsed score used in the row percentage
calculation within the same [0, r.possible] bounds already applied to the
weighted grade. Update the percentage logic in the GB_ROWS map callback,
preserving the existing null handling and color thresholds while ensuring values
above or below the row limits cannot produce percentages outside 0–100.
In `@frontend/src/components/landing-v5/lab/labData.ts`:
- Line 13: Remove the exported TIER constant from labData.ts, since it
duplicates the matching LAB_TIER swatch set. Update any references in labData.ts
to use LAB_TIER instead, preserving the existing keys and color values.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx`:
- Around line 51-84: Resolve the unused Segmented component by replacing the
duplicated inline segmented-control markup in CalendarDemo and TutorDemo with
the shared Segmented component, passing each demo’s options, current value, and
change handler. Preserve the existing labels, selection behavior, and styling,
and keep the component’s public API unchanged.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 33-35: Update the difficulty derivation in QuizDemo so the badge
remains tied to the difficulty assigned when the current question was served,
rather than recomputing from the mutable streak during review. Capture or derive
the question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 378-392: Replace the lifetime polling interval in the reveal setup
around scan with a MutationObserver watching root for added elements, invoking
scan when matching content mounts later. Keep the initial scan, existing seen/io
behavior, and cleanup, but disconnect the mutation observer instead of clearing
an interval.
In `@frontend/src/lib/landing/engine/flip.ts`:
- Around line 24-25: Remove the unused FlipState.ran field and its assignments
in armFlip and flipClose, since useLanding already owns this guard through
flipRan. Keep the existing flipRan-based behavior unchanged and avoid
maintaining duplicate state for the same invariant.
In `@frontend/src/lib/landing/engine/graph.ts`:
- Around line 122-127: Replace the random-comparator sort in the reveal-order
logic with an unbiased Fisher–Yates shuffle of the index array. Keep the
existing spawnAt and colorAt calculations and node ordering behavior after
shuffling unchanged.
In `@frontend/src/lib/landing/engine/hero.ts`:
- Around line 99-136: Filter the projected nodes immediately after the `proj`
mapping so only entries with `p.z > -FL` remain before sorting and running the
link pass. Reuse this filtered collection for both link rendering and the later
point-rendering pass, then remove the now-redundant `p.z > -FL` guard in the
point pass.
In `@frontend/src/lib/landing/engine/marquee.ts`:
- Around line 136-144: Remove the per-frame wrap.clientWidth read from update()
and move width-change detection to bind using a ResizeObserver on wrap. Have the
observer mark m.setW stale, register ro.disconnect in cleanups, and preserve the
existing measurement logic when update() sees stale state without reading layout
every tick.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 282-299: Update bindDrag so up ignores pointer events whose
pointerId does not match f.drag.id, matching onMove’s active-pointer validation.
Move the window-level pointermove, pointerup, and pointercancel listener
registration out of the per-cluster binding loop and register each once per
group, while keeping the per-SVG listeners on the individual cluster SVG.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 865084a7-2f4d-472c-accd-6f67530e2a35

📥 Commits

Reviewing files that changed from the base of the PR and between ec34bf1 and 741ec10.

⛔ Files ignored due to path filters (3)

• frontend/public/journal-ai-homework.png is excluded by !**/*.png
• frontend/public/journal-founding.png is excluded by !**/*.png
• frontend/public/kofi-symbol.png is excluded by !**/*.png

📒 Files selected for processing (75)

• frontend/e2e/landing-graph.spec.ts
• frontend/e2e/public-seo.spec.ts
• frontend/eslint-suppressions.json
• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/companion/primitives.tsx
• frontend/src/components/landing-v5/ActGraph.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/ActTutor.tsx
• frontend/src/components/landing-v5/Closing.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/Faq.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/components/landing-v5/Gallery.tsx
• frontend/src/components/landing-v5/Hero.tsx
• frontend/src/components/landing-v5/IntroOverlay.tsx
• frontend/src/components/landing-v5/Journal.tsx
• frontend/src/components/landing-v5/Navbar.tsx
• frontend/src/components/landing-v5/galleryMinis.tsx
• frontend/src/components/landing-v5/lab/CalendarDemo.tsx
• frontend/src/components/landing-v5/lab/CardsDemo.tsx
• frontend/src/components/landing-v5/lab/GradesDemo.tsx
• frontend/src/components/landing-v5/lab/GuideDemo.tsx
• frontend/src/components/landing-v5/lab/LabShell.tsx
• frontend/src/components/landing-v5/lab/NotesDemo.tsx
• frontend/src/components/landing-v5/lab/QuizDemo.tsx
• frontend/src/components/landing-v5/lab/RoomsDemo.tsx
• frontend/src/components/landing-v5/lab/TutorDemo.tsx
• frontend/src/components/landing-v5/lab/index.tsx
• frontend/src/components/landing-v5/lab/labData.ts
• frontend/src/components/landing-v5/navTheme.ts
• frontend/src/components/landing/useLanding.ts
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx
• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/lib/landing/color.ts
• frontend/src/lib/landing/companionContent.ts
• frontend/src/lib/landing/content.ts
• frontend/src/lib/landing/course.ts
• frontend/src/lib/landing/dragClusters.ts
• frontend/src/lib/landing/engine/ambient.ts
• frontend/src/lib/landing/engine/dom.ts
• frontend/src/lib/landing/engine/flip.ts
• frontend/src/lib/landing/engine/graph.ts
• frontend/src/lib/landing/engine/graphView.ts
• frontend/src/lib/landing/engine/hero.ts
• frontend/src/lib/landing/engine/index.ts
• frontend/src/lib/landing/engine/marquee.ts
• frontend/src/lib/landing/engine/measure.ts
• frontend/src/lib/landing/engine/plant.ts
• frontend/src/lib/landing/engine/sim.ts
• frontend/src/lib/landing/hero3d/cardTexture.ts
• frontend/src/lib/landing/hero3d/index.ts

💤 Files with no reviewable changes (20)

• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/e2e/landing-graph.spec.ts
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

Use kebab-case keyframe names.

Stylelint reports every new camelCase keyframe identifier against keyframes-name-pattern. This leaves lint errors in the changed stylesheet. Rename the declarations to kebab case and update every matching animation or animation-name reference in the same change.

Also applies to: 2031-2033, 2082-2082, 2094-2096

🧰 Tools

🪛 Stylelint (17.14.0)

[error] 1957-1957: Expected keyframe name "s1Stem" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1958-1958: Expected keyframe name "s1LeafLo" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1964-1964: Expected keyframe name "s1LeafHi" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1970-1970: Expected keyframe name "s1Bud" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1971-1971: Expected keyframe name "s1Word" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1972-1972: Expected keyframe name "s1Rule" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1975-1975: Expected keyframe name "saplingBlob" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1976-1976: Expected keyframe name "introOrbit" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1977-1977: Expected keyframe name "floatIndicator" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1978-1978: Expected keyframe name "betaGlow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1979-1979: Expected keyframe name "nodeFloatA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1980-1980: Expected keyframe name "nodeFloatB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1983-1983: Expected keyframe name "popHold" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1984-1984: Expected keyframe name "chipSwapA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1985-1985: Expected keyframe name "chipSwapB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1986-1986: Expected keyframe name "flipLoop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1987-1987: Expected keyframe name "lineReveal" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1988-1988: Expected keyframe name "underSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1989-1989: Expected keyframe name "barGrow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1990-1990: Expected keyframe name "coverRise" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1991-1991: Expected keyframe name "ringDraw" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1992-1992: Expected keyframe name "gaugeFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1993-1993: Expected keyframe name "answerTick" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1994-1994: Expected keyframe name "waveBar" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1995-1995: Expected keyframe name "gaugeMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1996-1996: Expected keyframe name "coverMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1997-1997: Expected keyframe name "cursorMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1998-1998: Expected keyframe name "cardFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1999-1999: Expected keyframe name "scanSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2000-2000: Expected keyframe name "ocrBlink" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2001-2001: Expected keyframe name "panelFade" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2002-2002: Expected keyframe name "fillX" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2003-2003: Expected keyframe name "typingDot" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2004-2004: Expected keyframe name "ringPop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2005-2005: Expected keyframe name "cursorDrift" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/globals.css` around lines 1957 - 2005, Rename the camelCase
keyframe declarations in the affected stylesheet to kebab-case, including
symbols such as s1Stem, saplingBlob, introOrbit, popHold, and the additional
reported ranges. Update every corresponding animation and animation-name
reference to the new kebab-case identifiers, preserving all animation behavior.

Source: Linters/SAST tools

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

The overlay is a modal without dialog semantics or focus management.

The panel covers the viewport at zIndex: 80 and the caller locks body scroll. Three parts are missing:

• No role="dialog" and no aria-modal="true", so assistive technology does not announce a modal context.
• No accessible name on the container.
• No focus management. Focus stays on the gallery card behind the overlay, tabbing walks the page underneath, and closing does not return focus to the card that opened the panel.

Escape already closes the panel through useLanding.ts lines 272-276, so only the semantics and focus handling remain.

♿ Proposed direction

- <div style={{ position: 'fixed', inset: 0, zIndex: 80 }}>+ <div+ role="dialog"+ aria-modal="true"+ aria-label={`${g.kicker} demo`}+ style={{ position: 'fixed', inset: 0, zIndex: 80 }}+ >

Then move focus into the panel when it mounts, keep Tab inside it while it is open, and restore focus to the element captured by armFlip when it closes. frontend/src/lib/landing/engine/flip.ts already holds that element in FlipState.el.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 41 - 50,
Update the modal container identified by panelRef in FeatureLab to add
role="dialog", aria-modal="true", and an accessible name. On mount, move focus
into the panel; while open, trap Tab navigation within it so focus cannot reach
the page behind the overlay. Capture and restore focus to the triggering element
stored in FlipState.el when the panel closes, while preserving the existing
Escape close behavior.

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win

The gallery cards cannot be opened with a keyboard.

Opening the feature lab depends on the onClick delegation on the track div at lines 99-102. Card renders an <article> with no tabIndex, no role, and no key handler, and the track div has no key handler either. A keyboard user cannot reach or activate any card, so the feature lab is unreachable without a pointer. The doc comment at lines 14-15 states that the first copy is reachable by keyboard, which does not match the markup.

Make each non-ghost card an activatable control, keep the duplicate copies out of the tab order, and then correct the doc comment.

♿ Proposed fix

-function Card({ i, ghost }: { i: number; ghost: boolean }) {+function Card({ i, ghost, onOpen }: { i: number; ghost: boolean; onOpen: (i: number, el: HTMLElement | null) => void }) {
const c = CARDS[i];
return (
<article
data-tk={i}
aria-hidden={ghost || undefined}
+ role="button"+ tabIndex={ghost ? -1 : 0}+ aria-label={`Open ${c.kicker}`}+ onKeyDown={(e) => {+ if (e.key !== 'Enter' && e.key !== ' ') return;+ e.preventDefault();+ onOpen(i, e.currentTarget);+ }}
style={CARD}
className="ld-galcard"
>

- {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} />)}- {order.map((i) => <Card key={`b${i}`} i={i} ghost />)}+ {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} onOpen={onOpen} />)}+ {order.map((i) => <Card key={`b${i}`} i={i} ghost onOpen={onOpen} />)}

Add a visible focus style for .ld-galcard:focus-visible in globals.css.

Also applies to: 96-107

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 62 - 85, Update
Card so non-ghost cards are keyboard-focusable and activatable, using the
existing track click-delegation contract, while ghost duplicates remain excluded
from the tab order and accessibility tree. Add the corresponding keyboard
activation handling to the card or track using the existing feature-lab target
behavior, and correct the nearby doc comment to match the implemented
accessibility behavior. Add a visible .ld-galcard:focus-visible style in
globals.css.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

Handler timeouts are created without a ref, so they are never cancelled. Both demos schedule a state update from an event handler without storing the handle. The timeout cannot be cleared on unmount, and a second click cannot cancel a pending one. The other demos in this layer already hold each handle in a useRef and clear it in an unmount effect.

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44: store the 300 ms advance timeout in a ref, clear it before each new rating, and clear it on unmount; delete the returned cleanup, which React never calls.
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80: store the 700 ms extract and summarize timeouts in refs and clear them in the existing unmount effect beside saveT.

📍 Affects 2 files

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44 (this comment)
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 37 - 44,
Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout in the rate handler is
stored in a useRef, cleared before scheduling each new rating and during
unmount, and remove the ineffective returned cleanup. Update NotesDemo.tsx at
lines 57-80 so the 700 ms extract and summarize timeouts use refs and are
cleared in the existing unmount effect alongside saveT.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

RECENT[].pick values are not options of the exam select.

openRecent at line 53 sets exam to r.pick. 'Midterm 1 · Sep 30' is not in GUIDES['MA 242'].exams, and 'Quiz 2 · Oct 03' is not in GUIDES['CS 201'].exams. The controlled select at line 76 then falls back to displaying its first option while the guide heading at line 104 prints exam. The control and the heading disagree, and the user cannot select the displayed exam again.

Use an exam that exists in the course fixture, or add the recent exam to the option list when it is selected.

🔧 Proposed fix using existing fixture values

 const RECENT = [
- { i: 0, exam: 'MA 242 · Midterm 1', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Midterm 1 · Sep 30' },- { i: 1, exam: 'CS 201 · Quiz 2', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Quiz 2 · Oct 03' },+ { i: 0, exam: 'MA 242 · Final', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Final · Dec 12' },+ { i: 1, exam: 'CS 201 · Midterm 1', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Midterm 1 · Oct 17' },
];

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	constRECENT=[
	{i: 0,exam: 'MA 242 · Midterm 1',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Midterm 1 · Sep 30'},
	{i: 1,exam: 'CS 201 · Quiz 2',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Quiz 2 · Oct 03'},
	];
	constRECENT=[
	{i: 0,exam: 'MA 242 · Final',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Final · Dec 12'},
	{i: 1,exam: 'CS 201 · Midterm 1',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Midterm 1 · Oct 17'},
	];

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx` around lines 21 - 24,
Update the RECENT entries’ pick values to exactly match an existing exam option
in the corresponding GUIDES course fixture, preserving openRecent’s assignment
and keeping the select value consistent with the guide heading.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

role="radiogroup" has no radio children.

The container declares role="radiogroup", but each option is a plain <button>. A radiogroup requires children with role="radio" and aria-checked. Assistive technology cannot report which option is selected. Add the roles and state, or drop role="radiogroup" and expose selection with aria-pressed.

♿ Proposed fix

 <button
key={o.label}
type="button"
+ role="radio"+ aria-checked={isPicked}+ aria-disabled={reviewing}
onClick={() => { if (!reviewing) setPicked(o.label); }}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='#E3E0D5',bg='#FDFCF9',fg='#33443B',mark='',markCol='';
	if(reviewing&&correct){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';mark='CORRECT';markCol='#0C5638';}
	elseif(reviewing&&isPicked){bd='#b25855';bg='rgba(178,88,85,0.09)';fg='#9c4b48';mark='YOUR PICK';markCol='#9c4b48';}
	elseif(isPicked){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';}
	return(
	<button
	key={o.label}
	type="button"
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '#0E9E5A' : '#9AA5A0'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}
	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='`#E3E0D5`',bg='`#FDFCF9`',fg='`#33443B`',mark='',markCol='';
	if(reviewing&&correct){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';mark='CORRECT';markCol='`#0C5638`';}
	elseif(reviewing&&isPicked){bd='`#b25855`';bg='rgba(178,88,85,0.09)';fg='`#9c4b48`';mark='YOUR PICK';markCol='`#9c4b48`';}
	elseif(isPicked){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';}
	return(
	<button
	key={o.label}
	type="button"
	role="radio"
	aria-checked={isPicked}
	aria-disabled={reviewing}
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '`#0E9E5A`' : '`#9AA5A0`'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 104 - 124,
Fix the quiz option accessibility semantics in the q.options mapping: either
make each button a radio with role="radio" and aria-checked bound to isPicked
while retaining the radiogroup, or remove the radiogroup role and expose
isPicked through aria-pressed. Preserve the existing selection and reviewing
behavior in the option onClick handler.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

The hero canvas effect can start a loop that is never stopped.

import('@/lib/landing/engine/hero') resolves asynchronously. If the component unmounts before the promise resolves, the cleanup at line 222 runs while stopped is still null. The then callback then calls startHeroCanvas, which installs a requestAnimationFrame loop and a resize listener (see frontend/src/lib/landing/engine/hero.ts lines 83-87). Nothing cancels them afterwards, so the loop keeps drawing after navigation away from the landing page.

The WebGL effect at lines 227-244 already uses a cancelled flag. Apply the same pattern here.

🛠️ Proposed fix

 let stopped: { stop(): void } | null = null;
+ let cancelled = false;
// imported lazily so the module isn't pulled into the server bundle
import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas }) => {
+ if (cancelled) return;
stopped = startHeroCanvas(canvas, () => engine.mouse, () => engine.parallaxY);
});
- return () => stopped?.stop();+ return () => {+ cancelled = true;+ stopped?.stop();+ };

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	// imported lazily so the module isn't pulled into the server bundle
	import('@/lib/landing/engine/hero').then(({ startHeroCanvas })=>{
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>stopped?.stop();
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);
	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	letcancelled=false;
	// imported lazily so the module isn't pulled into the server bundle
	import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas })=>{
	if(cancelled)return;
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>{
	cancelled=true;
	stopped?.stop();
	};
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 213 - 224, Update
the hero canvas useEffect around startHeroCanvas to track a cancelled/unmounted
flag. Set it during cleanup, check it after the asynchronous hero module import
resolves before starting the canvas, and stop the returned controller when
appropriate so no animation loop or resize listener remains after unmount.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | 🏗️ Heavy lift

destroy() discards the re-homed clusters, so the field cannot be rebuilt.

ensureInit moves every cluster element out of its .drag-field and into the overlay (line 172), and it mutates the cluster's inline styles (lines 165-171). destroy() removes the shell through the queued cleanup, which deletes those cluster elements from the document. It does not put them back.

Two consequences:

1. A second ensureInit on the same DOM finds .drag-field elements with no [data-dragnode] children, returns false at line 232, and the field stays empty forever. This happens on any stop/start cycle, including the React StrictMode double-invoke of the engine effect in frontend/src/components/landing/useLanding.ts lines 162-210.
2. React still owns those cluster nodes, because DragField rendered them. React records the original parent for each child. Removing or reparenting the nodes outside React can make the later unmount removal fail.

Restore each cluster to its original parent and clear the inline styles that ensureInit set.

🛠️ Proposed fix: remember the original parent and restore it on destroy

 interface ClusterAnchor {
el: HTMLElement;
field: HTMLElement;
+ /** Where the cluster lived before it was re-homed into the overlay. */+ home: Node | null;+ before: Node | null;
/** The pinned act this field belongs to, if any — drives the scroll drift. */
sect: HTMLElement | null;
left: number;
top: number;
}

 anchors.push({
el: cl, field, sect,
+ home: cl.parentNode,+ before: cl.nextSibling,
left: b.left - fb.left,
top: b.top - fb.top,
});

 function destroy(): void {
+ // put the clusters back before the overlay goes away, otherwise React+ // still owns nodes that no longer exist and a later ensureInit finds+ // empty fields+ for (const a of anchors) {+ a.el.style.cssText = '';+ if (a.home) a.home.insertBefore(a.el, a.before);+ }
cleanups.forEach((fn) => fn());
cleanups.length = 0;
anchors.length = 0;
groups = null;
- if (overlay && overlay.parentElement) overlay.parentElement.removeChild(overlay);
overlay = null;
}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 423 - 430, Update the
initialization and destroy flow around ensureInit and destroy to retain each
cluster element’s original parent before moving it into the overlay. During
destroy, restore every cluster to that parent, clear the inline styles applied
by ensureInit, then remove the overlay and reset state so a later ensureInit can
rebuild the field without disrupting React-owned nodes.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/landing-v5/BetaModal.tsx`:
- Around line 52-70: Update the subscribed confirmation branch in BetaModal so
the rendered Close button receives focus after the form is replaced. Add a ref
to that button and focus it after the subscribed state commits, using the
component’s existing lifecycle pattern; preserve the current onClose behavior
and button styling.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ee1ca146-7600-423b-98c7-56bcec09e4e1

📥 Commits

Reviewing files that changed from the base of the PR and between 741ec10 and e506827.

📒 Files selected for processing (13)

• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/BetaModal.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/lib/landing/content.ts

💤 Files with no reviewable changes (2)

• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx

🚧 Files skipped from review as they are similar to previous changes (5)

• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/lib/landing/content.ts

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

Restore modal focus after the subscribed state replaces the form.

When subscribed becomes true, this branch unmounts the focused email input while Dialog remains open. Dialog only applies its initial focus when open changes. Focus can then leave the dialog and bypass its Tab trap. Move focus to the Close button after the confirmation state renders.

Proposed fix

-import { useId, useRef } from 'react';+import { useEffect, useId, useRef } from 'react';
...
const inputRef = useRef<HTMLInputElement>(null);
+ const confirmationCloseRef = useRef<HTMLButtonElement>(null);
const headingId = useId();
const valid = email.includes('@');
++ useEffect(() => {+ if (open && subscribed) confirmationCloseRef.current?.focus();+ }, [open, subscribed]);
...
<button
+ ref={confirmationCloseRef}
onClick={onClose}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '#12201A',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '#0C5638'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '#61726A',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '#0C5638',color: '#fff',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>
	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '`#12201A`',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '`#0C5638`'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '`#61726A`',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	ref={confirmationCloseRef}
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '`#0C5638`',color: '`#fff`',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/BetaModal.tsx` around lines 52 - 70,
Update the subscribed confirmation branch in BetaModal so the rendered Close
button receives focus after the form is replaced. Add a ref to that button and
focus it after the subscribed state commits, using the component’s existing
lifecycle pattern; preserve the current onClose behavior and button styling.

[Darkest-Teddy]

Ports Sapling Landing v5.dc.html (from docs/frontend-audit/Sapling landing page import (1).zip) into the Next.js frontend. v5 is now the landing page at /, replacing the previous marketing landing.

Supersedes #523. Based on feat/landing-v4-port, so its four commits ride along — v5 reuses that branch's scroll engine, course-graph model and editorial content. If v5 is the direction, #523 can be closed unmerged.

The title screen is a ground-up rebuild

Not a v4 tweak. Reading the source rather than the summary that accompanied the task turned up six divergences:

	Assumed	Actual v5 source
Wordmark	Archivo 800, ink #12201A	Playfair Display 600, #0C5638
Reveal	heroWipe clip-path	character scramble — heroWipe is defined, never referenced
Eyebrow	mono "GROW YOUR KNOWLEDGE"	Playfair "Grow Your Knowledge", title case, scrambled
Cascade	—	tagline leads (760ms), wordmark follows 260ms behind — v4 ran the reverse
Right bloom	mirrored green	teal rgba(43,140,150,0.2)
Panel rig	CSS perspective cards	three.js WebGL scene

Act III is likewise not the clipped 918×348 card track described in the brief — the source has a rotating triangular-prism carousel.

The v4 title screen was deleted rather than kept alongside. three/@types/three were already dependencies.

Four dead branches in the source

The design component carries a lot of machinery its own markup never reaches. Documented at each site:

1. const wantDark = false — the navbar's full two-theme colour table is built, then pinned to light. Wired live here, driven off the section under the viewport centre, as the brief calls for.
2. heroWipe / heroChar keyframes — defined, unreferenced. Not ported.
3. setHero0/1/2 + mode pills — exist only in renderVals(), so heroMode is pinned at 0 and only the panel scene can ever be seen. The constellation and growth-field shaders are unreachable; porting them would be porting dead code.
4. "Plant a concept" — plantVal, plantedCount, _plant(), a localStorage-backed grove and a canvas ref, none of it referenced. The CTA is heading + line + button.

Two engine bugs fixed

Both pre-existing in the v4 port, both invisible until a section actually had drag clusters:

• sim.ts reads a ring's halo via previousElementSibling and its caption via nextElementSibling; a <g> wrapper broke the adjacency and it threw on a null label.
• Clusters were anchored once, in page coordinates. The source captures each cluster's offset within its field, parks the overlay in a position:fixed shell, and re-applies anchor + field.rect every frame — which is what lets a cluster track its sticky section, and where the ≤150px drift inside a pinned act comes from.

Verified against the original served side by side: at 45% through act-tutor the source puts its 7 rings on screen at y≈121–608. This port now matches; before the fix it was 0 of 7, parked 8752px down.

Generated, not retyped

• galleryMinis.tsx — the 8 card miniatures, mechanically converted from the source's <article data-tk> blocks. Dense decorative animation where exact geometry and per-element delays are the effect. Regenerate rather than hand-edit.
• dragClusters.ts — the 8 course clusters, ~2KB of inline SVG each in the source, reduced to data + one component.
• companionContent.ts — 18 copy arrays lifted verbatim from the sibling pages.

Also in this PR

• The old marketing landing is retired. Deleting / orphaned marketing/graph/ (~95KB of passing tests for a surface no route mounts), marketing/surfaces/, FeatureBand, SurfaceBento, featureBands. HeroCard/SignInModal stay — the nav's Sign In opens the real OAuth modal.
• e2e/landing-graph.spec.ts goes with the component it pinned. public-seo.spec.ts's SSR guard is retargeted, not deleted: its failure mode (an ssr: false silently dropping the landing's copy from crawled HTML) outlived its selectors, and is sharper on a canvas/WebGL page. It deliberately does not assert the wordmark — that scrambles in client-side, so the h1's aria-label is checked instead. All 7 assertions verified against raw SSR output.
• The five companion pages the nav links to (/team, /wiki, /gallery, /news, /faq). Once v5 took /, those links 404'd. They use the warm paper palette deliberately — that is not a mistake to unify.

Known gaps

• Feature lab demo pane. The source mounts a separate FeatureLab design component per kind via <dc-import> — a distinct 75KB file the task's file list did not scope in. Layout, FLIP, rail, copy and close are faithful; the pane shows the card's miniature enlarged.
• Gallery tiles have no artwork — the import ships no screenshots.

Verification

• tsc --noEmit exit 0 · eslint exit 0 · next build exit 0, all 5 new routes prerendered static
• Unit suite 59 files / 423 tests passing
• Every section walked in a real browser at multiple scroll positions, no console errors; all 9 public routes return 200

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features
  • Introduced a redesigned landing experience with interactive knowledge graphs, tutoring modes, feature demos, gallery, journal, FAQ, and beta signup.
  • Added public FAQ, Gallery, News, Team, and Wiki pages with responsive navigation and searchable or filterable content.
  • Added interactive demonstrations for quizzes, flashcards, grades, calendars, notes, study rooms, guides, and tutoring.
• Documentation
  • Improved server-rendered landing-page checks for key accessible content and beta messaging.
• Refactor
  • Retired the previous marketing sections and legacy landing-page presentation.

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ebab108d-0405-4ae1-8d00-108ba83a0144

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Replaced the landing page with a component-based v5 experience, added interactive feature labs and companion pages, introduced shared animation engines and content data, and updated SSR coverage. Removed the former marketing graph, surface components, and related tests.

Changes

Landing v5 experience

Layer / File(s)	Summary
Landing content and data contracts frontend/src/lib/landing/*	Added landing content, course graph data, drag clusters, color utilities, and companion-page datasets.
Animation and interaction engines frontend/src/lib/landing/engine/*, frontend/src/lib/landing/hero3d/*	Added graph rendering, canvas effects, layout measurement, marquee and FLIP behavior, planting, drag simulation, and WebGL hero support.
Landing composition frontend/src/app/(public)/page.tsx, frontend/src/components/landing-v5/*, frontend/src/components/landing/useLanding.ts	Replaced the previous landing implementation with v5 hero, graph, ingest, tutor, gallery, FAQ, journal, CTA, navigation, modal, and lifecycle components.
Interactive feature labs frontend/src/components/landing-v5/lab/*	Added interactive quiz, flashcard, guide, grade, calendar, notes, rooms, and tutor demos with shared fixture data and controls.
Companion pages frontend/src/components/companion/*, frontend/src/app/(public)/{about,team,wiki,faq,gallery,news}/*	Added shared companion navigation and public About, Team, Wiki, FAQ, Gallery, and News routes.
Styling and SSR validation frontend/src/app/globals.css, frontend/e2e/public-seo.spec.ts, frontend/eslint-suppressions.json, frontend/src/lib/api.ts	Added scoped landing and companion styles, responsive animations, newsletter API wiring, and SSR checks for landing-page copy. Removed obsolete ESLint suppressions.

Estimated code review effort: 5 (Critical) | ~120 minutes

Possibly related PRs

• SaplingLearn/Sapling#513: Replaced the related knowledge-graph landing implementation and its supporting components.
• SaplingLearn/Sapling#63: Uses the same beta/newsletter signup flow implemented through BetaModal.
• SaplingLearn/Sapling#286: Also modifies the public landing page and shared styling layer.

Suggested reviewers:andresl230

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 36.59% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the primary change: porting Sapling Landing v5 into the landing page.
Description check	✅ Passed	The description explains the purpose, major changes, known gaps, related issue context, and verification results in substantial detail.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/landing-v5-port

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[supabase]

This pull request has been ignored for the connected project ybgqdonkoqftwrmweuyv because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[cloudflare-workers-and-pages]

Deploying with Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	frontend-staging	fc36068	Commit Preview URL Branch Preview URL	Aug 16 2026, 09:58 PM

[coderabbitai]

Actionable comments posted: 8

Note

Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.

🟡 Minor comments (14)

frontend/src/components/landing-v5/lab/NotesDemo.tsx-57-80 (1)

57-80: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

extract and summarize timeouts are untracked.

saveT is cleared on unmount, but the 700 ms timeouts at line 60 and line 71 are not stored and not cleared. If the lab panel closes within that window, the callbacks still run and set state on an unmounted component. Hold both handles in refs and clear them in the existing unmount effect.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` around lines 57 - 80,
Update the extract and summarize timeout flows to store their setTimeout handles
in dedicated refs, and clear both refs in the existing unmount effect alongside
saveT. Ensure the callbacks still perform their current state updates when they
complete, while preventing them from running after the component unmounts.

frontend/src/components/landing-v5/lab/CardsDemo.tsx-46-53 (1)

46-53: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The global space handler blocks button activation.

The keydown listener calls e.preventDefault() for every space press on window. A focused button then cannot be activated with space, including "Study again" at line 90. Skip the flip and the preventDefault call when the event target is an interactive element.

♿ Proposed fix

 const onKey = (e: KeyboardEvent) => {
+ const el = e.target as HTMLElement | null;+ if (el?.closest('button, input, textarea, select, [contenteditable]')) return;
if (e.key === ' ') { e.preventDefault(); flip(); }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 46 - 53,
Update the keydown handler in the useEffect to detect when the event target is
an interactive element, such as a button or link, and skip both flip() and
preventDefault() for those targets. Preserve the existing global space-to-flip
and rate-key behavior for non-interactive targets.

frontend/src/components/landing-v5/lab/NotesDemo.tsx-63-63 (1)

63-63: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The "no concepts" sentinel is counted as a linked concept.

When no matcher hits, concepts receives one placeholder entry. The footer at line 141 then renders "1 concepts linked to your MA 242 graph." The count is wrong and contradicts the placeholder. Keep concepts empty and track the empty result separately.

🔧 Proposed fix

+ const [ran, setRan] = useState(false);
@@
- setConcepts(found.length ? found : [{ name: 'No concepts found', tier: 'unexplored' }]);+ setConcepts(found);+ setRan(true);
setBusy(false);
@@
+ {ran && concepts.length === 0 && !busy && (+ <span style={{ fontSize: 12, color: '`#9AA5A0`' }}>No concepts found.</span>+ )}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` at line 63, Update the
concept-loading logic around the setConcepts call to keep concepts empty when
found has no matches instead of inserting a “No concepts found” sentinel; track
the empty-result state separately and use it for the empty-state display while
ensuring the footer count reflects only actual linked concepts.

frontend/src/lib/landing/engine/dom.ts-49-73 (1)

49-73: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Do not cache a zero-sized canvas measurement.

cv() caches w/h from clientWidth/clientHeight on the first call. The cache is dropped only by invalidateCanvas, which measure() calls only when the viewport dimensions change (see frontend/src/lib/landing/engine/measure.ts lines 98-104). If the first cv() call happens while the canvas is not laid out yet, or while its section is hidden, the cache stores 0 × 0. Every later frame then draws into a 0-pixel backing store, and the canvas stays blank until the viewport itself changes.

Skip the cache write when the measured size is zero, so the next frame re-reads it.

🐛 Proposed fix

 if (!c) {
const w = canvas.clientWidth;
const h = canvas.clientHeight;
const dpr = Math.min(window.devicePixelRatio || 1, 1.5);
let ctx = rec.__ctx as CanvasRenderingContext2D | undefined;
if (!ctx) {
ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
rec.__ctx = ctx;
}
c = { ctx, w, h, dpr };
- rec.__cv = c;+ // An unlaid-out or hidden canvas measures 0; don't freeze that in the+ // cache, or the next frames draw into a 0-pixel backing store.+ if (w > 0 && h > 0) rec.__cv = c;
const pw = Math.round(w * dpr);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/dom.ts` around lines 49 - 73, Update cv so
zero-sized measurements are not stored in the CanvasCache: when clientWidth or
clientHeight is zero, avoid assigning the newly measured cache to rec.__cv while
preserving the current context and sizing behavior. Ensure subsequent calls
re-read dimensions until both measurements are nonzero, while retaining normal
caching for valid sizes.

frontend/src/components/landing-v5/Journal.tsx-96-101 (1)

96-101: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Each post card links back to its own section.

href="#newsletter" points at the section that contains the card. The card presents as a link to an article, and activating it does nothing. This PR adds a /news route. Point each card at the article, or at /news until per-post routes exist.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 96 - 101, Update
the post card anchor in the Journal component to navigate to the new /news route
instead of the containing `#newsletter` section, while preserving the existing
card styling and behavior.

frontend/src/lib/landing/engine/sim.ts-184-203 (1)

184-203: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Label binding depends on an SVG sibling order that the markup does not guarantee.engine/sim.ts locates a node's caption through ring.nextElementSibling and casts it to SVGTextElement, while DragField renders that <text> only when a label exists for the node. When a label is missing, the sim binds the following node's glow <circle> and writes x/y onto it every frame, and ly becomes NaN.

• frontend/src/lib/landing/engine/sim.ts#L184-L203: check nextElementSibling.tagName === 'text' before the cast, type SimNode.label as SVGTextElement | null, and skip the label writes at lines 377-378 when it is null.
• frontend/src/components/landing-v5/DragField.tsx#L60-L92: alternatively, or in addition, always emit a <text> element per node so the documented glow → ring → label order holds for every node.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 184 - 203, Prevent
incorrect label binding in sim.ts by verifying ring.nextElementSibling is a text
element before assigning it, type SimNode.label as SVGTextElement | null, and
skip label position updates when it is null; update DragField.tsx to always
render a text element per node so the expected glow, ring, label order is
maintained.

frontend/src/components/landing-v5/Faq.tsx-66-71 (1)

66-71: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

"Read the full FAQ" links to its own section.

href="#faq" targets the section that contains the link, so the control does nothing. This PR adds a /faq route. Point the link there.

🔗 Proposed fix

- <a href="`#faq`" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>+ <a href="/faq" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 66 - 71, Update the
“Read the full FAQ” anchor in the FAQ component to navigate to the newly added
/faq route instead of the local `#faq` section, preserving its existing styling
and text.

frontend/src/components/landing-v5/Journal.tsx-184-199 (1)

184-199: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Set type="email" and guard the current submit flow.

The Journal input is an email address, so use type="email" for mobile keyboard and browser validation. The current actions.subscribe, at frontend/src/components/landing/useLanding.ts:624, only checks email.includes('@') and sets local subscribed state. If this should be a stub, make that intent explicit; otherwise wire onSubscribe to a newsletter endpoint before showing “You’re on the tree”.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 184 - 199,
Update the Journal email input in the landing component to use type="email" and
preserve the existing onSubscribe flow only as an explicit stub, or wire
onSubscribe to the newsletter endpoint and show the subscribed state only after
a successful submission. Locate the handler through actions.subscribe/useLanding
and ensure invalid emails cannot enter the success state.

frontend/src/components/landing-v5/Faq.tsx-79-116 (1)

79-116: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Closed answers stay in the accessibility tree, and the button has no aria-controls.

The collapsed panel uses maxHeight: 0, opacity: 0, and overflow: hidden. None of these remove the content from assistive technology, so a screen reader reads every answer even when the accordion is closed. The button also declares aria-expanded without naming the region it controls.

Add aria-controls with a stable id, and set aria-hidden on the panel while it is closed. aria-hidden does not disturb the max-height transition, because the content holds no focusable elements.

♿ Proposed fix

 <button
onClick={() => onToggle(open ? -1 : i)}
aria-expanded={open}
+ aria-controls={`faq-answer-${i}`}
style={{ width: '100%', background: 'none', border: 'none', cursor: 'pointer', padding: '22px 4px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 20, textAlign: 'left' }}
>

 <div
+ id={`faq-answer-${i}`}+ role="region"+ aria-hidden={!open}
style={{

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 79 - 116, Update the
FAQ accordion around the toggle button and answer panel to give each panel a
stable unique id, reference it from the button via aria-controls, and set
aria-hidden based on the open state so closed answers are excluded from the
accessibility tree. Preserve the existing visual transition and aria-expanded
behavior.

frontend/src/components/landing-v5/Navbar.tsx-199-235 (1)

199-235: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

role="menu" is applied to navigation disclosures whose children are not menu items. Both new navigation panels declare role="menu", but their children are plain button elements and next/link anchors. The ARIA menu pattern permits only menuitem, menuitemradio, and menuitemcheckbox children, so screen readers report both groups incorrectly. Both panels are page navigation, not application menus, so the correct fix in each place is to remove the role rather than to add menuitem roles.

• frontend/src/components/landing-v5/Navbar.tsx#L199-L235: remove role="menu" from the compact panel, and remove aria-haspopup="menu" from the trigger at line 120. Keep aria-expanded.
• frontend/src/components/landing-v5/Closing.tsx#L154-L182: remove role="menu" from the jump panel, and remove aria-haspopup="menu" from the pill at line 188. The enclosing nav with aria-label="Page sections" already carries the correct semantics.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Navbar.tsx` around lines 199 - 235, The
navigation disclosures use menu semantics with ordinary links and buttons;
remove those menu roles and triggers’ menu-haspopup attributes. In
frontend/src/components/landing-v5/Navbar.tsx lines 199-235, remove role="menu"
from the compact panel and remove aria-haspopup="menu" from its trigger while
retaining aria-expanded. In frontend/src/components/landing-v5/Closing.tsx lines
154-182, remove role="menu" from the jump panel and remove aria-haspopup="menu"
from the pill trigger; keep the enclosing navigation semantics and existing
expansion state.

frontend/src/app/(public)/page.tsx-115-116 (1)

115-116: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Clear the deferred openGal timers on unmount.

actions.openGal schedules actions.enterExplore / actions.openGal 260 ms later from onQuiz and onLearn. If the page unmounts before those timers fire, openGal runs after cleanup and writes document.body.style.overflow = 'hidden' after the landing cleanup reset that overflow. Keep the timer refs in useLanding so cleanup can call clearTimeout for them.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/page.tsx around lines 115 - 116, Update useLanding
and the onQuiz/onLearn handlers to store each 260 ms openGal timeout in refs,
rather than discarding the timer IDs. In the landing cleanup, clear both
deferred timers before resetting document.body overflow, preventing
actions.openGal from running after unmount.

frontend/src/components/landing-v5/ActTutor.tsx-93-109 (1)

93-109: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Expose the selected tutor mode, and keep the hidden pills out of the tab order.

Two gaps in this control group:

1. The pills are a mode selector, but the selected state is carried only by background and color. Assistive technology cannot report which mode is active. Add aria-pressed={tutorMode === i}.
2. The container starts at opacity: 0 with pointerEvents: 'none', and the engine fades it in later. The buttons stay focusable while invisible, so a keyboard user can focus a control that is not visible. Mirror the visual state in the tab order.

Also add type="button", which the other sections in this PR set consistently.

♻️ Proposed fix for the pill group

- {CAPTIONS.map(([tag], i) => (- <button- key={tag}- onClick={() => onSetMode(i)}+ {CAPTIONS.map(([tag], i) => (+ <button+ key={tag}+ type="button"+ aria-pressed={tutorMode === i}+ onClick={() => onSetMode(i)}

The engine already writes opacity on the container. Have it also clear visibility or the inert attribute so the pills leave the tab order until the handover:

- <div data-tutor-pills="1" style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>+ <div data-tutor-pills="1" inert style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActTutor.tsx` around lines 93 - 109,
Update the tutor pill group in ActTutor’s CAPTIONS map to add type="button" and
aria-pressed={tutorMode === i} to each button. Keep the hidden container’s
buttons out of the tab order while the engine-controlled opacity is zero by
mirroring its hidden state with inert or an equivalent visibility-based
mechanism, and ensure the existing handover clears that state when the pills
become visible.

frontend/src/components/landing-v5/ActGraph.tsx-333-340 (1)

333-340: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Add an Escape key exit for explore mode.

Explore mode covers the act and closes the navbar, but useLanding only handles Escape for gallery and jump controls. If explore mode is active, call onExitExplore from the key handler so keyboard-only users can leave the mode safely.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActGraph.tsx` around lines 333 - 340,
Update the existing keyboard handler in useLanding to detect Escape while
explore mode is active and call onExitExplore. Preserve the current Escape
behavior for gallery and jump controls, and ensure the explore-mode exit path is
available to keyboard-only users.

frontend/src/lib/landing/hero3d/index.ts-175-189 (1)

175-189: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Release the WebGL context in stop().

stop() already disposes three.js resources and cancels the render loop. WebGLRenderer.dispose() does not release the WebGL context, and this rig creates a new context on its canvas each mount. Add renderer.forceContextLoss() after renderer.dispose() so repeated navigation can reclaim the browser contexts sooner.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/hero3d/index.ts` around lines 175 - 189, Update the
returned stop() method to call renderer.forceContextLoss() immediately after
renderer.dispose(), ensuring the WebGL context is released during cleanup while
preserving the existing resource disposal and animation cancellation behavior.

🧹 Nitpick comments (14)

frontend/src/components/landing-v5/lab/LabShell.tsx (1)

51-84: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Segmented is unused; two demos duplicate it inline.

The comment states that the tutor and calendar demos use this control. They do not import it. CalendarDemo.tsx lines 61-76 and TutorDemo.tsx lines 65-80 each contain an inline copy of the same markup and style logic. Use Segmented in both demos, or delete it and correct the comment.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx` around lines 51 - 84,
Resolve the unused Segmented component by replacing the duplicated inline
segmented-control markup in CalendarDemo and TutorDemo with the shared Segmented
component, passing each demo’s options, current value, and change handler.
Preserve the existing labels, selection behavior, and styling, and keep the
component’s public API unchanged.

frontend/src/components/landing-v5/lab/QuizDemo.tsx (1)

33-35: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Difficulty badge changes while the same question is shown.

submit updates streak before it sets phase to review. qi does not change. The badge therefore flips from MEDIUM to HARD or EASY while the user still reads question 1 and its explanation. Derive the badge from the difficulty that applied when the question was served, for example from answers.length captured at question start.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 33 - 35,
Update the difficulty derivation in QuizDemo so the badge remains tied to the
difficulty assigned when the current question was served, rather than
recomputing from the mutable streak during review. Capture or derive the
question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.

frontend/src/components/landing-v5/lab/GradesDemo.tsx (1)

62-65: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Row percentage is unclamped while the weighted grade is clamped.

Line 25 clamps the score into [0, r.possible]. Line 64 uses the unclamped raw. If the user types 70 in a 50-point row, the row shows 140% while the category bar and the overall grade cap at 100%. Apply the same clamp in both places.

♻️ Proposed fix

 const raw = parseFloat(earned[i]);
- const pct = isNaN(raw) ? null : Math.round((raw / r.possible) * 100);+ const pct = isNaN(raw) ? null : Math.round((Math.max(0, Math.min(raw, r.possible)) / r.possible) * 100);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx` around lines 62 - 65,
Clamp the parsed score used in the row percentage calculation within the same
[0, r.possible] bounds already applied to the weighted grade. Update the
percentage logic in the GB_ROWS map callback, preserving the existing null
handling and color thresholds while ensuring values above or below the row
limits cannot produce percentages outside 0–100.

frontend/src/components/landing-v5/lab/labData.ts (1)

13-13: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Remove duplicated TIER from labData.ts.

labData.ts exports TIER, but the lab demos import LAB_TIER and render with labData.ts content. The four hex values and keys match LAB_TIER, so two copies of this swatch set can drift. Drop TIER from labData.ts and keep using LAB_TIER.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/labData.ts` at line 13, Remove the
exported TIER constant from labData.ts, since it duplicates the matching
LAB_TIER swatch set. Update any references in labData.ts to use LAB_TIER
instead, preserving the existing keys and color values.

frontend/src/lib/landing/engine/graph.ts (1)

122-127: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Replace the random-comparator shuffle with Fisher–Yates.

sort(() => Math.random() - 0.5) uses an inconsistent comparator. The resulting permutation is biased and depends on the engine's sort implementation, so many nodes keep positions close to their original index. That works against the documented intent of an organic reveal order.

♻️ Proposed fix

- // Shuffle the reveal order so the graph assembles organically.- const order = nodes.map((_, i) => i).sort(() => Math.random() - 0.5);+ // Shuffle the reveal order so the graph assembles organically.+ const order = nodes.map((_, i) => i);+ for (let i = order.length - 1; i > 0; i--) {+ const j = Math.floor(Math.random() * (i + 1));+ [order[i], order[j]] = [order[j], order[i]];+ }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/graph.ts` around lines 122 - 127, Replace the
random-comparator sort in the reveal-order logic with an unbiased Fisher–Yates
shuffle of the index array. Keep the existing spawnAt and colorAt calculations
and node ordering behavior after shuffling unchanged.

frontend/src/app/(public)/wiki/page.tsx (1)

31-39: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Make lede optional so the privacy section does not render an empty paragraph.

The privacy section passes lede="". Section always renders the <p>, so the page emits an empty paragraph with 0 0 20px margins. That adds dead space and an empty node in the accessibility tree.

♻️ Proposed fix

-function Section({ id, title, lede, children }: { id: string; title: string; lede: string; children?: React.ReactNode }) {+function Section({ id, title, lede, children }: { id: string; title: string; lede?: string; children?: React.ReactNode }) {
return (
<section style={{ marginTop: 56, scrollMarginTop: 110 }} id={id}>
<SectionHeading>{title}</SectionHeading>
- <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ {lede ? (+ <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ ) : null}
{children}

Then drop lede="" at line 147.

Also applies to: 147-149

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/wiki/page.tsx around lines 31 - 39, Make the lede
prop optional in Section and render the paragraph only when lede has content, so
the privacy section does not produce an empty element or spacing. Remove the
lede="" argument from the privacy Section usage while preserving existing lede
rendering for other sections.

frontend/src/lib/landing/engine/marquee.ts (1)

136-144: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick win

Avoid the per-frame layout read in update().

update() runs from the engine tick on every frame the gallery is on screen. Line 136 reads wrap.clientWidth on each of those frames, and line 156 writes track.style.transform. The write dirties style, so the next frame's read forces a style recalculation and layout. That contradicts the engine invariant documented in frontend/src/lib/landing/engine/index.ts lines 4-8, which states the tick never reads layout.

Observe the container width instead, and re-measure only when it changes.

♻️ Proposed approach

- // measure one card set only when the container width changed- if (!m.setW || m.measuredW !== wrap.clientWidth) {+ // measure one card set only when a ResizeObserver marked it stale+ if (!m.setW) {

Then in bind, mark the state stale from an observer and add its teardown to cleanups:

constro=newResizeObserver(()=>{m.setW=0;});if(wrap)ro.observe(wrap);cleanups.push(()=>ro.disconnect());

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/marquee.ts` around lines 136 - 144, Remove
the per-frame wrap.clientWidth read from update() and move width-change
detection to bind using a ResizeObserver on wrap. Have the observer mark m.setW
stale, register ro.disconnect in cleanups, and preserve the existing measurement
logic when update() sees stale state without reading layout every tick.

frontend/src/components/landing-v5/FeatureLab.tsx (1)

94-119: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Mark the active rail button for assistive technology.

on changes only the colors. Add aria-current="true" on the selected button so the active tool is conveyed without color.

♿ Proposed change

 data-rail={i}
type="button"
+ aria-current={on || undefined}
onClick={() => onPick(i)}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 94 - 119, Add
an aria-current="true" attribute to the selected rail button rendered in the
GAL.map callback, using the existing on condition so assistive technology
identifies the active tool without relying on color.

frontend/src/components/landing-v5/Gallery.tsx (1)

71-73: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

The wrapper duplicates the miniature's own container.

The <div> here sets height: 166, borderRadius: 13, overflow: hidden, the same background, and the same border. Every entry in GALLERY_MINIS opens with a <div> carrying that identical style set (see galleryMinis.tsx line 16). One of the two layers is redundant. Because the minis are generated, drop the wrapper here rather than editing the generated file.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 71 - 73, Remove
the redundant wrapper div around GALLERY_MINIS[i] in Gallery, rendering the
miniature directly while preserving its existing placement and aria-hidden
behavior. Do not modify the generated galleryMinis.tsx entries.

frontend/src/lib/landing/engine/flip.ts (1)

24-25: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

FlipState.ran is never read.

armFlip sets ran = false and flipClose resets it, but no code in this module or in frontend/src/components/landing/useLanding.ts reads it. The consumer tracks the same guard with its own flipRan ref (see useLanding.ts lines 158, 552, 574-575). Two guards for one invariant can drift. Either remove ran from FlipState or make flipOpen own the guard and delete flipRan from the hook.

Also applies to: 78-78

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/flip.ts` around lines 24 - 25, Remove the
unused FlipState.ran field and its assignments in armFlip and flipClose, since
useLanding already owns this guard through flipRan. Keep the existing
flipRan-based behavior unchanged and avoid maintaining duplicate state for the
same invariant.

frontend/src/lib/landing/engine/hero.ts (1)

99-136: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Points behind the camera reach the link pass with a degenerate scale.

sc = FL / (FL + z) is computed for every node. Rotation mixes ox into z, and ox reaches about ±740 while oz reaches about ±340, so z can pass -1000. At z === -FL the divide produces Infinity, and below -FL it produces a negative scale.

The point pass guards this at line 139 with p.z > -FL. The link pass at lines 116-136 does not. A node with Infinity scale gives reach === Infinity, so the break at line 122 never fires for that row and the inner loop degrades to a full scan.

Filter the projection once, so both passes share the guard.

♻️ Proposed change

 const proj = nodes
.map((n) => {
...
})
+ // drop anything at or behind the projection plane: `sc` is not finite+ // there, which breaks both the link reach and the point radius+ .filter((p) => p.z > -FL)
.sort((a, b) => b.z - a.z);

The p.z > -FL test at line 139 then becomes redundant and can go.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/hero.ts` around lines 99 - 136, Filter the
projected nodes immediately after the `proj` mapping so only entries with `p.z >
-FL` remain before sorting and running the link pass. Reuse this filtered
collection for both link rendering and the later point-rendering pass, then
remove the now-redundant `p.z > -FL` guard in the point pass.

frontend/src/components/landing/useLanding.ts (1)

378-392: 🚀 Performance & Scalability | 🔵 Trivial | 💤 Low value

The reveal scan polls every 900ms for the page lifetime.

scan() re-queries [data-reveal] across the whole landing root twice per second, forever, to catch elements that mount later. A MutationObserver on root would react to the same additions without the standing timer. This is a nice-to-have; the current cost is one querySelectorAll per tick.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 378 - 392,
Replace the lifetime polling interval in the reveal setup around scan with a
MutationObserver watching root for added elements, invoking scan when matching
content mounts later. Keep the initial scan, existing seen/io behavior, and
cleanup, but disconnect the mutation observer instead of clearing an interval.

frontend/src/lib/landing/engine/sim.ts (1)

282-299: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

up ignores pointerId, and the window listeners are registered once per cluster.

Two small points in bindDrag:

• up does not compare e.pointerId with f.drag.id. A second pointer that lifts cancels the active drag. onMove does compare the id, so the handlers are inconsistent.
• onMove and up are added to window inside the per-cluster loop. With N clusters in one group, every window pointer event runs N identical handlers. Bind the window listeners once per group instead.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 282 - 299, Update
bindDrag so up ignores pointer events whose pointerId does not match f.drag.id,
matching onMove’s active-pointer validation. Move the window-level pointermove,
pointerup, and pointercancel listener registration out of the per-cluster
binding loop and register each once per group, while keeping the per-SVG
listeners on the individual cluster SVG.

frontend/src/components/landing-v5/Closing.tsx (1)

75-92: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Share the companion-page list, and make the footer icon decorative.

Two points:

1. FOOTER_LINKS repeats PAGES in Navbar.tsx (lines 26-33) with the same six label and href pairs. Both files are new in this PR, so the two lists will drift the first time a companion page is added or renamed. Export one list and import it in both places.
2. Line 91 sets alt="Sapling" on the icon, and the adjacent text already reads "Sapling · © 2026". A screen reader announces the name twice. Navbar.tsx line 100 already uses alt="" for the same icon beside the same wordmark.

♻️ Proposed fix

- <Image src="/sapling-icon.svg" alt="Sapling" width={20} height={20} />+ <Image src="/sapling-icon.svg" alt="" width={20} height={20} />

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Closing.tsx` around lines 75 - 92, Share
the companion-page link list currently duplicated as FOOTER_LINKS in SiteFooter
and PAGES in Navbar by exporting one canonical list and importing it in both
components, preserving all six label/href pairs. Update the footer Image in
SiteFooter to use an empty alt value so the adjacent Sapling text is announced
only once.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/app/globals.css`:
- Around line 1957-2005: Rename the camelCase keyframe declarations in the
affected stylesheet to kebab-case, including symbols such as s1Stem,
saplingBlob, introOrbit, popHold, and the additional reported ranges. Update
every corresponding animation and animation-name reference to the new kebab-case
identifiers, preserving all animation behavior.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 41-50: Update the modal container identified by panelRef in
FeatureLab to add role="dialog", aria-modal="true", and an accessible name. On
mount, move focus into the panel; while open, trap Tab navigation within it so
focus cannot reach the page behind the overlay. Capture and restore focus to the
triggering element stored in FlipState.el when the panel closes, while
preserving the existing Escape close behavior.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 62-85: Update Card so non-ghost cards are keyboard-focusable and
activatable, using the existing track click-delegation contract, while ghost
duplicates remain excluded from the tab order and accessibility tree. Add the
corresponding keyboard activation handling to the card or track using the
existing feature-lab target behavior, and correct the nearby doc comment to
match the implemented accessibility behavior. Add a visible
.ld-galcard:focus-visible style in globals.css.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 37-44: Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout
in the rate handler is stored in a useRef, cleared before scheduling each new
rating and during unmount, and remove the ineffective returned cleanup. Update
NotesDemo.tsx at lines 57-80 so the 700 ms extract and summarize timeouts use
refs and are cleared in the existing unmount effect alongside saveT.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx`:
- Around line 21-24: Update the RECENT entries’ pick values to exactly match an
existing exam option in the corresponding GUIDES course fixture, preserving
openRecent’s assignment and keeping the select value consistent with the guide
heading.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 104-124: Fix the quiz option accessibility semantics in the
q.options mapping: either make each button a radio with role="radio" and
aria-checked bound to isPicked while retaining the radiogroup, or remove the
radiogroup role and expose isPicked through aria-pressed. Preserve the existing
selection and reviewing behavior in the option onClick handler.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 213-224: Update the hero canvas useEffect around startHeroCanvas
to track a cancelled/unmounted flag. Set it during cleanup, check it after the
asynchronous hero module import resolves before starting the canvas, and stop
the returned controller when appropriate so no animation loop or resize listener
remains after unmount.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 423-430: Update the initialization and destroy flow around
ensureInit and destroy to retain each cluster element’s original parent before
moving it into the overlay. During destroy, restore every cluster to that
parent, clear the inline styles applied by ensureInit, then remove the overlay
and reset state so a later ensureInit can rebuild the field without disrupting
React-owned nodes.
---
Minor comments:
In `@frontend/src/app/`(public)/page.tsx:
- Around line 115-116: Update useLanding and the onQuiz/onLearn handlers to
store each 260 ms openGal timeout in refs, rather than discarding the timer IDs.
In the landing cleanup, clear both deferred timers before resetting
document.body overflow, preventing actions.openGal from running after unmount.
In `@frontend/src/components/landing-v5/ActGraph.tsx`:
- Around line 333-340: Update the existing keyboard handler in useLanding to
detect Escape while explore mode is active and call onExitExplore. Preserve the
current Escape behavior for gallery and jump controls, and ensure the
explore-mode exit path is available to keyboard-only users.
In `@frontend/src/components/landing-v5/ActTutor.tsx`:
- Around line 93-109: Update the tutor pill group in ActTutor’s CAPTIONS map to
add type="button" and aria-pressed={tutorMode === i} to each button. Keep the
hidden container’s buttons out of the tab order while the engine-controlled
opacity is zero by mirroring its hidden state with inert or an equivalent
visibility-based mechanism, and ensure the existing handover clears that state
when the pills become visible.
In `@frontend/src/components/landing-v5/Faq.tsx`:
- Around line 66-71: Update the “Read the full FAQ” anchor in the FAQ component
to navigate to the newly added /faq route instead of the local `#faq` section,
preserving its existing styling and text.
- Around line 79-116: Update the FAQ accordion around the toggle button and
answer panel to give each panel a stable unique id, reference it from the button
via aria-controls, and set aria-hidden based on the open state so closed answers
are excluded from the accessibility tree. Preserve the existing visual
transition and aria-expanded behavior.
In `@frontend/src/components/landing-v5/Journal.tsx`:
- Around line 96-101: Update the post card anchor in the Journal component to
navigate to the new /news route instead of the containing `#newsletter` section,
while preserving the existing card styling and behavior.
- Around line 184-199: Update the Journal email input in the landing component
to use type="email" and preserve the existing onSubscribe flow only as an
explicit stub, or wire onSubscribe to the newsletter endpoint and show the
subscribed state only after a successful submission. Locate the handler through
actions.subscribe/useLanding and ensure invalid emails cannot enter the success
state.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 46-53: Update the keydown handler in the useEffect to detect when
the event target is an interactive element, such as a button or link, and skip
both flip() and preventDefault() for those targets. Preserve the existing global
space-to-flip and rate-key behavior for non-interactive targets.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx`:
- Around line 57-80: Update the extract and summarize timeout flows to store
their setTimeout handles in dedicated refs, and clear both refs in the existing
unmount effect alongside saveT. Ensure the callbacks still perform their current
state updates when they complete, while preventing them from running after the
component unmounts.
- Line 63: Update the concept-loading logic around the setConcepts call to keep
concepts empty when found has no matches instead of inserting a “No concepts
found” sentinel; track the empty-result state separately and use it for the
empty-state display while ensuring the footer count reflects only actual linked
concepts.
In `@frontend/src/components/landing-v5/Navbar.tsx`:
- Around line 199-235: The navigation disclosures use menu semantics with
ordinary links and buttons; remove those menu roles and triggers’ menu-haspopup
attributes. In frontend/src/components/landing-v5/Navbar.tsx lines 199-235,
remove role="menu" from the compact panel and remove aria-haspopup="menu" from
its trigger while retaining aria-expanded. In
frontend/src/components/landing-v5/Closing.tsx lines 154-182, remove role="menu"
from the jump panel and remove aria-haspopup="menu" from the pill trigger; keep
the enclosing navigation semantics and existing expansion state.
In `@frontend/src/lib/landing/engine/dom.ts`:
- Around line 49-73: Update cv so zero-sized measurements are not stored in the
CanvasCache: when clientWidth or clientHeight is zero, avoid assigning the newly
measured cache to rec.__cv while preserving the current context and sizing
behavior. Ensure subsequent calls re-read dimensions until both measurements are
nonzero, while retaining normal caching for valid sizes.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 184-203: Prevent incorrect label binding in sim.ts by verifying
ring.nextElementSibling is a text element before assigning it, type
SimNode.label as SVGTextElement | null, and skip label position updates when it
is null; update DragField.tsx to always render a text element per node so the
expected glow, ring, label order is maintained.
In `@frontend/src/lib/landing/hero3d/index.ts`:
- Around line 175-189: Update the returned stop() method to call
renderer.forceContextLoss() immediately after renderer.dispose(), ensuring the
WebGL context is released during cleanup while preserving the existing resource
disposal and animation cancellation behavior.
---
Nitpick comments:
In `@frontend/src/app/`(public)/wiki/page.tsx:
- Around line 31-39: Make the lede prop optional in Section and render the
paragraph only when lede has content, so the privacy section does not produce an
empty element or spacing. Remove the lede="" argument from the privacy Section
usage while preserving existing lede rendering for other sections.
In `@frontend/src/components/landing-v5/Closing.tsx`:
- Around line 75-92: Share the companion-page link list currently duplicated as
FOOTER_LINKS in SiteFooter and PAGES in Navbar by exporting one canonical list
and importing it in both components, preserving all six label/href pairs. Update
the footer Image in SiteFooter to use an empty alt value so the adjacent Sapling
text is announced only once.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 94-119: Add an aria-current="true" attribute to the selected rail
button rendered in the GAL.map callback, using the existing on condition so
assistive technology identifies the active tool without relying on color.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 71-73: Remove the redundant wrapper div around GALLERY_MINIS[i] in
Gallery, rendering the miniature directly while preserving its existing
placement and aria-hidden behavior. Do not modify the generated galleryMinis.tsx
entries.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx`:
- Around line 62-65: Clamp the parsed score used in the row percentage
calculation within the same [0, r.possible] bounds already applied to the
weighted grade. Update the percentage logic in the GB_ROWS map callback,
preserving the existing null handling and color thresholds while ensuring values
above or below the row limits cannot produce percentages outside 0–100.
In `@frontend/src/components/landing-v5/lab/labData.ts`:
- Line 13: Remove the exported TIER constant from labData.ts, since it
duplicates the matching LAB_TIER swatch set. Update any references in labData.ts
to use LAB_TIER instead, preserving the existing keys and color values.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx`:
- Around line 51-84: Resolve the unused Segmented component by replacing the
duplicated inline segmented-control markup in CalendarDemo and TutorDemo with
the shared Segmented component, passing each demo’s options, current value, and
change handler. Preserve the existing labels, selection behavior, and styling,
and keep the component’s public API unchanged.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 33-35: Update the difficulty derivation in QuizDemo so the badge
remains tied to the difficulty assigned when the current question was served,
rather than recomputing from the mutable streak during review. Capture or derive
the question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 378-392: Replace the lifetime polling interval in the reveal setup
around scan with a MutationObserver watching root for added elements, invoking
scan when matching content mounts later. Keep the initial scan, existing seen/io
behavior, and cleanup, but disconnect the mutation observer instead of clearing
an interval.
In `@frontend/src/lib/landing/engine/flip.ts`:
- Around line 24-25: Remove the unused FlipState.ran field and its assignments
in armFlip and flipClose, since useLanding already owns this guard through
flipRan. Keep the existing flipRan-based behavior unchanged and avoid
maintaining duplicate state for the same invariant.
In `@frontend/src/lib/landing/engine/graph.ts`:
- Around line 122-127: Replace the random-comparator sort in the reveal-order
logic with an unbiased Fisher–Yates shuffle of the index array. Keep the
existing spawnAt and colorAt calculations and node ordering behavior after
shuffling unchanged.
In `@frontend/src/lib/landing/engine/hero.ts`:
- Around line 99-136: Filter the projected nodes immediately after the `proj`
mapping so only entries with `p.z > -FL` remain before sorting and running the
link pass. Reuse this filtered collection for both link rendering and the later
point-rendering pass, then remove the now-redundant `p.z > -FL` guard in the
point pass.
In `@frontend/src/lib/landing/engine/marquee.ts`:
- Around line 136-144: Remove the per-frame wrap.clientWidth read from update()
and move width-change detection to bind using a ResizeObserver on wrap. Have the
observer mark m.setW stale, register ro.disconnect in cleanups, and preserve the
existing measurement logic when update() sees stale state without reading layout
every tick.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 282-299: Update bindDrag so up ignores pointer events whose
pointerId does not match f.drag.id, matching onMove’s active-pointer validation.
Move the window-level pointermove, pointerup, and pointercancel listener
registration out of the per-cluster binding loop and register each once per
group, while keeping the per-SVG listeners on the individual cluster SVG.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 865084a7-2f4d-472c-accd-6f67530e2a35

📥 Commits

Reviewing files that changed from the base of the PR and between ec34bf1 and 741ec10.

⛔ Files ignored due to path filters (3)

• frontend/public/journal-ai-homework.png is excluded by !**/*.png
• frontend/public/journal-founding.png is excluded by !**/*.png
• frontend/public/kofi-symbol.png is excluded by !**/*.png

📒 Files selected for processing (75)

• frontend/e2e/landing-graph.spec.ts
• frontend/e2e/public-seo.spec.ts
• frontend/eslint-suppressions.json
• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/companion/primitives.tsx
• frontend/src/components/landing-v5/ActGraph.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/ActTutor.tsx
• frontend/src/components/landing-v5/Closing.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/Faq.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/components/landing-v5/Gallery.tsx
• frontend/src/components/landing-v5/Hero.tsx
• frontend/src/components/landing-v5/IntroOverlay.tsx
• frontend/src/components/landing-v5/Journal.tsx
• frontend/src/components/landing-v5/Navbar.tsx
• frontend/src/components/landing-v5/galleryMinis.tsx
• frontend/src/components/landing-v5/lab/CalendarDemo.tsx
• frontend/src/components/landing-v5/lab/CardsDemo.tsx
• frontend/src/components/landing-v5/lab/GradesDemo.tsx
• frontend/src/components/landing-v5/lab/GuideDemo.tsx
• frontend/src/components/landing-v5/lab/LabShell.tsx
• frontend/src/components/landing-v5/lab/NotesDemo.tsx
• frontend/src/components/landing-v5/lab/QuizDemo.tsx
• frontend/src/components/landing-v5/lab/RoomsDemo.tsx
• frontend/src/components/landing-v5/lab/TutorDemo.tsx
• frontend/src/components/landing-v5/lab/index.tsx
• frontend/src/components/landing-v5/lab/labData.ts
• frontend/src/components/landing-v5/navTheme.ts
• frontend/src/components/landing/useLanding.ts
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx
• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/lib/landing/color.ts
• frontend/src/lib/landing/companionContent.ts
• frontend/src/lib/landing/content.ts
• frontend/src/lib/landing/course.ts
• frontend/src/lib/landing/dragClusters.ts
• frontend/src/lib/landing/engine/ambient.ts
• frontend/src/lib/landing/engine/dom.ts
• frontend/src/lib/landing/engine/flip.ts
• frontend/src/lib/landing/engine/graph.ts
• frontend/src/lib/landing/engine/graphView.ts
• frontend/src/lib/landing/engine/hero.ts
• frontend/src/lib/landing/engine/index.ts
• frontend/src/lib/landing/engine/marquee.ts
• frontend/src/lib/landing/engine/measure.ts
• frontend/src/lib/landing/engine/plant.ts
• frontend/src/lib/landing/engine/sim.ts
• frontend/src/lib/landing/hero3d/cardTexture.ts
• frontend/src/lib/landing/hero3d/index.ts

💤 Files with no reviewable changes (20)

• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/e2e/landing-graph.spec.ts
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

Use kebab-case keyframe names.

Stylelint reports every new camelCase keyframe identifier against keyframes-name-pattern. This leaves lint errors in the changed stylesheet. Rename the declarations to kebab case and update every matching animation or animation-name reference in the same change.

Also applies to: 2031-2033, 2082-2082, 2094-2096

🧰 Tools

🪛 Stylelint (17.14.0)

[error] 1957-1957: Expected keyframe name "s1Stem" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1958-1958: Expected keyframe name "s1LeafLo" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1964-1964: Expected keyframe name "s1LeafHi" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1970-1970: Expected keyframe name "s1Bud" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1971-1971: Expected keyframe name "s1Word" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1972-1972: Expected keyframe name "s1Rule" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1975-1975: Expected keyframe name "saplingBlob" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1976-1976: Expected keyframe name "introOrbit" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1977-1977: Expected keyframe name "floatIndicator" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1978-1978: Expected keyframe name "betaGlow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1979-1979: Expected keyframe name "nodeFloatA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1980-1980: Expected keyframe name "nodeFloatB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1983-1983: Expected keyframe name "popHold" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1984-1984: Expected keyframe name "chipSwapA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1985-1985: Expected keyframe name "chipSwapB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1986-1986: Expected keyframe name "flipLoop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1987-1987: Expected keyframe name "lineReveal" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1988-1988: Expected keyframe name "underSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1989-1989: Expected keyframe name "barGrow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1990-1990: Expected keyframe name "coverRise" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1991-1991: Expected keyframe name "ringDraw" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1992-1992: Expected keyframe name "gaugeFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1993-1993: Expected keyframe name "answerTick" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1994-1994: Expected keyframe name "waveBar" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1995-1995: Expected keyframe name "gaugeMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1996-1996: Expected keyframe name "coverMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1997-1997: Expected keyframe name "cursorMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1998-1998: Expected keyframe name "cardFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1999-1999: Expected keyframe name "scanSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2000-2000: Expected keyframe name "ocrBlink" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2001-2001: Expected keyframe name "panelFade" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2002-2002: Expected keyframe name "fillX" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2003-2003: Expected keyframe name "typingDot" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2004-2004: Expected keyframe name "ringPop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2005-2005: Expected keyframe name "cursorDrift" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/globals.css` around lines 1957 - 2005, Rename the camelCase
keyframe declarations in the affected stylesheet to kebab-case, including
symbols such as s1Stem, saplingBlob, introOrbit, popHold, and the additional
reported ranges. Update every corresponding animation and animation-name
reference to the new kebab-case identifiers, preserving all animation behavior.

Source: Linters/SAST tools

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

The overlay is a modal without dialog semantics or focus management.

The panel covers the viewport at zIndex: 80 and the caller locks body scroll. Three parts are missing:

• No role="dialog" and no aria-modal="true", so assistive technology does not announce a modal context.
• No accessible name on the container.
• No focus management. Focus stays on the gallery card behind the overlay, tabbing walks the page underneath, and closing does not return focus to the card that opened the panel.

Escape already closes the panel through useLanding.ts lines 272-276, so only the semantics and focus handling remain.

♿ Proposed direction

- <div style={{ position: 'fixed', inset: 0, zIndex: 80 }}>+ <div+ role="dialog"+ aria-modal="true"+ aria-label={`${g.kicker} demo`}+ style={{ position: 'fixed', inset: 0, zIndex: 80 }}+ >

Then move focus into the panel when it mounts, keep Tab inside it while it is open, and restore focus to the element captured by armFlip when it closes. frontend/src/lib/landing/engine/flip.ts already holds that element in FlipState.el.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 41 - 50,
Update the modal container identified by panelRef in FeatureLab to add
role="dialog", aria-modal="true", and an accessible name. On mount, move focus
into the panel; while open, trap Tab navigation within it so focus cannot reach
the page behind the overlay. Capture and restore focus to the triggering element
stored in FlipState.el when the panel closes, while preserving the existing
Escape close behavior.

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win

The gallery cards cannot be opened with a keyboard.

Opening the feature lab depends on the onClick delegation on the track div at lines 99-102. Card renders an <article> with no tabIndex, no role, and no key handler, and the track div has no key handler either. A keyboard user cannot reach or activate any card, so the feature lab is unreachable without a pointer. The doc comment at lines 14-15 states that the first copy is reachable by keyboard, which does not match the markup.

Make each non-ghost card an activatable control, keep the duplicate copies out of the tab order, and then correct the doc comment.

♿ Proposed fix

-function Card({ i, ghost }: { i: number; ghost: boolean }) {+function Card({ i, ghost, onOpen }: { i: number; ghost: boolean; onOpen: (i: number, el: HTMLElement | null) => void }) {
const c = CARDS[i];
return (
<article
data-tk={i}
aria-hidden={ghost || undefined}
+ role="button"+ tabIndex={ghost ? -1 : 0}+ aria-label={`Open ${c.kicker}`}+ onKeyDown={(e) => {+ if (e.key !== 'Enter' && e.key !== ' ') return;+ e.preventDefault();+ onOpen(i, e.currentTarget);+ }}
style={CARD}
className="ld-galcard"
>

- {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} />)}- {order.map((i) => <Card key={`b${i}`} i={i} ghost />)}+ {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} onOpen={onOpen} />)}+ {order.map((i) => <Card key={`b${i}`} i={i} ghost onOpen={onOpen} />)}

Add a visible focus style for .ld-galcard:focus-visible in globals.css.

Also applies to: 96-107

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 62 - 85, Update
Card so non-ghost cards are keyboard-focusable and activatable, using the
existing track click-delegation contract, while ghost duplicates remain excluded
from the tab order and accessibility tree. Add the corresponding keyboard
activation handling to the card or track using the existing feature-lab target
behavior, and correct the nearby doc comment to match the implemented
accessibility behavior. Add a visible .ld-galcard:focus-visible style in
globals.css.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

Handler timeouts are created without a ref, so they are never cancelled. Both demos schedule a state update from an event handler without storing the handle. The timeout cannot be cleared on unmount, and a second click cannot cancel a pending one. The other demos in this layer already hold each handle in a useRef and clear it in an unmount effect.

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44: store the 300 ms advance timeout in a ref, clear it before each new rating, and clear it on unmount; delete the returned cleanup, which React never calls.
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80: store the 700 ms extract and summarize timeouts in refs and clear them in the existing unmount effect beside saveT.

📍 Affects 2 files

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44 (this comment)
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 37 - 44,
Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout in the rate handler is
stored in a useRef, cleared before scheduling each new rating and during
unmount, and remove the ineffective returned cleanup. Update NotesDemo.tsx at
lines 57-80 so the 700 ms extract and summarize timeouts use refs and are
cleared in the existing unmount effect alongside saveT.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

RECENT[].pick values are not options of the exam select.

openRecent at line 53 sets exam to r.pick. 'Midterm 1 · Sep 30' is not in GUIDES['MA 242'].exams, and 'Quiz 2 · Oct 03' is not in GUIDES['CS 201'].exams. The controlled select at line 76 then falls back to displaying its first option while the guide heading at line 104 prints exam. The control and the heading disagree, and the user cannot select the displayed exam again.

Use an exam that exists in the course fixture, or add the recent exam to the option list when it is selected.

🔧 Proposed fix using existing fixture values

 const RECENT = [
- { i: 0, exam: 'MA 242 · Midterm 1', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Midterm 1 · Sep 30' },- { i: 1, exam: 'CS 201 · Quiz 2', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Quiz 2 · Oct 03' },+ { i: 0, exam: 'MA 242 · Final', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Final · Dec 12' },+ { i: 1, exam: 'CS 201 · Midterm 1', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Midterm 1 · Oct 17' },
];

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	constRECENT=[
	{i: 0,exam: 'MA 242 · Midterm 1',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Midterm 1 · Sep 30'},
	{i: 1,exam: 'CS 201 · Quiz 2',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Quiz 2 · Oct 03'},
	];
	constRECENT=[
	{i: 0,exam: 'MA 242 · Final',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Final · Dec 12'},
	{i: 1,exam: 'CS 201 · Midterm 1',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Midterm 1 · Oct 17'},
	];

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx` around lines 21 - 24,
Update the RECENT entries’ pick values to exactly match an existing exam option
in the corresponding GUIDES course fixture, preserving openRecent’s assignment
and keeping the select value consistent with the guide heading.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

role="radiogroup" has no radio children.

The container declares role="radiogroup", but each option is a plain <button>. A radiogroup requires children with role="radio" and aria-checked. Assistive technology cannot report which option is selected. Add the roles and state, or drop role="radiogroup" and expose selection with aria-pressed.

♿ Proposed fix

 <button
key={o.label}
type="button"
+ role="radio"+ aria-checked={isPicked}+ aria-disabled={reviewing}
onClick={() => { if (!reviewing) setPicked(o.label); }}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='#E3E0D5',bg='#FDFCF9',fg='#33443B',mark='',markCol='';
	if(reviewing&&correct){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';mark='CORRECT';markCol='#0C5638';}
	elseif(reviewing&&isPicked){bd='#b25855';bg='rgba(178,88,85,0.09)';fg='#9c4b48';mark='YOUR PICK';markCol='#9c4b48';}
	elseif(isPicked){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';}
	return(
	<button
	key={o.label}
	type="button"
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '#0E9E5A' : '#9AA5A0'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}
	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='`#E3E0D5`',bg='`#FDFCF9`',fg='`#33443B`',mark='',markCol='';
	if(reviewing&&correct){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';mark='CORRECT';markCol='`#0C5638`';}
	elseif(reviewing&&isPicked){bd='`#b25855`';bg='rgba(178,88,85,0.09)';fg='`#9c4b48`';mark='YOUR PICK';markCol='`#9c4b48`';}
	elseif(isPicked){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';}
	return(
	<button
	key={o.label}
	type="button"
	role="radio"
	aria-checked={isPicked}
	aria-disabled={reviewing}
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '`#0E9E5A`' : '`#9AA5A0`'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 104 - 124,
Fix the quiz option accessibility semantics in the q.options mapping: either
make each button a radio with role="radio" and aria-checked bound to isPicked
while retaining the radiogroup, or remove the radiogroup role and expose
isPicked through aria-pressed. Preserve the existing selection and reviewing
behavior in the option onClick handler.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

The hero canvas effect can start a loop that is never stopped.

import('@/lib/landing/engine/hero') resolves asynchronously. If the component unmounts before the promise resolves, the cleanup at line 222 runs while stopped is still null. The then callback then calls startHeroCanvas, which installs a requestAnimationFrame loop and a resize listener (see frontend/src/lib/landing/engine/hero.ts lines 83-87). Nothing cancels them afterwards, so the loop keeps drawing after navigation away from the landing page.

The WebGL effect at lines 227-244 already uses a cancelled flag. Apply the same pattern here.

🛠️ Proposed fix

 let stopped: { stop(): void } | null = null;
+ let cancelled = false;
// imported lazily so the module isn't pulled into the server bundle
import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas }) => {
+ if (cancelled) return;
stopped = startHeroCanvas(canvas, () => engine.mouse, () => engine.parallaxY);
});
- return () => stopped?.stop();+ return () => {+ cancelled = true;+ stopped?.stop();+ };

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	// imported lazily so the module isn't pulled into the server bundle
	import('@/lib/landing/engine/hero').then(({ startHeroCanvas })=>{
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>stopped?.stop();
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);
	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	letcancelled=false;
	// imported lazily so the module isn't pulled into the server bundle
	import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas })=>{
	if(cancelled)return;
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>{
	cancelled=true;
	stopped?.stop();
	};
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 213 - 224, Update
the hero canvas useEffect around startHeroCanvas to track a cancelled/unmounted
flag. Set it during cleanup, check it after the asynchronous hero module import
resolves before starting the canvas, and stop the returned controller when
appropriate so no animation loop or resize listener remains after unmount.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | 🏗️ Heavy lift

destroy() discards the re-homed clusters, so the field cannot be rebuilt.

ensureInit moves every cluster element out of its .drag-field and into the overlay (line 172), and it mutates the cluster's inline styles (lines 165-171). destroy() removes the shell through the queued cleanup, which deletes those cluster elements from the document. It does not put them back.

Two consequences:

1. A second ensureInit on the same DOM finds .drag-field elements with no [data-dragnode] children, returns false at line 232, and the field stays empty forever. This happens on any stop/start cycle, including the React StrictMode double-invoke of the engine effect in frontend/src/components/landing/useLanding.ts lines 162-210.
2. React still owns those cluster nodes, because DragField rendered them. React records the original parent for each child. Removing or reparenting the nodes outside React can make the later unmount removal fail.

Restore each cluster to its original parent and clear the inline styles that ensureInit set.

🛠️ Proposed fix: remember the original parent and restore it on destroy

 interface ClusterAnchor {
el: HTMLElement;
field: HTMLElement;
+ /** Where the cluster lived before it was re-homed into the overlay. */+ home: Node | null;+ before: Node | null;
/** The pinned act this field belongs to, if any — drives the scroll drift. */
sect: HTMLElement | null;
left: number;
top: number;
}

 anchors.push({
el: cl, field, sect,
+ home: cl.parentNode,+ before: cl.nextSibling,
left: b.left - fb.left,
top: b.top - fb.top,
});

 function destroy(): void {
+ // put the clusters back before the overlay goes away, otherwise React+ // still owns nodes that no longer exist and a later ensureInit finds+ // empty fields+ for (const a of anchors) {+ a.el.style.cssText = '';+ if (a.home) a.home.insertBefore(a.el, a.before);+ }
cleanups.forEach((fn) => fn());
cleanups.length = 0;
anchors.length = 0;
groups = null;
- if (overlay && overlay.parentElement) overlay.parentElement.removeChild(overlay);
overlay = null;
}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 423 - 430, Update the
initialization and destroy flow around ensureInit and destroy to retain each
cluster element’s original parent before moving it into the overlay. During
destroy, restore every cluster to that parent, clear the inline styles applied
by ensureInit, then remove the overlay and reset state so a later ensureInit can
rebuild the field without disrupting React-owned nodes.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/landing-v5/BetaModal.tsx`:
- Around line 52-70: Update the subscribed confirmation branch in BetaModal so
the rendered Close button receives focus after the form is replaced. Add a ref
to that button and focus it after the subscribed state commits, using the
component’s existing lifecycle pattern; preserve the current onClose behavior
and button styling.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ee1ca146-7600-423b-98c7-56bcec09e4e1

📥 Commits

Reviewing files that changed from the base of the PR and between 741ec10 and e506827.

📒 Files selected for processing (13)

• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/BetaModal.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/lib/landing/content.ts

💤 Files with no reviewable changes (2)

• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx

🚧 Files skipped from review as they are similar to previous changes (5)

• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/lib/landing/content.ts

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

Restore modal focus after the subscribed state replaces the form.

When subscribed becomes true, this branch unmounts the focused email input while Dialog remains open. Dialog only applies its initial focus when open changes. Focus can then leave the dialog and bypass its Tab trap. Move focus to the Close button after the confirmation state renders.

Proposed fix

-import { useId, useRef } from 'react';+import { useEffect, useId, useRef } from 'react';
...
const inputRef = useRef<HTMLInputElement>(null);
+ const confirmationCloseRef = useRef<HTMLButtonElement>(null);
const headingId = useId();
const valid = email.includes('@');
++ useEffect(() => {+ if (open && subscribed) confirmationCloseRef.current?.focus();+ }, [open, subscribed]);
...
<button
+ ref={confirmationCloseRef}
onClick={onClose}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '#12201A',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '#0C5638'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '#61726A',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '#0C5638',color: '#fff',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>
	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '`#12201A`',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '`#0C5638`'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '`#61726A`',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	ref={confirmationCloseRef}
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '`#0C5638`',color: '`#fff`',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/BetaModal.tsx` around lines 52 - 70,
Update the subscribed confirmation branch in BetaModal so the rendered Close
button receives focus after the form is replaced. Add a ref to that button and
focus it after the subscribed state commits, using the component’s existing
lifecycle pattern; preserve the current onClose behavior and button styling.

[Darkest-Teddy]

Ports Sapling Landing v5.dc.html (from docs/frontend-audit/Sapling landing page import (1).zip) into the Next.js frontend. v5 is now the landing page at /, replacing the previous marketing landing.

Supersedes #523. Based on feat/landing-v4-port, so its four commits ride along — v5 reuses that branch's scroll engine, course-graph model and editorial content. If v5 is the direction, #523 can be closed unmerged.

The title screen is a ground-up rebuild

Not a v4 tweak. Reading the source rather than the summary that accompanied the task turned up six divergences:

	Assumed	Actual v5 source
Wordmark	Archivo 800, ink #12201A	Playfair Display 600, #0C5638
Reveal	heroWipe clip-path	character scramble — heroWipe is defined, never referenced
Eyebrow	mono "GROW YOUR KNOWLEDGE"	Playfair "Grow Your Knowledge", title case, scrambled
Cascade	—	tagline leads (760ms), wordmark follows 260ms behind — v4 ran the reverse
Right bloom	mirrored green	teal rgba(43,140,150,0.2)
Panel rig	CSS perspective cards	three.js WebGL scene

Act III is likewise not the clipped 918×348 card track described in the brief — the source has a rotating triangular-prism carousel.

The v4 title screen was deleted rather than kept alongside. three/@types/three were already dependencies.

Four dead branches in the source

The design component carries a lot of machinery its own markup never reaches. Documented at each site:

1. const wantDark = false — the navbar's full two-theme colour table is built, then pinned to light. Wired live here, driven off the section under the viewport centre, as the brief calls for.
2. heroWipe / heroChar keyframes — defined, unreferenced. Not ported.
3. setHero0/1/2 + mode pills — exist only in renderVals(), so heroMode is pinned at 0 and only the panel scene can ever be seen. The constellation and growth-field shaders are unreachable; porting them would be porting dead code.
4. "Plant a concept" — plantVal, plantedCount, _plant(), a localStorage-backed grove and a canvas ref, none of it referenced. The CTA is heading + line + button.

Two engine bugs fixed

Both pre-existing in the v4 port, both invisible until a section actually had drag clusters:

• sim.ts reads a ring's halo via previousElementSibling and its caption via nextElementSibling; a <g> wrapper broke the adjacency and it threw on a null label.
• Clusters were anchored once, in page coordinates. The source captures each cluster's offset within its field, parks the overlay in a position:fixed shell, and re-applies anchor + field.rect every frame — which is what lets a cluster track its sticky section, and where the ≤150px drift inside a pinned act comes from.

Verified against the original served side by side: at 45% through act-tutor the source puts its 7 rings on screen at y≈121–608. This port now matches; before the fix it was 0 of 7, parked 8752px down.

Generated, not retyped

• galleryMinis.tsx — the 8 card miniatures, mechanically converted from the source's <article data-tk> blocks. Dense decorative animation where exact geometry and per-element delays are the effect. Regenerate rather than hand-edit.
• dragClusters.ts — the 8 course clusters, ~2KB of inline SVG each in the source, reduced to data + one component.
• companionContent.ts — 18 copy arrays lifted verbatim from the sibling pages.

Also in this PR

• The old marketing landing is retired. Deleting / orphaned marketing/graph/ (~95KB of passing tests for a surface no route mounts), marketing/surfaces/, FeatureBand, SurfaceBento, featureBands. HeroCard/SignInModal stay — the nav's Sign In opens the real OAuth modal.
• e2e/landing-graph.spec.ts goes with the component it pinned. public-seo.spec.ts's SSR guard is retargeted, not deleted: its failure mode (an ssr: false silently dropping the landing's copy from crawled HTML) outlived its selectors, and is sharper on a canvas/WebGL page. It deliberately does not assert the wordmark — that scrambles in client-side, so the h1's aria-label is checked instead. All 7 assertions verified against raw SSR output.
• The five companion pages the nav links to (/team, /wiki, /gallery, /news, /faq). Once v5 took /, those links 404'd. They use the warm paper palette deliberately — that is not a mistake to unify.

Known gaps

• Feature lab demo pane. The source mounts a separate FeatureLab design component per kind via <dc-import> — a distinct 75KB file the task's file list did not scope in. Layout, FLIP, rail, copy and close are faithful; the pane shows the card's miniature enlarged.
• Gallery tiles have no artwork — the import ships no screenshots.

Verification

• tsc --noEmit exit 0 · eslint exit 0 · next build exit 0, all 5 new routes prerendered static
• Unit suite 59 files / 423 tests passing
• Every section walked in a real browser at multiple scroll positions, no console errors; all 9 public routes return 200

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features
  • Introduced a redesigned landing experience with interactive knowledge graphs, tutoring modes, feature demos, gallery, journal, FAQ, and beta signup.
  • Added public FAQ, Gallery, News, Team, and Wiki pages with responsive navigation and searchable or filterable content.
  • Added interactive demonstrations for quizzes, flashcards, grades, calendars, notes, study rooms, guides, and tutoring.
• Documentation
  • Improved server-rendered landing-page checks for key accessible content and beta messaging.
• Refactor
  • Retired the previous marketing sections and legacy landing-page presentation.

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ebab108d-0405-4ae1-8d00-108ba83a0144

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Replaced the landing page with a component-based v5 experience, added interactive feature labs and companion pages, introduced shared animation engines and content data, and updated SSR coverage. Removed the former marketing graph, surface components, and related tests.

Changes

Landing v5 experience

Layer / File(s)	Summary
Landing content and data contracts frontend/src/lib/landing/*	Added landing content, course graph data, drag clusters, color utilities, and companion-page datasets.
Animation and interaction engines frontend/src/lib/landing/engine/*, frontend/src/lib/landing/hero3d/*	Added graph rendering, canvas effects, layout measurement, marquee and FLIP behavior, planting, drag simulation, and WebGL hero support.
Landing composition frontend/src/app/(public)/page.tsx, frontend/src/components/landing-v5/*, frontend/src/components/landing/useLanding.ts	Replaced the previous landing implementation with v5 hero, graph, ingest, tutor, gallery, FAQ, journal, CTA, navigation, modal, and lifecycle components.
Interactive feature labs frontend/src/components/landing-v5/lab/*	Added interactive quiz, flashcard, guide, grade, calendar, notes, rooms, and tutor demos with shared fixture data and controls.
Companion pages frontend/src/components/companion/*, frontend/src/app/(public)/{about,team,wiki,faq,gallery,news}/*	Added shared companion navigation and public About, Team, Wiki, FAQ, Gallery, and News routes.
Styling and SSR validation frontend/src/app/globals.css, frontend/e2e/public-seo.spec.ts, frontend/eslint-suppressions.json, frontend/src/lib/api.ts	Added scoped landing and companion styles, responsive animations, newsletter API wiring, and SSR checks for landing-page copy. Removed obsolete ESLint suppressions.

Estimated code review effort: 5 (Critical) | ~120 minutes

Possibly related PRs

• SaplingLearn/Sapling#513: Replaced the related knowledge-graph landing implementation and its supporting components.
• SaplingLearn/Sapling#63: Uses the same beta/newsletter signup flow implemented through BetaModal.
• SaplingLearn/Sapling#286: Also modifies the public landing page and shared styling layer.

Suggested reviewers:andresl230

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 36.59% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the primary change: porting Sapling Landing v5 into the landing page.
Description check	✅ Passed	The description explains the purpose, major changes, known gaps, related issue context, and verification results in substantial detail.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/landing-v5-port

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[supabase]

This pull request has been ignored for the connected project ybgqdonkoqftwrmweuyv because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[cloudflare-workers-and-pages]

Deploying with Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	frontend-staging	fc36068	Commit Preview URL Branch Preview URL	Aug 16 2026, 09:58 PM

[coderabbitai]

Actionable comments posted: 8

Note

Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.

🟡 Minor comments (14)

frontend/src/components/landing-v5/lab/NotesDemo.tsx-57-80 (1)

57-80: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

extract and summarize timeouts are untracked.

saveT is cleared on unmount, but the 700 ms timeouts at line 60 and line 71 are not stored and not cleared. If the lab panel closes within that window, the callbacks still run and set state on an unmounted component. Hold both handles in refs and clear them in the existing unmount effect.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` around lines 57 - 80,
Update the extract and summarize timeout flows to store their setTimeout handles
in dedicated refs, and clear both refs in the existing unmount effect alongside
saveT. Ensure the callbacks still perform their current state updates when they
complete, while preventing them from running after the component unmounts.

frontend/src/components/landing-v5/lab/CardsDemo.tsx-46-53 (1)

46-53: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The global space handler blocks button activation.

The keydown listener calls e.preventDefault() for every space press on window. A focused button then cannot be activated with space, including "Study again" at line 90. Skip the flip and the preventDefault call when the event target is an interactive element.

♿ Proposed fix

 const onKey = (e: KeyboardEvent) => {
+ const el = e.target as HTMLElement | null;+ if (el?.closest('button, input, textarea, select, [contenteditable]')) return;
if (e.key === ' ') { e.preventDefault(); flip(); }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 46 - 53,
Update the keydown handler in the useEffect to detect when the event target is
an interactive element, such as a button or link, and skip both flip() and
preventDefault() for those targets. Preserve the existing global space-to-flip
and rate-key behavior for non-interactive targets.

frontend/src/components/landing-v5/lab/NotesDemo.tsx-63-63 (1)

63-63: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The "no concepts" sentinel is counted as a linked concept.

When no matcher hits, concepts receives one placeholder entry. The footer at line 141 then renders "1 concepts linked to your MA 242 graph." The count is wrong and contradicts the placeholder. Keep concepts empty and track the empty result separately.

🔧 Proposed fix

+ const [ran, setRan] = useState(false);
@@
- setConcepts(found.length ? found : [{ name: 'No concepts found', tier: 'unexplored' }]);+ setConcepts(found);+ setRan(true);
setBusy(false);
@@
+ {ran && concepts.length === 0 && !busy && (+ <span style={{ fontSize: 12, color: '`#9AA5A0`' }}>No concepts found.</span>+ )}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` at line 63, Update the
concept-loading logic around the setConcepts call to keep concepts empty when
found has no matches instead of inserting a “No concepts found” sentinel; track
the empty-result state separately and use it for the empty-state display while
ensuring the footer count reflects only actual linked concepts.

frontend/src/lib/landing/engine/dom.ts-49-73 (1)

49-73: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Do not cache a zero-sized canvas measurement.

cv() caches w/h from clientWidth/clientHeight on the first call. The cache is dropped only by invalidateCanvas, which measure() calls only when the viewport dimensions change (see frontend/src/lib/landing/engine/measure.ts lines 98-104). If the first cv() call happens while the canvas is not laid out yet, or while its section is hidden, the cache stores 0 × 0. Every later frame then draws into a 0-pixel backing store, and the canvas stays blank until the viewport itself changes.

Skip the cache write when the measured size is zero, so the next frame re-reads it.

🐛 Proposed fix

 if (!c) {
const w = canvas.clientWidth;
const h = canvas.clientHeight;
const dpr = Math.min(window.devicePixelRatio || 1, 1.5);
let ctx = rec.__ctx as CanvasRenderingContext2D | undefined;
if (!ctx) {
ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
rec.__ctx = ctx;
}
c = { ctx, w, h, dpr };
- rec.__cv = c;+ // An unlaid-out or hidden canvas measures 0; don't freeze that in the+ // cache, or the next frames draw into a 0-pixel backing store.+ if (w > 0 && h > 0) rec.__cv = c;
const pw = Math.round(w * dpr);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/dom.ts` around lines 49 - 73, Update cv so
zero-sized measurements are not stored in the CanvasCache: when clientWidth or
clientHeight is zero, avoid assigning the newly measured cache to rec.__cv while
preserving the current context and sizing behavior. Ensure subsequent calls
re-read dimensions until both measurements are nonzero, while retaining normal
caching for valid sizes.

frontend/src/components/landing-v5/Journal.tsx-96-101 (1)

96-101: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Each post card links back to its own section.

href="#newsletter" points at the section that contains the card. The card presents as a link to an article, and activating it does nothing. This PR adds a /news route. Point each card at the article, or at /news until per-post routes exist.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 96 - 101, Update
the post card anchor in the Journal component to navigate to the new /news route
instead of the containing `#newsletter` section, while preserving the existing
card styling and behavior.

frontend/src/lib/landing/engine/sim.ts-184-203 (1)

184-203: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Label binding depends on an SVG sibling order that the markup does not guarantee.engine/sim.ts locates a node's caption through ring.nextElementSibling and casts it to SVGTextElement, while DragField renders that <text> only when a label exists for the node. When a label is missing, the sim binds the following node's glow <circle> and writes x/y onto it every frame, and ly becomes NaN.

• frontend/src/lib/landing/engine/sim.ts#L184-L203: check nextElementSibling.tagName === 'text' before the cast, type SimNode.label as SVGTextElement | null, and skip the label writes at lines 377-378 when it is null.
• frontend/src/components/landing-v5/DragField.tsx#L60-L92: alternatively, or in addition, always emit a <text> element per node so the documented glow → ring → label order holds for every node.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 184 - 203, Prevent
incorrect label binding in sim.ts by verifying ring.nextElementSibling is a text
element before assigning it, type SimNode.label as SVGTextElement | null, and
skip label position updates when it is null; update DragField.tsx to always
render a text element per node so the expected glow, ring, label order is
maintained.

frontend/src/components/landing-v5/Faq.tsx-66-71 (1)

66-71: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

"Read the full FAQ" links to its own section.

href="#faq" targets the section that contains the link, so the control does nothing. This PR adds a /faq route. Point the link there.

🔗 Proposed fix

- <a href="`#faq`" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>+ <a href="/faq" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 66 - 71, Update the
“Read the full FAQ” anchor in the FAQ component to navigate to the newly added
/faq route instead of the local `#faq` section, preserving its existing styling
and text.

frontend/src/components/landing-v5/Journal.tsx-184-199 (1)

184-199: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Set type="email" and guard the current submit flow.

The Journal input is an email address, so use type="email" for mobile keyboard and browser validation. The current actions.subscribe, at frontend/src/components/landing/useLanding.ts:624, only checks email.includes('@') and sets local subscribed state. If this should be a stub, make that intent explicit; otherwise wire onSubscribe to a newsletter endpoint before showing “You’re on the tree”.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 184 - 199,
Update the Journal email input in the landing component to use type="email" and
preserve the existing onSubscribe flow only as an explicit stub, or wire
onSubscribe to the newsletter endpoint and show the subscribed state only after
a successful submission. Locate the handler through actions.subscribe/useLanding
and ensure invalid emails cannot enter the success state.

frontend/src/components/landing-v5/Faq.tsx-79-116 (1)

79-116: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Closed answers stay in the accessibility tree, and the button has no aria-controls.

The collapsed panel uses maxHeight: 0, opacity: 0, and overflow: hidden. None of these remove the content from assistive technology, so a screen reader reads every answer even when the accordion is closed. The button also declares aria-expanded without naming the region it controls.

Add aria-controls with a stable id, and set aria-hidden on the panel while it is closed. aria-hidden does not disturb the max-height transition, because the content holds no focusable elements.

♿ Proposed fix

 <button
onClick={() => onToggle(open ? -1 : i)}
aria-expanded={open}
+ aria-controls={`faq-answer-${i}`}
style={{ width: '100%', background: 'none', border: 'none', cursor: 'pointer', padding: '22px 4px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 20, textAlign: 'left' }}
>

 <div
+ id={`faq-answer-${i}`}+ role="region"+ aria-hidden={!open}
style={{

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 79 - 116, Update the
FAQ accordion around the toggle button and answer panel to give each panel a
stable unique id, reference it from the button via aria-controls, and set
aria-hidden based on the open state so closed answers are excluded from the
accessibility tree. Preserve the existing visual transition and aria-expanded
behavior.

frontend/src/components/landing-v5/Navbar.tsx-199-235 (1)

199-235: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

role="menu" is applied to navigation disclosures whose children are not menu items. Both new navigation panels declare role="menu", but their children are plain button elements and next/link anchors. The ARIA menu pattern permits only menuitem, menuitemradio, and menuitemcheckbox children, so screen readers report both groups incorrectly. Both panels are page navigation, not application menus, so the correct fix in each place is to remove the role rather than to add menuitem roles.

• frontend/src/components/landing-v5/Navbar.tsx#L199-L235: remove role="menu" from the compact panel, and remove aria-haspopup="menu" from the trigger at line 120. Keep aria-expanded.
• frontend/src/components/landing-v5/Closing.tsx#L154-L182: remove role="menu" from the jump panel, and remove aria-haspopup="menu" from the pill at line 188. The enclosing nav with aria-label="Page sections" already carries the correct semantics.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Navbar.tsx` around lines 199 - 235, The
navigation disclosures use menu semantics with ordinary links and buttons;
remove those menu roles and triggers’ menu-haspopup attributes. In
frontend/src/components/landing-v5/Navbar.tsx lines 199-235, remove role="menu"
from the compact panel and remove aria-haspopup="menu" from its trigger while
retaining aria-expanded. In frontend/src/components/landing-v5/Closing.tsx lines
154-182, remove role="menu" from the jump panel and remove aria-haspopup="menu"
from the pill trigger; keep the enclosing navigation semantics and existing
expansion state.

frontend/src/app/(public)/page.tsx-115-116 (1)

115-116: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Clear the deferred openGal timers on unmount.

actions.openGal schedules actions.enterExplore / actions.openGal 260 ms later from onQuiz and onLearn. If the page unmounts before those timers fire, openGal runs after cleanup and writes document.body.style.overflow = 'hidden' after the landing cleanup reset that overflow. Keep the timer refs in useLanding so cleanup can call clearTimeout for them.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/page.tsx around lines 115 - 116, Update useLanding
and the onQuiz/onLearn handlers to store each 260 ms openGal timeout in refs,
rather than discarding the timer IDs. In the landing cleanup, clear both
deferred timers before resetting document.body overflow, preventing
actions.openGal from running after unmount.

frontend/src/components/landing-v5/ActTutor.tsx-93-109 (1)

93-109: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Expose the selected tutor mode, and keep the hidden pills out of the tab order.

Two gaps in this control group:

1. The pills are a mode selector, but the selected state is carried only by background and color. Assistive technology cannot report which mode is active. Add aria-pressed={tutorMode === i}.
2. The container starts at opacity: 0 with pointerEvents: 'none', and the engine fades it in later. The buttons stay focusable while invisible, so a keyboard user can focus a control that is not visible. Mirror the visual state in the tab order.

Also add type="button", which the other sections in this PR set consistently.

♻️ Proposed fix for the pill group

- {CAPTIONS.map(([tag], i) => (- <button- key={tag}- onClick={() => onSetMode(i)}+ {CAPTIONS.map(([tag], i) => (+ <button+ key={tag}+ type="button"+ aria-pressed={tutorMode === i}+ onClick={() => onSetMode(i)}

The engine already writes opacity on the container. Have it also clear visibility or the inert attribute so the pills leave the tab order until the handover:

- <div data-tutor-pills="1" style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>+ <div data-tutor-pills="1" inert style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActTutor.tsx` around lines 93 - 109,
Update the tutor pill group in ActTutor’s CAPTIONS map to add type="button" and
aria-pressed={tutorMode === i} to each button. Keep the hidden container’s
buttons out of the tab order while the engine-controlled opacity is zero by
mirroring its hidden state with inert or an equivalent visibility-based
mechanism, and ensure the existing handover clears that state when the pills
become visible.

frontend/src/components/landing-v5/ActGraph.tsx-333-340 (1)

333-340: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Add an Escape key exit for explore mode.

Explore mode covers the act and closes the navbar, but useLanding only handles Escape for gallery and jump controls. If explore mode is active, call onExitExplore from the key handler so keyboard-only users can leave the mode safely.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActGraph.tsx` around lines 333 - 340,
Update the existing keyboard handler in useLanding to detect Escape while
explore mode is active and call onExitExplore. Preserve the current Escape
behavior for gallery and jump controls, and ensure the explore-mode exit path is
available to keyboard-only users.

frontend/src/lib/landing/hero3d/index.ts-175-189 (1)

175-189: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Release the WebGL context in stop().

stop() already disposes three.js resources and cancels the render loop. WebGLRenderer.dispose() does not release the WebGL context, and this rig creates a new context on its canvas each mount. Add renderer.forceContextLoss() after renderer.dispose() so repeated navigation can reclaim the browser contexts sooner.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/hero3d/index.ts` around lines 175 - 189, Update the
returned stop() method to call renderer.forceContextLoss() immediately after
renderer.dispose(), ensuring the WebGL context is released during cleanup while
preserving the existing resource disposal and animation cancellation behavior.

🧹 Nitpick comments (14)

frontend/src/components/landing-v5/lab/LabShell.tsx (1)

51-84: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Segmented is unused; two demos duplicate it inline.

The comment states that the tutor and calendar demos use this control. They do not import it. CalendarDemo.tsx lines 61-76 and TutorDemo.tsx lines 65-80 each contain an inline copy of the same markup and style logic. Use Segmented in both demos, or delete it and correct the comment.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx` around lines 51 - 84,
Resolve the unused Segmented component by replacing the duplicated inline
segmented-control markup in CalendarDemo and TutorDemo with the shared Segmented
component, passing each demo’s options, current value, and change handler.
Preserve the existing labels, selection behavior, and styling, and keep the
component’s public API unchanged.

frontend/src/components/landing-v5/lab/QuizDemo.tsx (1)

33-35: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Difficulty badge changes while the same question is shown.

submit updates streak before it sets phase to review. qi does not change. The badge therefore flips from MEDIUM to HARD or EASY while the user still reads question 1 and its explanation. Derive the badge from the difficulty that applied when the question was served, for example from answers.length captured at question start.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 33 - 35,
Update the difficulty derivation in QuizDemo so the badge remains tied to the
difficulty assigned when the current question was served, rather than
recomputing from the mutable streak during review. Capture or derive the
question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.

frontend/src/components/landing-v5/lab/GradesDemo.tsx (1)

62-65: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Row percentage is unclamped while the weighted grade is clamped.

Line 25 clamps the score into [0, r.possible]. Line 64 uses the unclamped raw. If the user types 70 in a 50-point row, the row shows 140% while the category bar and the overall grade cap at 100%. Apply the same clamp in both places.

♻️ Proposed fix

 const raw = parseFloat(earned[i]);
- const pct = isNaN(raw) ? null : Math.round((raw / r.possible) * 100);+ const pct = isNaN(raw) ? null : Math.round((Math.max(0, Math.min(raw, r.possible)) / r.possible) * 100);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx` around lines 62 - 65,
Clamp the parsed score used in the row percentage calculation within the same
[0, r.possible] bounds already applied to the weighted grade. Update the
percentage logic in the GB_ROWS map callback, preserving the existing null
handling and color thresholds while ensuring values above or below the row
limits cannot produce percentages outside 0–100.

frontend/src/components/landing-v5/lab/labData.ts (1)

13-13: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Remove duplicated TIER from labData.ts.

labData.ts exports TIER, but the lab demos import LAB_TIER and render with labData.ts content. The four hex values and keys match LAB_TIER, so two copies of this swatch set can drift. Drop TIER from labData.ts and keep using LAB_TIER.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/labData.ts` at line 13, Remove the
exported TIER constant from labData.ts, since it duplicates the matching
LAB_TIER swatch set. Update any references in labData.ts to use LAB_TIER
instead, preserving the existing keys and color values.

frontend/src/lib/landing/engine/graph.ts (1)

122-127: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Replace the random-comparator shuffle with Fisher–Yates.

sort(() => Math.random() - 0.5) uses an inconsistent comparator. The resulting permutation is biased and depends on the engine's sort implementation, so many nodes keep positions close to their original index. That works against the documented intent of an organic reveal order.

♻️ Proposed fix

- // Shuffle the reveal order so the graph assembles organically.- const order = nodes.map((_, i) => i).sort(() => Math.random() - 0.5);+ // Shuffle the reveal order so the graph assembles organically.+ const order = nodes.map((_, i) => i);+ for (let i = order.length - 1; i > 0; i--) {+ const j = Math.floor(Math.random() * (i + 1));+ [order[i], order[j]] = [order[j], order[i]];+ }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/graph.ts` around lines 122 - 127, Replace the
random-comparator sort in the reveal-order logic with an unbiased Fisher–Yates
shuffle of the index array. Keep the existing spawnAt and colorAt calculations
and node ordering behavior after shuffling unchanged.

frontend/src/app/(public)/wiki/page.tsx (1)

31-39: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Make lede optional so the privacy section does not render an empty paragraph.

The privacy section passes lede="". Section always renders the <p>, so the page emits an empty paragraph with 0 0 20px margins. That adds dead space and an empty node in the accessibility tree.

♻️ Proposed fix

-function Section({ id, title, lede, children }: { id: string; title: string; lede: string; children?: React.ReactNode }) {+function Section({ id, title, lede, children }: { id: string; title: string; lede?: string; children?: React.ReactNode }) {
return (
<section style={{ marginTop: 56, scrollMarginTop: 110 }} id={id}>
<SectionHeading>{title}</SectionHeading>
- <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ {lede ? (+ <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ ) : null}
{children}

Then drop lede="" at line 147.

Also applies to: 147-149

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/wiki/page.tsx around lines 31 - 39, Make the lede
prop optional in Section and render the paragraph only when lede has content, so
the privacy section does not produce an empty element or spacing. Remove the
lede="" argument from the privacy Section usage while preserving existing lede
rendering for other sections.

frontend/src/lib/landing/engine/marquee.ts (1)

136-144: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick win

Avoid the per-frame layout read in update().

update() runs from the engine tick on every frame the gallery is on screen. Line 136 reads wrap.clientWidth on each of those frames, and line 156 writes track.style.transform. The write dirties style, so the next frame's read forces a style recalculation and layout. That contradicts the engine invariant documented in frontend/src/lib/landing/engine/index.ts lines 4-8, which states the tick never reads layout.

Observe the container width instead, and re-measure only when it changes.

♻️ Proposed approach

- // measure one card set only when the container width changed- if (!m.setW || m.measuredW !== wrap.clientWidth) {+ // measure one card set only when a ResizeObserver marked it stale+ if (!m.setW) {

Then in bind, mark the state stale from an observer and add its teardown to cleanups:

constro=newResizeObserver(()=>{m.setW=0;});if(wrap)ro.observe(wrap);cleanups.push(()=>ro.disconnect());

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/marquee.ts` around lines 136 - 144, Remove
the per-frame wrap.clientWidth read from update() and move width-change
detection to bind using a ResizeObserver on wrap. Have the observer mark m.setW
stale, register ro.disconnect in cleanups, and preserve the existing measurement
logic when update() sees stale state without reading layout every tick.

frontend/src/components/landing-v5/FeatureLab.tsx (1)

94-119: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Mark the active rail button for assistive technology.

on changes only the colors. Add aria-current="true" on the selected button so the active tool is conveyed without color.

♿ Proposed change

 data-rail={i}
type="button"
+ aria-current={on || undefined}
onClick={() => onPick(i)}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 94 - 119, Add
an aria-current="true" attribute to the selected rail button rendered in the
GAL.map callback, using the existing on condition so assistive technology
identifies the active tool without relying on color.

frontend/src/components/landing-v5/Gallery.tsx (1)

71-73: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

The wrapper duplicates the miniature's own container.

The <div> here sets height: 166, borderRadius: 13, overflow: hidden, the same background, and the same border. Every entry in GALLERY_MINIS opens with a <div> carrying that identical style set (see galleryMinis.tsx line 16). One of the two layers is redundant. Because the minis are generated, drop the wrapper here rather than editing the generated file.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 71 - 73, Remove
the redundant wrapper div around GALLERY_MINIS[i] in Gallery, rendering the
miniature directly while preserving its existing placement and aria-hidden
behavior. Do not modify the generated galleryMinis.tsx entries.

frontend/src/lib/landing/engine/flip.ts (1)

24-25: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

FlipState.ran is never read.

armFlip sets ran = false and flipClose resets it, but no code in this module or in frontend/src/components/landing/useLanding.ts reads it. The consumer tracks the same guard with its own flipRan ref (see useLanding.ts lines 158, 552, 574-575). Two guards for one invariant can drift. Either remove ran from FlipState or make flipOpen own the guard and delete flipRan from the hook.

Also applies to: 78-78

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/flip.ts` around lines 24 - 25, Remove the
unused FlipState.ran field and its assignments in armFlip and flipClose, since
useLanding already owns this guard through flipRan. Keep the existing
flipRan-based behavior unchanged and avoid maintaining duplicate state for the
same invariant.

frontend/src/lib/landing/engine/hero.ts (1)

99-136: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Points behind the camera reach the link pass with a degenerate scale.

sc = FL / (FL + z) is computed for every node. Rotation mixes ox into z, and ox reaches about ±740 while oz reaches about ±340, so z can pass -1000. At z === -FL the divide produces Infinity, and below -FL it produces a negative scale.

The point pass guards this at line 139 with p.z > -FL. The link pass at lines 116-136 does not. A node with Infinity scale gives reach === Infinity, so the break at line 122 never fires for that row and the inner loop degrades to a full scan.

Filter the projection once, so both passes share the guard.

♻️ Proposed change

 const proj = nodes
.map((n) => {
...
})
+ // drop anything at or behind the projection plane: `sc` is not finite+ // there, which breaks both the link reach and the point radius+ .filter((p) => p.z > -FL)
.sort((a, b) => b.z - a.z);

The p.z > -FL test at line 139 then becomes redundant and can go.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/hero.ts` around lines 99 - 136, Filter the
projected nodes immediately after the `proj` mapping so only entries with `p.z >
-FL` remain before sorting and running the link pass. Reuse this filtered
collection for both link rendering and the later point-rendering pass, then
remove the now-redundant `p.z > -FL` guard in the point pass.

frontend/src/components/landing/useLanding.ts (1)

378-392: 🚀 Performance & Scalability | 🔵 Trivial | 💤 Low value

The reveal scan polls every 900ms for the page lifetime.

scan() re-queries [data-reveal] across the whole landing root twice per second, forever, to catch elements that mount later. A MutationObserver on root would react to the same additions without the standing timer. This is a nice-to-have; the current cost is one querySelectorAll per tick.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 378 - 392,
Replace the lifetime polling interval in the reveal setup around scan with a
MutationObserver watching root for added elements, invoking scan when matching
content mounts later. Keep the initial scan, existing seen/io behavior, and
cleanup, but disconnect the mutation observer instead of clearing an interval.

frontend/src/lib/landing/engine/sim.ts (1)

282-299: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

up ignores pointerId, and the window listeners are registered once per cluster.

Two small points in bindDrag:

• up does not compare e.pointerId with f.drag.id. A second pointer that lifts cancels the active drag. onMove does compare the id, so the handlers are inconsistent.
• onMove and up are added to window inside the per-cluster loop. With N clusters in one group, every window pointer event runs N identical handlers. Bind the window listeners once per group instead.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 282 - 299, Update
bindDrag so up ignores pointer events whose pointerId does not match f.drag.id,
matching onMove’s active-pointer validation. Move the window-level pointermove,
pointerup, and pointercancel listener registration out of the per-cluster
binding loop and register each once per group, while keeping the per-SVG
listeners on the individual cluster SVG.

frontend/src/components/landing-v5/Closing.tsx (1)

75-92: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Share the companion-page list, and make the footer icon decorative.

Two points:

1. FOOTER_LINKS repeats PAGES in Navbar.tsx (lines 26-33) with the same six label and href pairs. Both files are new in this PR, so the two lists will drift the first time a companion page is added or renamed. Export one list and import it in both places.
2. Line 91 sets alt="Sapling" on the icon, and the adjacent text already reads "Sapling · © 2026". A screen reader announces the name twice. Navbar.tsx line 100 already uses alt="" for the same icon beside the same wordmark.

♻️ Proposed fix

- <Image src="/sapling-icon.svg" alt="Sapling" width={20} height={20} />+ <Image src="/sapling-icon.svg" alt="" width={20} height={20} />

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Closing.tsx` around lines 75 - 92, Share
the companion-page link list currently duplicated as FOOTER_LINKS in SiteFooter
and PAGES in Navbar by exporting one canonical list and importing it in both
components, preserving all six label/href pairs. Update the footer Image in
SiteFooter to use an empty alt value so the adjacent Sapling text is announced
only once.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/app/globals.css`:
- Around line 1957-2005: Rename the camelCase keyframe declarations in the
affected stylesheet to kebab-case, including symbols such as s1Stem,
saplingBlob, introOrbit, popHold, and the additional reported ranges. Update
every corresponding animation and animation-name reference to the new kebab-case
identifiers, preserving all animation behavior.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 41-50: Update the modal container identified by panelRef in
FeatureLab to add role="dialog", aria-modal="true", and an accessible name. On
mount, move focus into the panel; while open, trap Tab navigation within it so
focus cannot reach the page behind the overlay. Capture and restore focus to the
triggering element stored in FlipState.el when the panel closes, while
preserving the existing Escape close behavior.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 62-85: Update Card so non-ghost cards are keyboard-focusable and
activatable, using the existing track click-delegation contract, while ghost
duplicates remain excluded from the tab order and accessibility tree. Add the
corresponding keyboard activation handling to the card or track using the
existing feature-lab target behavior, and correct the nearby doc comment to
match the implemented accessibility behavior. Add a visible
.ld-galcard:focus-visible style in globals.css.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 37-44: Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout
in the rate handler is stored in a useRef, cleared before scheduling each new
rating and during unmount, and remove the ineffective returned cleanup. Update
NotesDemo.tsx at lines 57-80 so the 700 ms extract and summarize timeouts use
refs and are cleared in the existing unmount effect alongside saveT.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx`:
- Around line 21-24: Update the RECENT entries’ pick values to exactly match an
existing exam option in the corresponding GUIDES course fixture, preserving
openRecent’s assignment and keeping the select value consistent with the guide
heading.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 104-124: Fix the quiz option accessibility semantics in the
q.options mapping: either make each button a radio with role="radio" and
aria-checked bound to isPicked while retaining the radiogroup, or remove the
radiogroup role and expose isPicked through aria-pressed. Preserve the existing
selection and reviewing behavior in the option onClick handler.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 213-224: Update the hero canvas useEffect around startHeroCanvas
to track a cancelled/unmounted flag. Set it during cleanup, check it after the
asynchronous hero module import resolves before starting the canvas, and stop
the returned controller when appropriate so no animation loop or resize listener
remains after unmount.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 423-430: Update the initialization and destroy flow around
ensureInit and destroy to retain each cluster element’s original parent before
moving it into the overlay. During destroy, restore every cluster to that
parent, clear the inline styles applied by ensureInit, then remove the overlay
and reset state so a later ensureInit can rebuild the field without disrupting
React-owned nodes.
---
Minor comments:
In `@frontend/src/app/`(public)/page.tsx:
- Around line 115-116: Update useLanding and the onQuiz/onLearn handlers to
store each 260 ms openGal timeout in refs, rather than discarding the timer IDs.
In the landing cleanup, clear both deferred timers before resetting
document.body overflow, preventing actions.openGal from running after unmount.
In `@frontend/src/components/landing-v5/ActGraph.tsx`:
- Around line 333-340: Update the existing keyboard handler in useLanding to
detect Escape while explore mode is active and call onExitExplore. Preserve the
current Escape behavior for gallery and jump controls, and ensure the
explore-mode exit path is available to keyboard-only users.
In `@frontend/src/components/landing-v5/ActTutor.tsx`:
- Around line 93-109: Update the tutor pill group in ActTutor’s CAPTIONS map to
add type="button" and aria-pressed={tutorMode === i} to each button. Keep the
hidden container’s buttons out of the tab order while the engine-controlled
opacity is zero by mirroring its hidden state with inert or an equivalent
visibility-based mechanism, and ensure the existing handover clears that state
when the pills become visible.
In `@frontend/src/components/landing-v5/Faq.tsx`:
- Around line 66-71: Update the “Read the full FAQ” anchor in the FAQ component
to navigate to the newly added /faq route instead of the local `#faq` section,
preserving its existing styling and text.
- Around line 79-116: Update the FAQ accordion around the toggle button and
answer panel to give each panel a stable unique id, reference it from the button
via aria-controls, and set aria-hidden based on the open state so closed answers
are excluded from the accessibility tree. Preserve the existing visual
transition and aria-expanded behavior.
In `@frontend/src/components/landing-v5/Journal.tsx`:
- Around line 96-101: Update the post card anchor in the Journal component to
navigate to the new /news route instead of the containing `#newsletter` section,
while preserving the existing card styling and behavior.
- Around line 184-199: Update the Journal email input in the landing component
to use type="email" and preserve the existing onSubscribe flow only as an
explicit stub, or wire onSubscribe to the newsletter endpoint and show the
subscribed state only after a successful submission. Locate the handler through
actions.subscribe/useLanding and ensure invalid emails cannot enter the success
state.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 46-53: Update the keydown handler in the useEffect to detect when
the event target is an interactive element, such as a button or link, and skip
both flip() and preventDefault() for those targets. Preserve the existing global
space-to-flip and rate-key behavior for non-interactive targets.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx`:
- Around line 57-80: Update the extract and summarize timeout flows to store
their setTimeout handles in dedicated refs, and clear both refs in the existing
unmount effect alongside saveT. Ensure the callbacks still perform their current
state updates when they complete, while preventing them from running after the
component unmounts.
- Line 63: Update the concept-loading logic around the setConcepts call to keep
concepts empty when found has no matches instead of inserting a “No concepts
found” sentinel; track the empty-result state separately and use it for the
empty-state display while ensuring the footer count reflects only actual linked
concepts.
In `@frontend/src/components/landing-v5/Navbar.tsx`:
- Around line 199-235: The navigation disclosures use menu semantics with
ordinary links and buttons; remove those menu roles and triggers’ menu-haspopup
attributes. In frontend/src/components/landing-v5/Navbar.tsx lines 199-235,
remove role="menu" from the compact panel and remove aria-haspopup="menu" from
its trigger while retaining aria-expanded. In
frontend/src/components/landing-v5/Closing.tsx lines 154-182, remove role="menu"
from the jump panel and remove aria-haspopup="menu" from the pill trigger; keep
the enclosing navigation semantics and existing expansion state.
In `@frontend/src/lib/landing/engine/dom.ts`:
- Around line 49-73: Update cv so zero-sized measurements are not stored in the
CanvasCache: when clientWidth or clientHeight is zero, avoid assigning the newly
measured cache to rec.__cv while preserving the current context and sizing
behavior. Ensure subsequent calls re-read dimensions until both measurements are
nonzero, while retaining normal caching for valid sizes.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 184-203: Prevent incorrect label binding in sim.ts by verifying
ring.nextElementSibling is a text element before assigning it, type
SimNode.label as SVGTextElement | null, and skip label position updates when it
is null; update DragField.tsx to always render a text element per node so the
expected glow, ring, label order is maintained.
In `@frontend/src/lib/landing/hero3d/index.ts`:
- Around line 175-189: Update the returned stop() method to call
renderer.forceContextLoss() immediately after renderer.dispose(), ensuring the
WebGL context is released during cleanup while preserving the existing resource
disposal and animation cancellation behavior.
---
Nitpick comments:
In `@frontend/src/app/`(public)/wiki/page.tsx:
- Around line 31-39: Make the lede prop optional in Section and render the
paragraph only when lede has content, so the privacy section does not produce an
empty element or spacing. Remove the lede="" argument from the privacy Section
usage while preserving existing lede rendering for other sections.
In `@frontend/src/components/landing-v5/Closing.tsx`:
- Around line 75-92: Share the companion-page link list currently duplicated as
FOOTER_LINKS in SiteFooter and PAGES in Navbar by exporting one canonical list
and importing it in both components, preserving all six label/href pairs. Update
the footer Image in SiteFooter to use an empty alt value so the adjacent Sapling
text is announced only once.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 94-119: Add an aria-current="true" attribute to the selected rail
button rendered in the GAL.map callback, using the existing on condition so
assistive technology identifies the active tool without relying on color.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 71-73: Remove the redundant wrapper div around GALLERY_MINIS[i] in
Gallery, rendering the miniature directly while preserving its existing
placement and aria-hidden behavior. Do not modify the generated galleryMinis.tsx
entries.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx`:
- Around line 62-65: Clamp the parsed score used in the row percentage
calculation within the same [0, r.possible] bounds already applied to the
weighted grade. Update the percentage logic in the GB_ROWS map callback,
preserving the existing null handling and color thresholds while ensuring values
above or below the row limits cannot produce percentages outside 0–100.
In `@frontend/src/components/landing-v5/lab/labData.ts`:
- Line 13: Remove the exported TIER constant from labData.ts, since it
duplicates the matching LAB_TIER swatch set. Update any references in labData.ts
to use LAB_TIER instead, preserving the existing keys and color values.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx`:
- Around line 51-84: Resolve the unused Segmented component by replacing the
duplicated inline segmented-control markup in CalendarDemo and TutorDemo with
the shared Segmented component, passing each demo’s options, current value, and
change handler. Preserve the existing labels, selection behavior, and styling,
and keep the component’s public API unchanged.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 33-35: Update the difficulty derivation in QuizDemo so the badge
remains tied to the difficulty assigned when the current question was served,
rather than recomputing from the mutable streak during review. Capture or derive
the question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 378-392: Replace the lifetime polling interval in the reveal setup
around scan with a MutationObserver watching root for added elements, invoking
scan when matching content mounts later. Keep the initial scan, existing seen/io
behavior, and cleanup, but disconnect the mutation observer instead of clearing
an interval.
In `@frontend/src/lib/landing/engine/flip.ts`:
- Around line 24-25: Remove the unused FlipState.ran field and its assignments
in armFlip and flipClose, since useLanding already owns this guard through
flipRan. Keep the existing flipRan-based behavior unchanged and avoid
maintaining duplicate state for the same invariant.
In `@frontend/src/lib/landing/engine/graph.ts`:
- Around line 122-127: Replace the random-comparator sort in the reveal-order
logic with an unbiased Fisher–Yates shuffle of the index array. Keep the
existing spawnAt and colorAt calculations and node ordering behavior after
shuffling unchanged.
In `@frontend/src/lib/landing/engine/hero.ts`:
- Around line 99-136: Filter the projected nodes immediately after the `proj`
mapping so only entries with `p.z > -FL` remain before sorting and running the
link pass. Reuse this filtered collection for both link rendering and the later
point-rendering pass, then remove the now-redundant `p.z > -FL` guard in the
point pass.
In `@frontend/src/lib/landing/engine/marquee.ts`:
- Around line 136-144: Remove the per-frame wrap.clientWidth read from update()
and move width-change detection to bind using a ResizeObserver on wrap. Have the
observer mark m.setW stale, register ro.disconnect in cleanups, and preserve the
existing measurement logic when update() sees stale state without reading layout
every tick.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 282-299: Update bindDrag so up ignores pointer events whose
pointerId does not match f.drag.id, matching onMove’s active-pointer validation.
Move the window-level pointermove, pointerup, and pointercancel listener
registration out of the per-cluster binding loop and register each once per
group, while keeping the per-SVG listeners on the individual cluster SVG.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 865084a7-2f4d-472c-accd-6f67530e2a35

📥 Commits

Reviewing files that changed from the base of the PR and between ec34bf1 and 741ec10.

⛔ Files ignored due to path filters (3)

• frontend/public/journal-ai-homework.png is excluded by !**/*.png
• frontend/public/journal-founding.png is excluded by !**/*.png
• frontend/public/kofi-symbol.png is excluded by !**/*.png

📒 Files selected for processing (75)

• frontend/e2e/landing-graph.spec.ts
• frontend/e2e/public-seo.spec.ts
• frontend/eslint-suppressions.json
• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/companion/primitives.tsx
• frontend/src/components/landing-v5/ActGraph.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/ActTutor.tsx
• frontend/src/components/landing-v5/Closing.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/Faq.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/components/landing-v5/Gallery.tsx
• frontend/src/components/landing-v5/Hero.tsx
• frontend/src/components/landing-v5/IntroOverlay.tsx
• frontend/src/components/landing-v5/Journal.tsx
• frontend/src/components/landing-v5/Navbar.tsx
• frontend/src/components/landing-v5/galleryMinis.tsx
• frontend/src/components/landing-v5/lab/CalendarDemo.tsx
• frontend/src/components/landing-v5/lab/CardsDemo.tsx
• frontend/src/components/landing-v5/lab/GradesDemo.tsx
• frontend/src/components/landing-v5/lab/GuideDemo.tsx
• frontend/src/components/landing-v5/lab/LabShell.tsx
• frontend/src/components/landing-v5/lab/NotesDemo.tsx
• frontend/src/components/landing-v5/lab/QuizDemo.tsx
• frontend/src/components/landing-v5/lab/RoomsDemo.tsx
• frontend/src/components/landing-v5/lab/TutorDemo.tsx
• frontend/src/components/landing-v5/lab/index.tsx
• frontend/src/components/landing-v5/lab/labData.ts
• frontend/src/components/landing-v5/navTheme.ts
• frontend/src/components/landing/useLanding.ts
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx
• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/lib/landing/color.ts
• frontend/src/lib/landing/companionContent.ts
• frontend/src/lib/landing/content.ts
• frontend/src/lib/landing/course.ts
• frontend/src/lib/landing/dragClusters.ts
• frontend/src/lib/landing/engine/ambient.ts
• frontend/src/lib/landing/engine/dom.ts
• frontend/src/lib/landing/engine/flip.ts
• frontend/src/lib/landing/engine/graph.ts
• frontend/src/lib/landing/engine/graphView.ts
• frontend/src/lib/landing/engine/hero.ts
• frontend/src/lib/landing/engine/index.ts
• frontend/src/lib/landing/engine/marquee.ts
• frontend/src/lib/landing/engine/measure.ts
• frontend/src/lib/landing/engine/plant.ts
• frontend/src/lib/landing/engine/sim.ts
• frontend/src/lib/landing/hero3d/cardTexture.ts
• frontend/src/lib/landing/hero3d/index.ts

💤 Files with no reviewable changes (20)

• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/e2e/landing-graph.spec.ts
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

Use kebab-case keyframe names.

Stylelint reports every new camelCase keyframe identifier against keyframes-name-pattern. This leaves lint errors in the changed stylesheet. Rename the declarations to kebab case and update every matching animation or animation-name reference in the same change.

Also applies to: 2031-2033, 2082-2082, 2094-2096

🧰 Tools

🪛 Stylelint (17.14.0)

[error] 1957-1957: Expected keyframe name "s1Stem" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1958-1958: Expected keyframe name "s1LeafLo" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1964-1964: Expected keyframe name "s1LeafHi" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1970-1970: Expected keyframe name "s1Bud" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1971-1971: Expected keyframe name "s1Word" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1972-1972: Expected keyframe name "s1Rule" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1975-1975: Expected keyframe name "saplingBlob" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1976-1976: Expected keyframe name "introOrbit" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1977-1977: Expected keyframe name "floatIndicator" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1978-1978: Expected keyframe name "betaGlow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1979-1979: Expected keyframe name "nodeFloatA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1980-1980: Expected keyframe name "nodeFloatB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1983-1983: Expected keyframe name "popHold" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1984-1984: Expected keyframe name "chipSwapA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1985-1985: Expected keyframe name "chipSwapB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1986-1986: Expected keyframe name "flipLoop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1987-1987: Expected keyframe name "lineReveal" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1988-1988: Expected keyframe name "underSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1989-1989: Expected keyframe name "barGrow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1990-1990: Expected keyframe name "coverRise" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1991-1991: Expected keyframe name "ringDraw" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1992-1992: Expected keyframe name "gaugeFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1993-1993: Expected keyframe name "answerTick" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1994-1994: Expected keyframe name "waveBar" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1995-1995: Expected keyframe name "gaugeMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1996-1996: Expected keyframe name "coverMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1997-1997: Expected keyframe name "cursorMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1998-1998: Expected keyframe name "cardFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1999-1999: Expected keyframe name "scanSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2000-2000: Expected keyframe name "ocrBlink" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2001-2001: Expected keyframe name "panelFade" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2002-2002: Expected keyframe name "fillX" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2003-2003: Expected keyframe name "typingDot" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2004-2004: Expected keyframe name "ringPop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2005-2005: Expected keyframe name "cursorDrift" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/globals.css` around lines 1957 - 2005, Rename the camelCase
keyframe declarations in the affected stylesheet to kebab-case, including
symbols such as s1Stem, saplingBlob, introOrbit, popHold, and the additional
reported ranges. Update every corresponding animation and animation-name
reference to the new kebab-case identifiers, preserving all animation behavior.

Source: Linters/SAST tools

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

The overlay is a modal without dialog semantics or focus management.

The panel covers the viewport at zIndex: 80 and the caller locks body scroll. Three parts are missing:

• No role="dialog" and no aria-modal="true", so assistive technology does not announce a modal context.
• No accessible name on the container.
• No focus management. Focus stays on the gallery card behind the overlay, tabbing walks the page underneath, and closing does not return focus to the card that opened the panel.

Escape already closes the panel through useLanding.ts lines 272-276, so only the semantics and focus handling remain.

♿ Proposed direction

- <div style={{ position: 'fixed', inset: 0, zIndex: 80 }}>+ <div+ role="dialog"+ aria-modal="true"+ aria-label={`${g.kicker} demo`}+ style={{ position: 'fixed', inset: 0, zIndex: 80 }}+ >

Then move focus into the panel when it mounts, keep Tab inside it while it is open, and restore focus to the element captured by armFlip when it closes. frontend/src/lib/landing/engine/flip.ts already holds that element in FlipState.el.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 41 - 50,
Update the modal container identified by panelRef in FeatureLab to add
role="dialog", aria-modal="true", and an accessible name. On mount, move focus
into the panel; while open, trap Tab navigation within it so focus cannot reach
the page behind the overlay. Capture and restore focus to the triggering element
stored in FlipState.el when the panel closes, while preserving the existing
Escape close behavior.

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win

The gallery cards cannot be opened with a keyboard.

Opening the feature lab depends on the onClick delegation on the track div at lines 99-102. Card renders an <article> with no tabIndex, no role, and no key handler, and the track div has no key handler either. A keyboard user cannot reach or activate any card, so the feature lab is unreachable without a pointer. The doc comment at lines 14-15 states that the first copy is reachable by keyboard, which does not match the markup.

Make each non-ghost card an activatable control, keep the duplicate copies out of the tab order, and then correct the doc comment.

♿ Proposed fix

-function Card({ i, ghost }: { i: number; ghost: boolean }) {+function Card({ i, ghost, onOpen }: { i: number; ghost: boolean; onOpen: (i: number, el: HTMLElement | null) => void }) {
const c = CARDS[i];
return (
<article
data-tk={i}
aria-hidden={ghost || undefined}
+ role="button"+ tabIndex={ghost ? -1 : 0}+ aria-label={`Open ${c.kicker}`}+ onKeyDown={(e) => {+ if (e.key !== 'Enter' && e.key !== ' ') return;+ e.preventDefault();+ onOpen(i, e.currentTarget);+ }}
style={CARD}
className="ld-galcard"
>

- {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} />)}- {order.map((i) => <Card key={`b${i}`} i={i} ghost />)}+ {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} onOpen={onOpen} />)}+ {order.map((i) => <Card key={`b${i}`} i={i} ghost onOpen={onOpen} />)}

Add a visible focus style for .ld-galcard:focus-visible in globals.css.

Also applies to: 96-107

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 62 - 85, Update
Card so non-ghost cards are keyboard-focusable and activatable, using the
existing track click-delegation contract, while ghost duplicates remain excluded
from the tab order and accessibility tree. Add the corresponding keyboard
activation handling to the card or track using the existing feature-lab target
behavior, and correct the nearby doc comment to match the implemented
accessibility behavior. Add a visible .ld-galcard:focus-visible style in
globals.css.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

Handler timeouts are created without a ref, so they are never cancelled. Both demos schedule a state update from an event handler without storing the handle. The timeout cannot be cleared on unmount, and a second click cannot cancel a pending one. The other demos in this layer already hold each handle in a useRef and clear it in an unmount effect.

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44: store the 300 ms advance timeout in a ref, clear it before each new rating, and clear it on unmount; delete the returned cleanup, which React never calls.
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80: store the 700 ms extract and summarize timeouts in refs and clear them in the existing unmount effect beside saveT.

📍 Affects 2 files

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44 (this comment)
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 37 - 44,
Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout in the rate handler is
stored in a useRef, cleared before scheduling each new rating and during
unmount, and remove the ineffective returned cleanup. Update NotesDemo.tsx at
lines 57-80 so the 700 ms extract and summarize timeouts use refs and are
cleared in the existing unmount effect alongside saveT.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

RECENT[].pick values are not options of the exam select.

openRecent at line 53 sets exam to r.pick. 'Midterm 1 · Sep 30' is not in GUIDES['MA 242'].exams, and 'Quiz 2 · Oct 03' is not in GUIDES['CS 201'].exams. The controlled select at line 76 then falls back to displaying its first option while the guide heading at line 104 prints exam. The control and the heading disagree, and the user cannot select the displayed exam again.

Use an exam that exists in the course fixture, or add the recent exam to the option list when it is selected.

🔧 Proposed fix using existing fixture values

 const RECENT = [
- { i: 0, exam: 'MA 242 · Midterm 1', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Midterm 1 · Sep 30' },- { i: 1, exam: 'CS 201 · Quiz 2', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Quiz 2 · Oct 03' },+ { i: 0, exam: 'MA 242 · Final', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Final · Dec 12' },+ { i: 1, exam: 'CS 201 · Midterm 1', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Midterm 1 · Oct 17' },
];

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	constRECENT=[
	{i: 0,exam: 'MA 242 · Midterm 1',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Midterm 1 · Sep 30'},
	{i: 1,exam: 'CS 201 · Quiz 2',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Quiz 2 · Oct 03'},
	];
	constRECENT=[
	{i: 0,exam: 'MA 242 · Final',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Final · Dec 12'},
	{i: 1,exam: 'CS 201 · Midterm 1',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Midterm 1 · Oct 17'},
	];

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx` around lines 21 - 24,
Update the RECENT entries’ pick values to exactly match an existing exam option
in the corresponding GUIDES course fixture, preserving openRecent’s assignment
and keeping the select value consistent with the guide heading.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

role="radiogroup" has no radio children.

The container declares role="radiogroup", but each option is a plain <button>. A radiogroup requires children with role="radio" and aria-checked. Assistive technology cannot report which option is selected. Add the roles and state, or drop role="radiogroup" and expose selection with aria-pressed.

♿ Proposed fix

 <button
key={o.label}
type="button"
+ role="radio"+ aria-checked={isPicked}+ aria-disabled={reviewing}
onClick={() => { if (!reviewing) setPicked(o.label); }}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='#E3E0D5',bg='#FDFCF9',fg='#33443B',mark='',markCol='';
	if(reviewing&&correct){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';mark='CORRECT';markCol='#0C5638';}
	elseif(reviewing&&isPicked){bd='#b25855';bg='rgba(178,88,85,0.09)';fg='#9c4b48';mark='YOUR PICK';markCol='#9c4b48';}
	elseif(isPicked){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';}
	return(
	<button
	key={o.label}
	type="button"
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '#0E9E5A' : '#9AA5A0'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}
	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='`#E3E0D5`',bg='`#FDFCF9`',fg='`#33443B`',mark='',markCol='';
	if(reviewing&&correct){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';mark='CORRECT';markCol='`#0C5638`';}
	elseif(reviewing&&isPicked){bd='`#b25855`';bg='rgba(178,88,85,0.09)';fg='`#9c4b48`';mark='YOUR PICK';markCol='`#9c4b48`';}
	elseif(isPicked){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';}
	return(
	<button
	key={o.label}
	type="button"
	role="radio"
	aria-checked={isPicked}
	aria-disabled={reviewing}
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '`#0E9E5A`' : '`#9AA5A0`'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 104 - 124,
Fix the quiz option accessibility semantics in the q.options mapping: either
make each button a radio with role="radio" and aria-checked bound to isPicked
while retaining the radiogroup, or remove the radiogroup role and expose
isPicked through aria-pressed. Preserve the existing selection and reviewing
behavior in the option onClick handler.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

The hero canvas effect can start a loop that is never stopped.

import('@/lib/landing/engine/hero') resolves asynchronously. If the component unmounts before the promise resolves, the cleanup at line 222 runs while stopped is still null. The then callback then calls startHeroCanvas, which installs a requestAnimationFrame loop and a resize listener (see frontend/src/lib/landing/engine/hero.ts lines 83-87). Nothing cancels them afterwards, so the loop keeps drawing after navigation away from the landing page.

The WebGL effect at lines 227-244 already uses a cancelled flag. Apply the same pattern here.

🛠️ Proposed fix

 let stopped: { stop(): void } | null = null;
+ let cancelled = false;
// imported lazily so the module isn't pulled into the server bundle
import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas }) => {
+ if (cancelled) return;
stopped = startHeroCanvas(canvas, () => engine.mouse, () => engine.parallaxY);
});
- return () => stopped?.stop();+ return () => {+ cancelled = true;+ stopped?.stop();+ };

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	// imported lazily so the module isn't pulled into the server bundle
	import('@/lib/landing/engine/hero').then(({ startHeroCanvas })=>{
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>stopped?.stop();
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);
	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	letcancelled=false;
	// imported lazily so the module isn't pulled into the server bundle
	import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas })=>{
	if(cancelled)return;
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>{
	cancelled=true;
	stopped?.stop();
	};
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 213 - 224, Update
the hero canvas useEffect around startHeroCanvas to track a cancelled/unmounted
flag. Set it during cleanup, check it after the asynchronous hero module import
resolves before starting the canvas, and stop the returned controller when
appropriate so no animation loop or resize listener remains after unmount.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | 🏗️ Heavy lift

destroy() discards the re-homed clusters, so the field cannot be rebuilt.

ensureInit moves every cluster element out of its .drag-field and into the overlay (line 172), and it mutates the cluster's inline styles (lines 165-171). destroy() removes the shell through the queued cleanup, which deletes those cluster elements from the document. It does not put them back.

Two consequences:

1. A second ensureInit on the same DOM finds .drag-field elements with no [data-dragnode] children, returns false at line 232, and the field stays empty forever. This happens on any stop/start cycle, including the React StrictMode double-invoke of the engine effect in frontend/src/components/landing/useLanding.ts lines 162-210.
2. React still owns those cluster nodes, because DragField rendered them. React records the original parent for each child. Removing or reparenting the nodes outside React can make the later unmount removal fail.

Restore each cluster to its original parent and clear the inline styles that ensureInit set.

🛠️ Proposed fix: remember the original parent and restore it on destroy

 interface ClusterAnchor {
el: HTMLElement;
field: HTMLElement;
+ /** Where the cluster lived before it was re-homed into the overlay. */+ home: Node | null;+ before: Node | null;
/** The pinned act this field belongs to, if any — drives the scroll drift. */
sect: HTMLElement | null;
left: number;
top: number;
}

 anchors.push({
el: cl, field, sect,
+ home: cl.parentNode,+ before: cl.nextSibling,
left: b.left - fb.left,
top: b.top - fb.top,
});

 function destroy(): void {
+ // put the clusters back before the overlay goes away, otherwise React+ // still owns nodes that no longer exist and a later ensureInit finds+ // empty fields+ for (const a of anchors) {+ a.el.style.cssText = '';+ if (a.home) a.home.insertBefore(a.el, a.before);+ }
cleanups.forEach((fn) => fn());
cleanups.length = 0;
anchors.length = 0;
groups = null;
- if (overlay && overlay.parentElement) overlay.parentElement.removeChild(overlay);
overlay = null;
}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 423 - 430, Update the
initialization and destroy flow around ensureInit and destroy to retain each
cluster element’s original parent before moving it into the overlay. During
destroy, restore every cluster to that parent, clear the inline styles applied
by ensureInit, then remove the overlay and reset state so a later ensureInit can
rebuild the field without disrupting React-owned nodes.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/landing-v5/BetaModal.tsx`:
- Around line 52-70: Update the subscribed confirmation branch in BetaModal so
the rendered Close button receives focus after the form is replaced. Add a ref
to that button and focus it after the subscribed state commits, using the
component’s existing lifecycle pattern; preserve the current onClose behavior
and button styling.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ee1ca146-7600-423b-98c7-56bcec09e4e1

📥 Commits

Reviewing files that changed from the base of the PR and between 741ec10 and e506827.

📒 Files selected for processing (13)

• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/BetaModal.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/lib/landing/content.ts

💤 Files with no reviewable changes (2)

• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx

🚧 Files skipped from review as they are similar to previous changes (5)

• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/lib/landing/content.ts

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

Restore modal focus after the subscribed state replaces the form.

When subscribed becomes true, this branch unmounts the focused email input while Dialog remains open. Dialog only applies its initial focus when open changes. Focus can then leave the dialog and bypass its Tab trap. Move focus to the Close button after the confirmation state renders.

Proposed fix

-import { useId, useRef } from 'react';+import { useEffect, useId, useRef } from 'react';
...
const inputRef = useRef<HTMLInputElement>(null);
+ const confirmationCloseRef = useRef<HTMLButtonElement>(null);
const headingId = useId();
const valid = email.includes('@');
++ useEffect(() => {+ if (open && subscribed) confirmationCloseRef.current?.focus();+ }, [open, subscribed]);
...
<button
+ ref={confirmationCloseRef}
onClick={onClose}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '#12201A',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '#0C5638'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '#61726A',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '#0C5638',color: '#fff',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>
	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '`#12201A`',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '`#0C5638`'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '`#61726A`',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	ref={confirmationCloseRef}
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '`#0C5638`',color: '`#fff`',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/BetaModal.tsx` around lines 52 - 70,
Update the subscribed confirmation branch in BetaModal so the rendered Close
button receives focus after the form is replaced. Add a ref to that button and
focus it after the subscribed state commits, using the component’s existing
lifecycle pattern; preserve the current onClose behavior and button styling.

[Darkest-Teddy]

Ports Sapling Landing v5.dc.html (from docs/frontend-audit/Sapling landing page import (1).zip) into the Next.js frontend. v5 is now the landing page at /, replacing the previous marketing landing.

Supersedes #523. Based on feat/landing-v4-port, so its four commits ride along — v5 reuses that branch's scroll engine, course-graph model and editorial content. If v5 is the direction, #523 can be closed unmerged.

The title screen is a ground-up rebuild

Not a v4 tweak. Reading the source rather than the summary that accompanied the task turned up six divergences:

	Assumed	Actual v5 source
Wordmark	Archivo 800, ink #12201A	Playfair Display 600, #0C5638
Reveal	heroWipe clip-path	character scramble — heroWipe is defined, never referenced
Eyebrow	mono "GROW YOUR KNOWLEDGE"	Playfair "Grow Your Knowledge", title case, scrambled
Cascade	—	tagline leads (760ms), wordmark follows 260ms behind — v4 ran the reverse
Right bloom	mirrored green	teal rgba(43,140,150,0.2)
Panel rig	CSS perspective cards	three.js WebGL scene

Act III is likewise not the clipped 918×348 card track described in the brief — the source has a rotating triangular-prism carousel.

The v4 title screen was deleted rather than kept alongside. three/@types/three were already dependencies.

Four dead branches in the source

The design component carries a lot of machinery its own markup never reaches. Documented at each site:

1. const wantDark = false — the navbar's full two-theme colour table is built, then pinned to light. Wired live here, driven off the section under the viewport centre, as the brief calls for.
2. heroWipe / heroChar keyframes — defined, unreferenced. Not ported.
3. setHero0/1/2 + mode pills — exist only in renderVals(), so heroMode is pinned at 0 and only the panel scene can ever be seen. The constellation and growth-field shaders are unreachable; porting them would be porting dead code.
4. "Plant a concept" — plantVal, plantedCount, _plant(), a localStorage-backed grove and a canvas ref, none of it referenced. The CTA is heading + line + button.

Two engine bugs fixed

Both pre-existing in the v4 port, both invisible until a section actually had drag clusters:

• sim.ts reads a ring's halo via previousElementSibling and its caption via nextElementSibling; a <g> wrapper broke the adjacency and it threw on a null label.
• Clusters were anchored once, in page coordinates. The source captures each cluster's offset within its field, parks the overlay in a position:fixed shell, and re-applies anchor + field.rect every frame — which is what lets a cluster track its sticky section, and where the ≤150px drift inside a pinned act comes from.

Verified against the original served side by side: at 45% through act-tutor the source puts its 7 rings on screen at y≈121–608. This port now matches; before the fix it was 0 of 7, parked 8752px down.

Generated, not retyped

• galleryMinis.tsx — the 8 card miniatures, mechanically converted from the source's <article data-tk> blocks. Dense decorative animation where exact geometry and per-element delays are the effect. Regenerate rather than hand-edit.
• dragClusters.ts — the 8 course clusters, ~2KB of inline SVG each in the source, reduced to data + one component.
• companionContent.ts — 18 copy arrays lifted verbatim from the sibling pages.

Also in this PR

• The old marketing landing is retired. Deleting / orphaned marketing/graph/ (~95KB of passing tests for a surface no route mounts), marketing/surfaces/, FeatureBand, SurfaceBento, featureBands. HeroCard/SignInModal stay — the nav's Sign In opens the real OAuth modal.
• e2e/landing-graph.spec.ts goes with the component it pinned. public-seo.spec.ts's SSR guard is retargeted, not deleted: its failure mode (an ssr: false silently dropping the landing's copy from crawled HTML) outlived its selectors, and is sharper on a canvas/WebGL page. It deliberately does not assert the wordmark — that scrambles in client-side, so the h1's aria-label is checked instead. All 7 assertions verified against raw SSR output.
• The five companion pages the nav links to (/team, /wiki, /gallery, /news, /faq). Once v5 took /, those links 404'd. They use the warm paper palette deliberately — that is not a mistake to unify.

Known gaps

• Feature lab demo pane. The source mounts a separate FeatureLab design component per kind via <dc-import> — a distinct 75KB file the task's file list did not scope in. Layout, FLIP, rail, copy and close are faithful; the pane shows the card's miniature enlarged.
• Gallery tiles have no artwork — the import ships no screenshots.

Verification

• tsc --noEmit exit 0 · eslint exit 0 · next build exit 0, all 5 new routes prerendered static
• Unit suite 59 files / 423 tests passing
• Every section walked in a real browser at multiple scroll positions, no console errors; all 9 public routes return 200

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features
  • Introduced a redesigned landing experience with interactive knowledge graphs, tutoring modes, feature demos, gallery, journal, FAQ, and beta signup.
  • Added public FAQ, Gallery, News, Team, and Wiki pages with responsive navigation and searchable or filterable content.
  • Added interactive demonstrations for quizzes, flashcards, grades, calendars, notes, study rooms, guides, and tutoring.
• Documentation
  • Improved server-rendered landing-page checks for key accessible content and beta messaging.
• Refactor
  • Retired the previous marketing sections and legacy landing-page presentation.

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ebab108d-0405-4ae1-8d00-108ba83a0144

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Replaced the landing page with a component-based v5 experience, added interactive feature labs and companion pages, introduced shared animation engines and content data, and updated SSR coverage. Removed the former marketing graph, surface components, and related tests.

Changes

Landing v5 experience

Layer / File(s)	Summary
Landing content and data contracts frontend/src/lib/landing/*	Added landing content, course graph data, drag clusters, color utilities, and companion-page datasets.
Animation and interaction engines frontend/src/lib/landing/engine/*, frontend/src/lib/landing/hero3d/*	Added graph rendering, canvas effects, layout measurement, marquee and FLIP behavior, planting, drag simulation, and WebGL hero support.
Landing composition frontend/src/app/(public)/page.tsx, frontend/src/components/landing-v5/*, frontend/src/components/landing/useLanding.ts	Replaced the previous landing implementation with v5 hero, graph, ingest, tutor, gallery, FAQ, journal, CTA, navigation, modal, and lifecycle components.
Interactive feature labs frontend/src/components/landing-v5/lab/*	Added interactive quiz, flashcard, guide, grade, calendar, notes, rooms, and tutor demos with shared fixture data and controls.
Companion pages frontend/src/components/companion/*, frontend/src/app/(public)/{about,team,wiki,faq,gallery,news}/*	Added shared companion navigation and public About, Team, Wiki, FAQ, Gallery, and News routes.
Styling and SSR validation frontend/src/app/globals.css, frontend/e2e/public-seo.spec.ts, frontend/eslint-suppressions.json, frontend/src/lib/api.ts	Added scoped landing and companion styles, responsive animations, newsletter API wiring, and SSR checks for landing-page copy. Removed obsolete ESLint suppressions.

Estimated code review effort: 5 (Critical) | ~120 minutes

Possibly related PRs

• SaplingLearn/Sapling#513: Replaced the related knowledge-graph landing implementation and its supporting components.
• SaplingLearn/Sapling#63: Uses the same beta/newsletter signup flow implemented through BetaModal.
• SaplingLearn/Sapling#286: Also modifies the public landing page and shared styling layer.

Suggested reviewers:andresl230

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 36.59% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the primary change: porting Sapling Landing v5 into the landing page.
Description check	✅ Passed	The description explains the purpose, major changes, known gaps, related issue context, and verification results in substantial detail.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/landing-v5-port

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[supabase]

This pull request has been ignored for the connected project ybgqdonkoqftwrmweuyv because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[cloudflare-workers-and-pages]

Deploying with Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	frontend-staging	fc36068	Commit Preview URL Branch Preview URL	Aug 16 2026, 09:58 PM

[coderabbitai]

Actionable comments posted: 8

Note

Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.

🟡 Minor comments (14)

frontend/src/components/landing-v5/lab/NotesDemo.tsx-57-80 (1)

57-80: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

extract and summarize timeouts are untracked.

saveT is cleared on unmount, but the 700 ms timeouts at line 60 and line 71 are not stored and not cleared. If the lab panel closes within that window, the callbacks still run and set state on an unmounted component. Hold both handles in refs and clear them in the existing unmount effect.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` around lines 57 - 80,
Update the extract and summarize timeout flows to store their setTimeout handles
in dedicated refs, and clear both refs in the existing unmount effect alongside
saveT. Ensure the callbacks still perform their current state updates when they
complete, while preventing them from running after the component unmounts.

frontend/src/components/landing-v5/lab/CardsDemo.tsx-46-53 (1)

46-53: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The global space handler blocks button activation.

The keydown listener calls e.preventDefault() for every space press on window. A focused button then cannot be activated with space, including "Study again" at line 90. Skip the flip and the preventDefault call when the event target is an interactive element.

♿ Proposed fix

 const onKey = (e: KeyboardEvent) => {
+ const el = e.target as HTMLElement | null;+ if (el?.closest('button, input, textarea, select, [contenteditable]')) return;
if (e.key === ' ') { e.preventDefault(); flip(); }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 46 - 53,
Update the keydown handler in the useEffect to detect when the event target is
an interactive element, such as a button or link, and skip both flip() and
preventDefault() for those targets. Preserve the existing global space-to-flip
and rate-key behavior for non-interactive targets.

frontend/src/components/landing-v5/lab/NotesDemo.tsx-63-63 (1)

63-63: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The "no concepts" sentinel is counted as a linked concept.

When no matcher hits, concepts receives one placeholder entry. The footer at line 141 then renders "1 concepts linked to your MA 242 graph." The count is wrong and contradicts the placeholder. Keep concepts empty and track the empty result separately.

🔧 Proposed fix

+ const [ran, setRan] = useState(false);
@@
- setConcepts(found.length ? found : [{ name: 'No concepts found', tier: 'unexplored' }]);+ setConcepts(found);+ setRan(true);
setBusy(false);
@@
+ {ran && concepts.length === 0 && !busy && (+ <span style={{ fontSize: 12, color: '`#9AA5A0`' }}>No concepts found.</span>+ )}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` at line 63, Update the
concept-loading logic around the setConcepts call to keep concepts empty when
found has no matches instead of inserting a “No concepts found” sentinel; track
the empty-result state separately and use it for the empty-state display while
ensuring the footer count reflects only actual linked concepts.

frontend/src/lib/landing/engine/dom.ts-49-73 (1)

49-73: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Do not cache a zero-sized canvas measurement.

cv() caches w/h from clientWidth/clientHeight on the first call. The cache is dropped only by invalidateCanvas, which measure() calls only when the viewport dimensions change (see frontend/src/lib/landing/engine/measure.ts lines 98-104). If the first cv() call happens while the canvas is not laid out yet, or while its section is hidden, the cache stores 0 × 0. Every later frame then draws into a 0-pixel backing store, and the canvas stays blank until the viewport itself changes.

Skip the cache write when the measured size is zero, so the next frame re-reads it.

🐛 Proposed fix

 if (!c) {
const w = canvas.clientWidth;
const h = canvas.clientHeight;
const dpr = Math.min(window.devicePixelRatio || 1, 1.5);
let ctx = rec.__ctx as CanvasRenderingContext2D | undefined;
if (!ctx) {
ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
rec.__ctx = ctx;
}
c = { ctx, w, h, dpr };
- rec.__cv = c;+ // An unlaid-out or hidden canvas measures 0; don't freeze that in the+ // cache, or the next frames draw into a 0-pixel backing store.+ if (w > 0 && h > 0) rec.__cv = c;
const pw = Math.round(w * dpr);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/dom.ts` around lines 49 - 73, Update cv so
zero-sized measurements are not stored in the CanvasCache: when clientWidth or
clientHeight is zero, avoid assigning the newly measured cache to rec.__cv while
preserving the current context and sizing behavior. Ensure subsequent calls
re-read dimensions until both measurements are nonzero, while retaining normal
caching for valid sizes.

frontend/src/components/landing-v5/Journal.tsx-96-101 (1)

96-101: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Each post card links back to its own section.

href="#newsletter" points at the section that contains the card. The card presents as a link to an article, and activating it does nothing. This PR adds a /news route. Point each card at the article, or at /news until per-post routes exist.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 96 - 101, Update
the post card anchor in the Journal component to navigate to the new /news route
instead of the containing `#newsletter` section, while preserving the existing
card styling and behavior.

frontend/src/lib/landing/engine/sim.ts-184-203 (1)

184-203: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Label binding depends on an SVG sibling order that the markup does not guarantee.engine/sim.ts locates a node's caption through ring.nextElementSibling and casts it to SVGTextElement, while DragField renders that <text> only when a label exists for the node. When a label is missing, the sim binds the following node's glow <circle> and writes x/y onto it every frame, and ly becomes NaN.

• frontend/src/lib/landing/engine/sim.ts#L184-L203: check nextElementSibling.tagName === 'text' before the cast, type SimNode.label as SVGTextElement | null, and skip the label writes at lines 377-378 when it is null.
• frontend/src/components/landing-v5/DragField.tsx#L60-L92: alternatively, or in addition, always emit a <text> element per node so the documented glow → ring → label order holds for every node.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 184 - 203, Prevent
incorrect label binding in sim.ts by verifying ring.nextElementSibling is a text
element before assigning it, type SimNode.label as SVGTextElement | null, and
skip label position updates when it is null; update DragField.tsx to always
render a text element per node so the expected glow, ring, label order is
maintained.

frontend/src/components/landing-v5/Faq.tsx-66-71 (1)

66-71: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

"Read the full FAQ" links to its own section.

href="#faq" targets the section that contains the link, so the control does nothing. This PR adds a /faq route. Point the link there.

🔗 Proposed fix

- <a href="`#faq`" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>+ <a href="/faq" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 66 - 71, Update the
“Read the full FAQ” anchor in the FAQ component to navigate to the newly added
/faq route instead of the local `#faq` section, preserving its existing styling
and text.

frontend/src/components/landing-v5/Journal.tsx-184-199 (1)

184-199: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Set type="email" and guard the current submit flow.

The Journal input is an email address, so use type="email" for mobile keyboard and browser validation. The current actions.subscribe, at frontend/src/components/landing/useLanding.ts:624, only checks email.includes('@') and sets local subscribed state. If this should be a stub, make that intent explicit; otherwise wire onSubscribe to a newsletter endpoint before showing “You’re on the tree”.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 184 - 199,
Update the Journal email input in the landing component to use type="email" and
preserve the existing onSubscribe flow only as an explicit stub, or wire
onSubscribe to the newsletter endpoint and show the subscribed state only after
a successful submission. Locate the handler through actions.subscribe/useLanding
and ensure invalid emails cannot enter the success state.

frontend/src/components/landing-v5/Faq.tsx-79-116 (1)

79-116: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Closed answers stay in the accessibility tree, and the button has no aria-controls.

The collapsed panel uses maxHeight: 0, opacity: 0, and overflow: hidden. None of these remove the content from assistive technology, so a screen reader reads every answer even when the accordion is closed. The button also declares aria-expanded without naming the region it controls.

Add aria-controls with a stable id, and set aria-hidden on the panel while it is closed. aria-hidden does not disturb the max-height transition, because the content holds no focusable elements.

♿ Proposed fix

 <button
onClick={() => onToggle(open ? -1 : i)}
aria-expanded={open}
+ aria-controls={`faq-answer-${i}`}
style={{ width: '100%', background: 'none', border: 'none', cursor: 'pointer', padding: '22px 4px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 20, textAlign: 'left' }}
>

 <div
+ id={`faq-answer-${i}`}+ role="region"+ aria-hidden={!open}
style={{

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 79 - 116, Update the
FAQ accordion around the toggle button and answer panel to give each panel a
stable unique id, reference it from the button via aria-controls, and set
aria-hidden based on the open state so closed answers are excluded from the
accessibility tree. Preserve the existing visual transition and aria-expanded
behavior.

frontend/src/components/landing-v5/Navbar.tsx-199-235 (1)

199-235: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

role="menu" is applied to navigation disclosures whose children are not menu items. Both new navigation panels declare role="menu", but their children are plain button elements and next/link anchors. The ARIA menu pattern permits only menuitem, menuitemradio, and menuitemcheckbox children, so screen readers report both groups incorrectly. Both panels are page navigation, not application menus, so the correct fix in each place is to remove the role rather than to add menuitem roles.

• frontend/src/components/landing-v5/Navbar.tsx#L199-L235: remove role="menu" from the compact panel, and remove aria-haspopup="menu" from the trigger at line 120. Keep aria-expanded.
• frontend/src/components/landing-v5/Closing.tsx#L154-L182: remove role="menu" from the jump panel, and remove aria-haspopup="menu" from the pill at line 188. The enclosing nav with aria-label="Page sections" already carries the correct semantics.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Navbar.tsx` around lines 199 - 235, The
navigation disclosures use menu semantics with ordinary links and buttons;
remove those menu roles and triggers’ menu-haspopup attributes. In
frontend/src/components/landing-v5/Navbar.tsx lines 199-235, remove role="menu"
from the compact panel and remove aria-haspopup="menu" from its trigger while
retaining aria-expanded. In frontend/src/components/landing-v5/Closing.tsx lines
154-182, remove role="menu" from the jump panel and remove aria-haspopup="menu"
from the pill trigger; keep the enclosing navigation semantics and existing
expansion state.

frontend/src/app/(public)/page.tsx-115-116 (1)

115-116: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Clear the deferred openGal timers on unmount.

actions.openGal schedules actions.enterExplore / actions.openGal 260 ms later from onQuiz and onLearn. If the page unmounts before those timers fire, openGal runs after cleanup and writes document.body.style.overflow = 'hidden' after the landing cleanup reset that overflow. Keep the timer refs in useLanding so cleanup can call clearTimeout for them.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/page.tsx around lines 115 - 116, Update useLanding
and the onQuiz/onLearn handlers to store each 260 ms openGal timeout in refs,
rather than discarding the timer IDs. In the landing cleanup, clear both
deferred timers before resetting document.body overflow, preventing
actions.openGal from running after unmount.

frontend/src/components/landing-v5/ActTutor.tsx-93-109 (1)

93-109: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Expose the selected tutor mode, and keep the hidden pills out of the tab order.

Two gaps in this control group:

1. The pills are a mode selector, but the selected state is carried only by background and color. Assistive technology cannot report which mode is active. Add aria-pressed={tutorMode === i}.
2. The container starts at opacity: 0 with pointerEvents: 'none', and the engine fades it in later. The buttons stay focusable while invisible, so a keyboard user can focus a control that is not visible. Mirror the visual state in the tab order.

Also add type="button", which the other sections in this PR set consistently.

♻️ Proposed fix for the pill group

- {CAPTIONS.map(([tag], i) => (- <button- key={tag}- onClick={() => onSetMode(i)}+ {CAPTIONS.map(([tag], i) => (+ <button+ key={tag}+ type="button"+ aria-pressed={tutorMode === i}+ onClick={() => onSetMode(i)}

The engine already writes opacity on the container. Have it also clear visibility or the inert attribute so the pills leave the tab order until the handover:

- <div data-tutor-pills="1" style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>+ <div data-tutor-pills="1" inert style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActTutor.tsx` around lines 93 - 109,
Update the tutor pill group in ActTutor’s CAPTIONS map to add type="button" and
aria-pressed={tutorMode === i} to each button. Keep the hidden container’s
buttons out of the tab order while the engine-controlled opacity is zero by
mirroring its hidden state with inert or an equivalent visibility-based
mechanism, and ensure the existing handover clears that state when the pills
become visible.

frontend/src/components/landing-v5/ActGraph.tsx-333-340 (1)

333-340: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Add an Escape key exit for explore mode.

Explore mode covers the act and closes the navbar, but useLanding only handles Escape for gallery and jump controls. If explore mode is active, call onExitExplore from the key handler so keyboard-only users can leave the mode safely.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActGraph.tsx` around lines 333 - 340,
Update the existing keyboard handler in useLanding to detect Escape while
explore mode is active and call onExitExplore. Preserve the current Escape
behavior for gallery and jump controls, and ensure the explore-mode exit path is
available to keyboard-only users.

frontend/src/lib/landing/hero3d/index.ts-175-189 (1)

175-189: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Release the WebGL context in stop().

stop() already disposes three.js resources and cancels the render loop. WebGLRenderer.dispose() does not release the WebGL context, and this rig creates a new context on its canvas each mount. Add renderer.forceContextLoss() after renderer.dispose() so repeated navigation can reclaim the browser contexts sooner.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/hero3d/index.ts` around lines 175 - 189, Update the
returned stop() method to call renderer.forceContextLoss() immediately after
renderer.dispose(), ensuring the WebGL context is released during cleanup while
preserving the existing resource disposal and animation cancellation behavior.

🧹 Nitpick comments (14)

frontend/src/components/landing-v5/lab/LabShell.tsx (1)

51-84: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Segmented is unused; two demos duplicate it inline.

The comment states that the tutor and calendar demos use this control. They do not import it. CalendarDemo.tsx lines 61-76 and TutorDemo.tsx lines 65-80 each contain an inline copy of the same markup and style logic. Use Segmented in both demos, or delete it and correct the comment.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx` around lines 51 - 84,
Resolve the unused Segmented component by replacing the duplicated inline
segmented-control markup in CalendarDemo and TutorDemo with the shared Segmented
component, passing each demo’s options, current value, and change handler.
Preserve the existing labels, selection behavior, and styling, and keep the
component’s public API unchanged.

frontend/src/components/landing-v5/lab/QuizDemo.tsx (1)

33-35: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Difficulty badge changes while the same question is shown.

submit updates streak before it sets phase to review. qi does not change. The badge therefore flips from MEDIUM to HARD or EASY while the user still reads question 1 and its explanation. Derive the badge from the difficulty that applied when the question was served, for example from answers.length captured at question start.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 33 - 35,
Update the difficulty derivation in QuizDemo so the badge remains tied to the
difficulty assigned when the current question was served, rather than
recomputing from the mutable streak during review. Capture or derive the
question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.

frontend/src/components/landing-v5/lab/GradesDemo.tsx (1)

62-65: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Row percentage is unclamped while the weighted grade is clamped.

Line 25 clamps the score into [0, r.possible]. Line 64 uses the unclamped raw. If the user types 70 in a 50-point row, the row shows 140% while the category bar and the overall grade cap at 100%. Apply the same clamp in both places.

♻️ Proposed fix

 const raw = parseFloat(earned[i]);
- const pct = isNaN(raw) ? null : Math.round((raw / r.possible) * 100);+ const pct = isNaN(raw) ? null : Math.round((Math.max(0, Math.min(raw, r.possible)) / r.possible) * 100);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx` around lines 62 - 65,
Clamp the parsed score used in the row percentage calculation within the same
[0, r.possible] bounds already applied to the weighted grade. Update the
percentage logic in the GB_ROWS map callback, preserving the existing null
handling and color thresholds while ensuring values above or below the row
limits cannot produce percentages outside 0–100.

frontend/src/components/landing-v5/lab/labData.ts (1)

13-13: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Remove duplicated TIER from labData.ts.

labData.ts exports TIER, but the lab demos import LAB_TIER and render with labData.ts content. The four hex values and keys match LAB_TIER, so two copies of this swatch set can drift. Drop TIER from labData.ts and keep using LAB_TIER.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/labData.ts` at line 13, Remove the
exported TIER constant from labData.ts, since it duplicates the matching
LAB_TIER swatch set. Update any references in labData.ts to use LAB_TIER
instead, preserving the existing keys and color values.

frontend/src/lib/landing/engine/graph.ts (1)

122-127: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Replace the random-comparator shuffle with Fisher–Yates.

sort(() => Math.random() - 0.5) uses an inconsistent comparator. The resulting permutation is biased and depends on the engine's sort implementation, so many nodes keep positions close to their original index. That works against the documented intent of an organic reveal order.

♻️ Proposed fix

- // Shuffle the reveal order so the graph assembles organically.- const order = nodes.map((_, i) => i).sort(() => Math.random() - 0.5);+ // Shuffle the reveal order so the graph assembles organically.+ const order = nodes.map((_, i) => i);+ for (let i = order.length - 1; i > 0; i--) {+ const j = Math.floor(Math.random() * (i + 1));+ [order[i], order[j]] = [order[j], order[i]];+ }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/graph.ts` around lines 122 - 127, Replace the
random-comparator sort in the reveal-order logic with an unbiased Fisher–Yates
shuffle of the index array. Keep the existing spawnAt and colorAt calculations
and node ordering behavior after shuffling unchanged.

frontend/src/app/(public)/wiki/page.tsx (1)

31-39: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Make lede optional so the privacy section does not render an empty paragraph.

The privacy section passes lede="". Section always renders the <p>, so the page emits an empty paragraph with 0 0 20px margins. That adds dead space and an empty node in the accessibility tree.

♻️ Proposed fix

-function Section({ id, title, lede, children }: { id: string; title: string; lede: string; children?: React.ReactNode }) {+function Section({ id, title, lede, children }: { id: string; title: string; lede?: string; children?: React.ReactNode }) {
return (
<section style={{ marginTop: 56, scrollMarginTop: 110 }} id={id}>
<SectionHeading>{title}</SectionHeading>
- <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ {lede ? (+ <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ ) : null}
{children}

Then drop lede="" at line 147.

Also applies to: 147-149

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/wiki/page.tsx around lines 31 - 39, Make the lede
prop optional in Section and render the paragraph only when lede has content, so
the privacy section does not produce an empty element or spacing. Remove the
lede="" argument from the privacy Section usage while preserving existing lede
rendering for other sections.

frontend/src/lib/landing/engine/marquee.ts (1)

136-144: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick win

Avoid the per-frame layout read in update().

update() runs from the engine tick on every frame the gallery is on screen. Line 136 reads wrap.clientWidth on each of those frames, and line 156 writes track.style.transform. The write dirties style, so the next frame's read forces a style recalculation and layout. That contradicts the engine invariant documented in frontend/src/lib/landing/engine/index.ts lines 4-8, which states the tick never reads layout.

Observe the container width instead, and re-measure only when it changes.

♻️ Proposed approach

- // measure one card set only when the container width changed- if (!m.setW || m.measuredW !== wrap.clientWidth) {+ // measure one card set only when a ResizeObserver marked it stale+ if (!m.setW) {

Then in bind, mark the state stale from an observer and add its teardown to cleanups:

constro=newResizeObserver(()=>{m.setW=0;});if(wrap)ro.observe(wrap);cleanups.push(()=>ro.disconnect());

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/marquee.ts` around lines 136 - 144, Remove
the per-frame wrap.clientWidth read from update() and move width-change
detection to bind using a ResizeObserver on wrap. Have the observer mark m.setW
stale, register ro.disconnect in cleanups, and preserve the existing measurement
logic when update() sees stale state without reading layout every tick.

frontend/src/components/landing-v5/FeatureLab.tsx (1)

94-119: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Mark the active rail button for assistive technology.

on changes only the colors. Add aria-current="true" on the selected button so the active tool is conveyed without color.

♿ Proposed change

 data-rail={i}
type="button"
+ aria-current={on || undefined}
onClick={() => onPick(i)}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 94 - 119, Add
an aria-current="true" attribute to the selected rail button rendered in the
GAL.map callback, using the existing on condition so assistive technology
identifies the active tool without relying on color.

frontend/src/components/landing-v5/Gallery.tsx (1)

71-73: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

The wrapper duplicates the miniature's own container.

The <div> here sets height: 166, borderRadius: 13, overflow: hidden, the same background, and the same border. Every entry in GALLERY_MINIS opens with a <div> carrying that identical style set (see galleryMinis.tsx line 16). One of the two layers is redundant. Because the minis are generated, drop the wrapper here rather than editing the generated file.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 71 - 73, Remove
the redundant wrapper div around GALLERY_MINIS[i] in Gallery, rendering the
miniature directly while preserving its existing placement and aria-hidden
behavior. Do not modify the generated galleryMinis.tsx entries.

frontend/src/lib/landing/engine/flip.ts (1)

24-25: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

FlipState.ran is never read.

armFlip sets ran = false and flipClose resets it, but no code in this module or in frontend/src/components/landing/useLanding.ts reads it. The consumer tracks the same guard with its own flipRan ref (see useLanding.ts lines 158, 552, 574-575). Two guards for one invariant can drift. Either remove ran from FlipState or make flipOpen own the guard and delete flipRan from the hook.

Also applies to: 78-78

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/flip.ts` around lines 24 - 25, Remove the
unused FlipState.ran field and its assignments in armFlip and flipClose, since
useLanding already owns this guard through flipRan. Keep the existing
flipRan-based behavior unchanged and avoid maintaining duplicate state for the
same invariant.

frontend/src/lib/landing/engine/hero.ts (1)

99-136: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Points behind the camera reach the link pass with a degenerate scale.

sc = FL / (FL + z) is computed for every node. Rotation mixes ox into z, and ox reaches about ±740 while oz reaches about ±340, so z can pass -1000. At z === -FL the divide produces Infinity, and below -FL it produces a negative scale.

The point pass guards this at line 139 with p.z > -FL. The link pass at lines 116-136 does not. A node with Infinity scale gives reach === Infinity, so the break at line 122 never fires for that row and the inner loop degrades to a full scan.

Filter the projection once, so both passes share the guard.

♻️ Proposed change

 const proj = nodes
.map((n) => {
...
})
+ // drop anything at or behind the projection plane: `sc` is not finite+ // there, which breaks both the link reach and the point radius+ .filter((p) => p.z > -FL)
.sort((a, b) => b.z - a.z);

The p.z > -FL test at line 139 then becomes redundant and can go.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/hero.ts` around lines 99 - 136, Filter the
projected nodes immediately after the `proj` mapping so only entries with `p.z >
-FL` remain before sorting and running the link pass. Reuse this filtered
collection for both link rendering and the later point-rendering pass, then
remove the now-redundant `p.z > -FL` guard in the point pass.

frontend/src/components/landing/useLanding.ts (1)

378-392: 🚀 Performance & Scalability | 🔵 Trivial | 💤 Low value

The reveal scan polls every 900ms for the page lifetime.

scan() re-queries [data-reveal] across the whole landing root twice per second, forever, to catch elements that mount later. A MutationObserver on root would react to the same additions without the standing timer. This is a nice-to-have; the current cost is one querySelectorAll per tick.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 378 - 392,
Replace the lifetime polling interval in the reveal setup around scan with a
MutationObserver watching root for added elements, invoking scan when matching
content mounts later. Keep the initial scan, existing seen/io behavior, and
cleanup, but disconnect the mutation observer instead of clearing an interval.

frontend/src/lib/landing/engine/sim.ts (1)

282-299: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

up ignores pointerId, and the window listeners are registered once per cluster.

Two small points in bindDrag:

• up does not compare e.pointerId with f.drag.id. A second pointer that lifts cancels the active drag. onMove does compare the id, so the handlers are inconsistent.
• onMove and up are added to window inside the per-cluster loop. With N clusters in one group, every window pointer event runs N identical handlers. Bind the window listeners once per group instead.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 282 - 299, Update
bindDrag so up ignores pointer events whose pointerId does not match f.drag.id,
matching onMove’s active-pointer validation. Move the window-level pointermove,
pointerup, and pointercancel listener registration out of the per-cluster
binding loop and register each once per group, while keeping the per-SVG
listeners on the individual cluster SVG.

frontend/src/components/landing-v5/Closing.tsx (1)

75-92: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Share the companion-page list, and make the footer icon decorative.

Two points:

1. FOOTER_LINKS repeats PAGES in Navbar.tsx (lines 26-33) with the same six label and href pairs. Both files are new in this PR, so the two lists will drift the first time a companion page is added or renamed. Export one list and import it in both places.
2. Line 91 sets alt="Sapling" on the icon, and the adjacent text already reads "Sapling · © 2026". A screen reader announces the name twice. Navbar.tsx line 100 already uses alt="" for the same icon beside the same wordmark.

♻️ Proposed fix

- <Image src="/sapling-icon.svg" alt="Sapling" width={20} height={20} />+ <Image src="/sapling-icon.svg" alt="" width={20} height={20} />

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Closing.tsx` around lines 75 - 92, Share
the companion-page link list currently duplicated as FOOTER_LINKS in SiteFooter
and PAGES in Navbar by exporting one canonical list and importing it in both
components, preserving all six label/href pairs. Update the footer Image in
SiteFooter to use an empty alt value so the adjacent Sapling text is announced
only once.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/app/globals.css`:
- Around line 1957-2005: Rename the camelCase keyframe declarations in the
affected stylesheet to kebab-case, including symbols such as s1Stem,
saplingBlob, introOrbit, popHold, and the additional reported ranges. Update
every corresponding animation and animation-name reference to the new kebab-case
identifiers, preserving all animation behavior.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 41-50: Update the modal container identified by panelRef in
FeatureLab to add role="dialog", aria-modal="true", and an accessible name. On
mount, move focus into the panel; while open, trap Tab navigation within it so
focus cannot reach the page behind the overlay. Capture and restore focus to the
triggering element stored in FlipState.el when the panel closes, while
preserving the existing Escape close behavior.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 62-85: Update Card so non-ghost cards are keyboard-focusable and
activatable, using the existing track click-delegation contract, while ghost
duplicates remain excluded from the tab order and accessibility tree. Add the
corresponding keyboard activation handling to the card or track using the
existing feature-lab target behavior, and correct the nearby doc comment to
match the implemented accessibility behavior. Add a visible
.ld-galcard:focus-visible style in globals.css.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 37-44: Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout
in the rate handler is stored in a useRef, cleared before scheduling each new
rating and during unmount, and remove the ineffective returned cleanup. Update
NotesDemo.tsx at lines 57-80 so the 700 ms extract and summarize timeouts use
refs and are cleared in the existing unmount effect alongside saveT.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx`:
- Around line 21-24: Update the RECENT entries’ pick values to exactly match an
existing exam option in the corresponding GUIDES course fixture, preserving
openRecent’s assignment and keeping the select value consistent with the guide
heading.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 104-124: Fix the quiz option accessibility semantics in the
q.options mapping: either make each button a radio with role="radio" and
aria-checked bound to isPicked while retaining the radiogroup, or remove the
radiogroup role and expose isPicked through aria-pressed. Preserve the existing
selection and reviewing behavior in the option onClick handler.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 213-224: Update the hero canvas useEffect around startHeroCanvas
to track a cancelled/unmounted flag. Set it during cleanup, check it after the
asynchronous hero module import resolves before starting the canvas, and stop
the returned controller when appropriate so no animation loop or resize listener
remains after unmount.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 423-430: Update the initialization and destroy flow around
ensureInit and destroy to retain each cluster element’s original parent before
moving it into the overlay. During destroy, restore every cluster to that
parent, clear the inline styles applied by ensureInit, then remove the overlay
and reset state so a later ensureInit can rebuild the field without disrupting
React-owned nodes.
---
Minor comments:
In `@frontend/src/app/`(public)/page.tsx:
- Around line 115-116: Update useLanding and the onQuiz/onLearn handlers to
store each 260 ms openGal timeout in refs, rather than discarding the timer IDs.
In the landing cleanup, clear both deferred timers before resetting
document.body overflow, preventing actions.openGal from running after unmount.
In `@frontend/src/components/landing-v5/ActGraph.tsx`:
- Around line 333-340: Update the existing keyboard handler in useLanding to
detect Escape while explore mode is active and call onExitExplore. Preserve the
current Escape behavior for gallery and jump controls, and ensure the
explore-mode exit path is available to keyboard-only users.
In `@frontend/src/components/landing-v5/ActTutor.tsx`:
- Around line 93-109: Update the tutor pill group in ActTutor’s CAPTIONS map to
add type="button" and aria-pressed={tutorMode === i} to each button. Keep the
hidden container’s buttons out of the tab order while the engine-controlled
opacity is zero by mirroring its hidden state with inert or an equivalent
visibility-based mechanism, and ensure the existing handover clears that state
when the pills become visible.
In `@frontend/src/components/landing-v5/Faq.tsx`:
- Around line 66-71: Update the “Read the full FAQ” anchor in the FAQ component
to navigate to the newly added /faq route instead of the local `#faq` section,
preserving its existing styling and text.
- Around line 79-116: Update the FAQ accordion around the toggle button and
answer panel to give each panel a stable unique id, reference it from the button
via aria-controls, and set aria-hidden based on the open state so closed answers
are excluded from the accessibility tree. Preserve the existing visual
transition and aria-expanded behavior.
In `@frontend/src/components/landing-v5/Journal.tsx`:
- Around line 96-101: Update the post card anchor in the Journal component to
navigate to the new /news route instead of the containing `#newsletter` section,
while preserving the existing card styling and behavior.
- Around line 184-199: Update the Journal email input in the landing component
to use type="email" and preserve the existing onSubscribe flow only as an
explicit stub, or wire onSubscribe to the newsletter endpoint and show the
subscribed state only after a successful submission. Locate the handler through
actions.subscribe/useLanding and ensure invalid emails cannot enter the success
state.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 46-53: Update the keydown handler in the useEffect to detect when
the event target is an interactive element, such as a button or link, and skip
both flip() and preventDefault() for those targets. Preserve the existing global
space-to-flip and rate-key behavior for non-interactive targets.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx`:
- Around line 57-80: Update the extract and summarize timeout flows to store
their setTimeout handles in dedicated refs, and clear both refs in the existing
unmount effect alongside saveT. Ensure the callbacks still perform their current
state updates when they complete, while preventing them from running after the
component unmounts.
- Line 63: Update the concept-loading logic around the setConcepts call to keep
concepts empty when found has no matches instead of inserting a “No concepts
found” sentinel; track the empty-result state separately and use it for the
empty-state display while ensuring the footer count reflects only actual linked
concepts.
In `@frontend/src/components/landing-v5/Navbar.tsx`:
- Around line 199-235: The navigation disclosures use menu semantics with
ordinary links and buttons; remove those menu roles and triggers’ menu-haspopup
attributes. In frontend/src/components/landing-v5/Navbar.tsx lines 199-235,
remove role="menu" from the compact panel and remove aria-haspopup="menu" from
its trigger while retaining aria-expanded. In
frontend/src/components/landing-v5/Closing.tsx lines 154-182, remove role="menu"
from the jump panel and remove aria-haspopup="menu" from the pill trigger; keep
the enclosing navigation semantics and existing expansion state.
In `@frontend/src/lib/landing/engine/dom.ts`:
- Around line 49-73: Update cv so zero-sized measurements are not stored in the
CanvasCache: when clientWidth or clientHeight is zero, avoid assigning the newly
measured cache to rec.__cv while preserving the current context and sizing
behavior. Ensure subsequent calls re-read dimensions until both measurements are
nonzero, while retaining normal caching for valid sizes.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 184-203: Prevent incorrect label binding in sim.ts by verifying
ring.nextElementSibling is a text element before assigning it, type
SimNode.label as SVGTextElement | null, and skip label position updates when it
is null; update DragField.tsx to always render a text element per node so the
expected glow, ring, label order is maintained.
In `@frontend/src/lib/landing/hero3d/index.ts`:
- Around line 175-189: Update the returned stop() method to call
renderer.forceContextLoss() immediately after renderer.dispose(), ensuring the
WebGL context is released during cleanup while preserving the existing resource
disposal and animation cancellation behavior.
---
Nitpick comments:
In `@frontend/src/app/`(public)/wiki/page.tsx:
- Around line 31-39: Make the lede prop optional in Section and render the
paragraph only when lede has content, so the privacy section does not produce an
empty element or spacing. Remove the lede="" argument from the privacy Section
usage while preserving existing lede rendering for other sections.
In `@frontend/src/components/landing-v5/Closing.tsx`:
- Around line 75-92: Share the companion-page link list currently duplicated as
FOOTER_LINKS in SiteFooter and PAGES in Navbar by exporting one canonical list
and importing it in both components, preserving all six label/href pairs. Update
the footer Image in SiteFooter to use an empty alt value so the adjacent Sapling
text is announced only once.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 94-119: Add an aria-current="true" attribute to the selected rail
button rendered in the GAL.map callback, using the existing on condition so
assistive technology identifies the active tool without relying on color.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 71-73: Remove the redundant wrapper div around GALLERY_MINIS[i] in
Gallery, rendering the miniature directly while preserving its existing
placement and aria-hidden behavior. Do not modify the generated galleryMinis.tsx
entries.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx`:
- Around line 62-65: Clamp the parsed score used in the row percentage
calculation within the same [0, r.possible] bounds already applied to the
weighted grade. Update the percentage logic in the GB_ROWS map callback,
preserving the existing null handling and color thresholds while ensuring values
above or below the row limits cannot produce percentages outside 0–100.
In `@frontend/src/components/landing-v5/lab/labData.ts`:
- Line 13: Remove the exported TIER constant from labData.ts, since it
duplicates the matching LAB_TIER swatch set. Update any references in labData.ts
to use LAB_TIER instead, preserving the existing keys and color values.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx`:
- Around line 51-84: Resolve the unused Segmented component by replacing the
duplicated inline segmented-control markup in CalendarDemo and TutorDemo with
the shared Segmented component, passing each demo’s options, current value, and
change handler. Preserve the existing labels, selection behavior, and styling,
and keep the component’s public API unchanged.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 33-35: Update the difficulty derivation in QuizDemo so the badge
remains tied to the difficulty assigned when the current question was served,
rather than recomputing from the mutable streak during review. Capture or derive
the question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 378-392: Replace the lifetime polling interval in the reveal setup
around scan with a MutationObserver watching root for added elements, invoking
scan when matching content mounts later. Keep the initial scan, existing seen/io
behavior, and cleanup, but disconnect the mutation observer instead of clearing
an interval.
In `@frontend/src/lib/landing/engine/flip.ts`:
- Around line 24-25: Remove the unused FlipState.ran field and its assignments
in armFlip and flipClose, since useLanding already owns this guard through
flipRan. Keep the existing flipRan-based behavior unchanged and avoid
maintaining duplicate state for the same invariant.
In `@frontend/src/lib/landing/engine/graph.ts`:
- Around line 122-127: Replace the random-comparator sort in the reveal-order
logic with an unbiased Fisher–Yates shuffle of the index array. Keep the
existing spawnAt and colorAt calculations and node ordering behavior after
shuffling unchanged.
In `@frontend/src/lib/landing/engine/hero.ts`:
- Around line 99-136: Filter the projected nodes immediately after the `proj`
mapping so only entries with `p.z > -FL` remain before sorting and running the
link pass. Reuse this filtered collection for both link rendering and the later
point-rendering pass, then remove the now-redundant `p.z > -FL` guard in the
point pass.
In `@frontend/src/lib/landing/engine/marquee.ts`:
- Around line 136-144: Remove the per-frame wrap.clientWidth read from update()
and move width-change detection to bind using a ResizeObserver on wrap. Have the
observer mark m.setW stale, register ro.disconnect in cleanups, and preserve the
existing measurement logic when update() sees stale state without reading layout
every tick.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 282-299: Update bindDrag so up ignores pointer events whose
pointerId does not match f.drag.id, matching onMove’s active-pointer validation.
Move the window-level pointermove, pointerup, and pointercancel listener
registration out of the per-cluster binding loop and register each once per
group, while keeping the per-SVG listeners on the individual cluster SVG.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 865084a7-2f4d-472c-accd-6f67530e2a35

📥 Commits

Reviewing files that changed from the base of the PR and between ec34bf1 and 741ec10.

⛔ Files ignored due to path filters (3)

• frontend/public/journal-ai-homework.png is excluded by !**/*.png
• frontend/public/journal-founding.png is excluded by !**/*.png
• frontend/public/kofi-symbol.png is excluded by !**/*.png

📒 Files selected for processing (75)

• frontend/e2e/landing-graph.spec.ts
• frontend/e2e/public-seo.spec.ts
• frontend/eslint-suppressions.json
• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/companion/primitives.tsx
• frontend/src/components/landing-v5/ActGraph.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/ActTutor.tsx
• frontend/src/components/landing-v5/Closing.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/Faq.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/components/landing-v5/Gallery.tsx
• frontend/src/components/landing-v5/Hero.tsx
• frontend/src/components/landing-v5/IntroOverlay.tsx
• frontend/src/components/landing-v5/Journal.tsx
• frontend/src/components/landing-v5/Navbar.tsx
• frontend/src/components/landing-v5/galleryMinis.tsx
• frontend/src/components/landing-v5/lab/CalendarDemo.tsx
• frontend/src/components/landing-v5/lab/CardsDemo.tsx
• frontend/src/components/landing-v5/lab/GradesDemo.tsx
• frontend/src/components/landing-v5/lab/GuideDemo.tsx
• frontend/src/components/landing-v5/lab/LabShell.tsx
• frontend/src/components/landing-v5/lab/NotesDemo.tsx
• frontend/src/components/landing-v5/lab/QuizDemo.tsx
• frontend/src/components/landing-v5/lab/RoomsDemo.tsx
• frontend/src/components/landing-v5/lab/TutorDemo.tsx
• frontend/src/components/landing-v5/lab/index.tsx
• frontend/src/components/landing-v5/lab/labData.ts
• frontend/src/components/landing-v5/navTheme.ts
• frontend/src/components/landing/useLanding.ts
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx
• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/lib/landing/color.ts
• frontend/src/lib/landing/companionContent.ts
• frontend/src/lib/landing/content.ts
• frontend/src/lib/landing/course.ts
• frontend/src/lib/landing/dragClusters.ts
• frontend/src/lib/landing/engine/ambient.ts
• frontend/src/lib/landing/engine/dom.ts
• frontend/src/lib/landing/engine/flip.ts
• frontend/src/lib/landing/engine/graph.ts
• frontend/src/lib/landing/engine/graphView.ts
• frontend/src/lib/landing/engine/hero.ts
• frontend/src/lib/landing/engine/index.ts
• frontend/src/lib/landing/engine/marquee.ts
• frontend/src/lib/landing/engine/measure.ts
• frontend/src/lib/landing/engine/plant.ts
• frontend/src/lib/landing/engine/sim.ts
• frontend/src/lib/landing/hero3d/cardTexture.ts
• frontend/src/lib/landing/hero3d/index.ts

💤 Files with no reviewable changes (20)

• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/e2e/landing-graph.spec.ts
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

Use kebab-case keyframe names.

Stylelint reports every new camelCase keyframe identifier against keyframes-name-pattern. This leaves lint errors in the changed stylesheet. Rename the declarations to kebab case and update every matching animation or animation-name reference in the same change.

Also applies to: 2031-2033, 2082-2082, 2094-2096

🧰 Tools

🪛 Stylelint (17.14.0)

[error] 1957-1957: Expected keyframe name "s1Stem" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1958-1958: Expected keyframe name "s1LeafLo" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1964-1964: Expected keyframe name "s1LeafHi" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1970-1970: Expected keyframe name "s1Bud" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1971-1971: Expected keyframe name "s1Word" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1972-1972: Expected keyframe name "s1Rule" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1975-1975: Expected keyframe name "saplingBlob" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1976-1976: Expected keyframe name "introOrbit" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1977-1977: Expected keyframe name "floatIndicator" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1978-1978: Expected keyframe name "betaGlow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1979-1979: Expected keyframe name "nodeFloatA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1980-1980: Expected keyframe name "nodeFloatB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1983-1983: Expected keyframe name "popHold" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1984-1984: Expected keyframe name "chipSwapA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1985-1985: Expected keyframe name "chipSwapB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1986-1986: Expected keyframe name "flipLoop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1987-1987: Expected keyframe name "lineReveal" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1988-1988: Expected keyframe name "underSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1989-1989: Expected keyframe name "barGrow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1990-1990: Expected keyframe name "coverRise" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1991-1991: Expected keyframe name "ringDraw" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1992-1992: Expected keyframe name "gaugeFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1993-1993: Expected keyframe name "answerTick" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1994-1994: Expected keyframe name "waveBar" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1995-1995: Expected keyframe name "gaugeMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1996-1996: Expected keyframe name "coverMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1997-1997: Expected keyframe name "cursorMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1998-1998: Expected keyframe name "cardFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1999-1999: Expected keyframe name "scanSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2000-2000: Expected keyframe name "ocrBlink" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2001-2001: Expected keyframe name "panelFade" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2002-2002: Expected keyframe name "fillX" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2003-2003: Expected keyframe name "typingDot" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2004-2004: Expected keyframe name "ringPop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2005-2005: Expected keyframe name "cursorDrift" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/globals.css` around lines 1957 - 2005, Rename the camelCase
keyframe declarations in the affected stylesheet to kebab-case, including
symbols such as s1Stem, saplingBlob, introOrbit, popHold, and the additional
reported ranges. Update every corresponding animation and animation-name
reference to the new kebab-case identifiers, preserving all animation behavior.

Source: Linters/SAST tools

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

The overlay is a modal without dialog semantics or focus management.

The panel covers the viewport at zIndex: 80 and the caller locks body scroll. Three parts are missing:

• No role="dialog" and no aria-modal="true", so assistive technology does not announce a modal context.
• No accessible name on the container.
• No focus management. Focus stays on the gallery card behind the overlay, tabbing walks the page underneath, and closing does not return focus to the card that opened the panel.

Escape already closes the panel through useLanding.ts lines 272-276, so only the semantics and focus handling remain.

♿ Proposed direction

- <div style={{ position: 'fixed', inset: 0, zIndex: 80 }}>+ <div+ role="dialog"+ aria-modal="true"+ aria-label={`${g.kicker} demo`}+ style={{ position: 'fixed', inset: 0, zIndex: 80 }}+ >

Then move focus into the panel when it mounts, keep Tab inside it while it is open, and restore focus to the element captured by armFlip when it closes. frontend/src/lib/landing/engine/flip.ts already holds that element in FlipState.el.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 41 - 50,
Update the modal container identified by panelRef in FeatureLab to add
role="dialog", aria-modal="true", and an accessible name. On mount, move focus
into the panel; while open, trap Tab navigation within it so focus cannot reach
the page behind the overlay. Capture and restore focus to the triggering element
stored in FlipState.el when the panel closes, while preserving the existing
Escape close behavior.

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win

The gallery cards cannot be opened with a keyboard.

Opening the feature lab depends on the onClick delegation on the track div at lines 99-102. Card renders an <article> with no tabIndex, no role, and no key handler, and the track div has no key handler either. A keyboard user cannot reach or activate any card, so the feature lab is unreachable without a pointer. The doc comment at lines 14-15 states that the first copy is reachable by keyboard, which does not match the markup.

Make each non-ghost card an activatable control, keep the duplicate copies out of the tab order, and then correct the doc comment.

♿ Proposed fix

-function Card({ i, ghost }: { i: number; ghost: boolean }) {+function Card({ i, ghost, onOpen }: { i: number; ghost: boolean; onOpen: (i: number, el: HTMLElement | null) => void }) {
const c = CARDS[i];
return (
<article
data-tk={i}
aria-hidden={ghost || undefined}
+ role="button"+ tabIndex={ghost ? -1 : 0}+ aria-label={`Open ${c.kicker}`}+ onKeyDown={(e) => {+ if (e.key !== 'Enter' && e.key !== ' ') return;+ e.preventDefault();+ onOpen(i, e.currentTarget);+ }}
style={CARD}
className="ld-galcard"
>

- {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} />)}- {order.map((i) => <Card key={`b${i}`} i={i} ghost />)}+ {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} onOpen={onOpen} />)}+ {order.map((i) => <Card key={`b${i}`} i={i} ghost onOpen={onOpen} />)}

Add a visible focus style for .ld-galcard:focus-visible in globals.css.

Also applies to: 96-107

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 62 - 85, Update
Card so non-ghost cards are keyboard-focusable and activatable, using the
existing track click-delegation contract, while ghost duplicates remain excluded
from the tab order and accessibility tree. Add the corresponding keyboard
activation handling to the card or track using the existing feature-lab target
behavior, and correct the nearby doc comment to match the implemented
accessibility behavior. Add a visible .ld-galcard:focus-visible style in
globals.css.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

Handler timeouts are created without a ref, so they are never cancelled. Both demos schedule a state update from an event handler without storing the handle. The timeout cannot be cleared on unmount, and a second click cannot cancel a pending one. The other demos in this layer already hold each handle in a useRef and clear it in an unmount effect.

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44: store the 300 ms advance timeout in a ref, clear it before each new rating, and clear it on unmount; delete the returned cleanup, which React never calls.
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80: store the 700 ms extract and summarize timeouts in refs and clear them in the existing unmount effect beside saveT.

📍 Affects 2 files

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44 (this comment)
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 37 - 44,
Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout in the rate handler is
stored in a useRef, cleared before scheduling each new rating and during
unmount, and remove the ineffective returned cleanup. Update NotesDemo.tsx at
lines 57-80 so the 700 ms extract and summarize timeouts use refs and are
cleared in the existing unmount effect alongside saveT.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

RECENT[].pick values are not options of the exam select.

openRecent at line 53 sets exam to r.pick. 'Midterm 1 · Sep 30' is not in GUIDES['MA 242'].exams, and 'Quiz 2 · Oct 03' is not in GUIDES['CS 201'].exams. The controlled select at line 76 then falls back to displaying its first option while the guide heading at line 104 prints exam. The control and the heading disagree, and the user cannot select the displayed exam again.

Use an exam that exists in the course fixture, or add the recent exam to the option list when it is selected.

🔧 Proposed fix using existing fixture values

 const RECENT = [
- { i: 0, exam: 'MA 242 · Midterm 1', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Midterm 1 · Sep 30' },- { i: 1, exam: 'CS 201 · Quiz 2', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Quiz 2 · Oct 03' },+ { i: 0, exam: 'MA 242 · Final', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Final · Dec 12' },+ { i: 1, exam: 'CS 201 · Midterm 1', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Midterm 1 · Oct 17' },
];

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	constRECENT=[
	{i: 0,exam: 'MA 242 · Midterm 1',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Midterm 1 · Sep 30'},
	{i: 1,exam: 'CS 201 · Quiz 2',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Quiz 2 · Oct 03'},
	];
	constRECENT=[
	{i: 0,exam: 'MA 242 · Final',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Final · Dec 12'},
	{i: 1,exam: 'CS 201 · Midterm 1',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Midterm 1 · Oct 17'},
	];

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx` around lines 21 - 24,
Update the RECENT entries’ pick values to exactly match an existing exam option
in the corresponding GUIDES course fixture, preserving openRecent’s assignment
and keeping the select value consistent with the guide heading.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

role="radiogroup" has no radio children.

The container declares role="radiogroup", but each option is a plain <button>. A radiogroup requires children with role="radio" and aria-checked. Assistive technology cannot report which option is selected. Add the roles and state, or drop role="radiogroup" and expose selection with aria-pressed.

♿ Proposed fix

 <button
key={o.label}
type="button"
+ role="radio"+ aria-checked={isPicked}+ aria-disabled={reviewing}
onClick={() => { if (!reviewing) setPicked(o.label); }}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='#E3E0D5',bg='#FDFCF9',fg='#33443B',mark='',markCol='';
	if(reviewing&&correct){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';mark='CORRECT';markCol='#0C5638';}
	elseif(reviewing&&isPicked){bd='#b25855';bg='rgba(178,88,85,0.09)';fg='#9c4b48';mark='YOUR PICK';markCol='#9c4b48';}
	elseif(isPicked){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';}
	return(
	<button
	key={o.label}
	type="button"
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '#0E9E5A' : '#9AA5A0'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}
	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='`#E3E0D5`',bg='`#FDFCF9`',fg='`#33443B`',mark='',markCol='';
	if(reviewing&&correct){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';mark='CORRECT';markCol='`#0C5638`';}
	elseif(reviewing&&isPicked){bd='`#b25855`';bg='rgba(178,88,85,0.09)';fg='`#9c4b48`';mark='YOUR PICK';markCol='`#9c4b48`';}
	elseif(isPicked){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';}
	return(
	<button
	key={o.label}
	type="button"
	role="radio"
	aria-checked={isPicked}
	aria-disabled={reviewing}
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '`#0E9E5A`' : '`#9AA5A0`'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 104 - 124,
Fix the quiz option accessibility semantics in the q.options mapping: either
make each button a radio with role="radio" and aria-checked bound to isPicked
while retaining the radiogroup, or remove the radiogroup role and expose
isPicked through aria-pressed. Preserve the existing selection and reviewing
behavior in the option onClick handler.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

The hero canvas effect can start a loop that is never stopped.

import('@/lib/landing/engine/hero') resolves asynchronously. If the component unmounts before the promise resolves, the cleanup at line 222 runs while stopped is still null. The then callback then calls startHeroCanvas, which installs a requestAnimationFrame loop and a resize listener (see frontend/src/lib/landing/engine/hero.ts lines 83-87). Nothing cancels them afterwards, so the loop keeps drawing after navigation away from the landing page.

The WebGL effect at lines 227-244 already uses a cancelled flag. Apply the same pattern here.

🛠️ Proposed fix

 let stopped: { stop(): void } | null = null;
+ let cancelled = false;
// imported lazily so the module isn't pulled into the server bundle
import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas }) => {
+ if (cancelled) return;
stopped = startHeroCanvas(canvas, () => engine.mouse, () => engine.parallaxY);
});
- return () => stopped?.stop();+ return () => {+ cancelled = true;+ stopped?.stop();+ };

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	// imported lazily so the module isn't pulled into the server bundle
	import('@/lib/landing/engine/hero').then(({ startHeroCanvas })=>{
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>stopped?.stop();
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);
	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	letcancelled=false;
	// imported lazily so the module isn't pulled into the server bundle
	import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas })=>{
	if(cancelled)return;
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>{
	cancelled=true;
	stopped?.stop();
	};
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 213 - 224, Update
the hero canvas useEffect around startHeroCanvas to track a cancelled/unmounted
flag. Set it during cleanup, check it after the asynchronous hero module import
resolves before starting the canvas, and stop the returned controller when
appropriate so no animation loop or resize listener remains after unmount.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | 🏗️ Heavy lift

destroy() discards the re-homed clusters, so the field cannot be rebuilt.

ensureInit moves every cluster element out of its .drag-field and into the overlay (line 172), and it mutates the cluster's inline styles (lines 165-171). destroy() removes the shell through the queued cleanup, which deletes those cluster elements from the document. It does not put them back.

Two consequences:

1. A second ensureInit on the same DOM finds .drag-field elements with no [data-dragnode] children, returns false at line 232, and the field stays empty forever. This happens on any stop/start cycle, including the React StrictMode double-invoke of the engine effect in frontend/src/components/landing/useLanding.ts lines 162-210.
2. React still owns those cluster nodes, because DragField rendered them. React records the original parent for each child. Removing or reparenting the nodes outside React can make the later unmount removal fail.

Restore each cluster to its original parent and clear the inline styles that ensureInit set.

🛠️ Proposed fix: remember the original parent and restore it on destroy

 interface ClusterAnchor {
el: HTMLElement;
field: HTMLElement;
+ /** Where the cluster lived before it was re-homed into the overlay. */+ home: Node | null;+ before: Node | null;
/** The pinned act this field belongs to, if any — drives the scroll drift. */
sect: HTMLElement | null;
left: number;
top: number;
}

 anchors.push({
el: cl, field, sect,
+ home: cl.parentNode,+ before: cl.nextSibling,
left: b.left - fb.left,
top: b.top - fb.top,
});

 function destroy(): void {
+ // put the clusters back before the overlay goes away, otherwise React+ // still owns nodes that no longer exist and a later ensureInit finds+ // empty fields+ for (const a of anchors) {+ a.el.style.cssText = '';+ if (a.home) a.home.insertBefore(a.el, a.before);+ }
cleanups.forEach((fn) => fn());
cleanups.length = 0;
anchors.length = 0;
groups = null;
- if (overlay && overlay.parentElement) overlay.parentElement.removeChild(overlay);
overlay = null;
}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 423 - 430, Update the
initialization and destroy flow around ensureInit and destroy to retain each
cluster element’s original parent before moving it into the overlay. During
destroy, restore every cluster to that parent, clear the inline styles applied
by ensureInit, then remove the overlay and reset state so a later ensureInit can
rebuild the field without disrupting React-owned nodes.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/landing-v5/BetaModal.tsx`:
- Around line 52-70: Update the subscribed confirmation branch in BetaModal so
the rendered Close button receives focus after the form is replaced. Add a ref
to that button and focus it after the subscribed state commits, using the
component’s existing lifecycle pattern; preserve the current onClose behavior
and button styling.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ee1ca146-7600-423b-98c7-56bcec09e4e1

📥 Commits

Reviewing files that changed from the base of the PR and between 741ec10 and e506827.

📒 Files selected for processing (13)

• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/BetaModal.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/lib/landing/content.ts

💤 Files with no reviewable changes (2)

• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx

🚧 Files skipped from review as they are similar to previous changes (5)

• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/lib/landing/content.ts

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

Restore modal focus after the subscribed state replaces the form.

When subscribed becomes true, this branch unmounts the focused email input while Dialog remains open. Dialog only applies its initial focus when open changes. Focus can then leave the dialog and bypass its Tab trap. Move focus to the Close button after the confirmation state renders.

Proposed fix

-import { useId, useRef } from 'react';+import { useEffect, useId, useRef } from 'react';
...
const inputRef = useRef<HTMLInputElement>(null);
+ const confirmationCloseRef = useRef<HTMLButtonElement>(null);
const headingId = useId();
const valid = email.includes('@');
++ useEffect(() => {+ if (open && subscribed) confirmationCloseRef.current?.focus();+ }, [open, subscribed]);
...
<button
+ ref={confirmationCloseRef}
onClick={onClose}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '#12201A',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '#0C5638'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '#61726A',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '#0C5638',color: '#fff',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>
	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '`#12201A`',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '`#0C5638`'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '`#61726A`',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	ref={confirmationCloseRef}
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '`#0C5638`',color: '`#fff`',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/BetaModal.tsx` around lines 52 - 70,
Update the subscribed confirmation branch in BetaModal so the rendered Close
button receives focus after the form is replaced. Add a ref to that button and
focus it after the subscribed state commits, using the component’s existing
lifecycle pattern; preserve the current onClose behavior and button styling.

[Darkest-Teddy]

Ports Sapling Landing v5.dc.html (from docs/frontend-audit/Sapling landing page import (1).zip) into the Next.js frontend. v5 is now the landing page at /, replacing the previous marketing landing.

Supersedes #523. Based on feat/landing-v4-port, so its four commits ride along — v5 reuses that branch's scroll engine, course-graph model and editorial content. If v5 is the direction, #523 can be closed unmerged.

The title screen is a ground-up rebuild

Not a v4 tweak. Reading the source rather than the summary that accompanied the task turned up six divergences:

	Assumed	Actual v5 source
Wordmark	Archivo 800, ink #12201A	Playfair Display 600, #0C5638
Reveal	heroWipe clip-path	character scramble — heroWipe is defined, never referenced
Eyebrow	mono "GROW YOUR KNOWLEDGE"	Playfair "Grow Your Knowledge", title case, scrambled
Cascade	—	tagline leads (760ms), wordmark follows 260ms behind — v4 ran the reverse
Right bloom	mirrored green	teal rgba(43,140,150,0.2)
Panel rig	CSS perspective cards	three.js WebGL scene

Act III is likewise not the clipped 918×348 card track described in the brief — the source has a rotating triangular-prism carousel.

The v4 title screen was deleted rather than kept alongside. three/@types/three were already dependencies.

Four dead branches in the source

The design component carries a lot of machinery its own markup never reaches. Documented at each site:

1. const wantDark = false — the navbar's full two-theme colour table is built, then pinned to light. Wired live here, driven off the section under the viewport centre, as the brief calls for.
2. heroWipe / heroChar keyframes — defined, unreferenced. Not ported.
3. setHero0/1/2 + mode pills — exist only in renderVals(), so heroMode is pinned at 0 and only the panel scene can ever be seen. The constellation and growth-field shaders are unreachable; porting them would be porting dead code.
4. "Plant a concept" — plantVal, plantedCount, _plant(), a localStorage-backed grove and a canvas ref, none of it referenced. The CTA is heading + line + button.

Two engine bugs fixed

Both pre-existing in the v4 port, both invisible until a section actually had drag clusters:

• sim.ts reads a ring's halo via previousElementSibling and its caption via nextElementSibling; a <g> wrapper broke the adjacency and it threw on a null label.
• Clusters were anchored once, in page coordinates. The source captures each cluster's offset within its field, parks the overlay in a position:fixed shell, and re-applies anchor + field.rect every frame — which is what lets a cluster track its sticky section, and where the ≤150px drift inside a pinned act comes from.

Verified against the original served side by side: at 45% through act-tutor the source puts its 7 rings on screen at y≈121–608. This port now matches; before the fix it was 0 of 7, parked 8752px down.

Generated, not retyped

• galleryMinis.tsx — the 8 card miniatures, mechanically converted from the source's <article data-tk> blocks. Dense decorative animation where exact geometry and per-element delays are the effect. Regenerate rather than hand-edit.
• dragClusters.ts — the 8 course clusters, ~2KB of inline SVG each in the source, reduced to data + one component.
• companionContent.ts — 18 copy arrays lifted verbatim from the sibling pages.

Also in this PR

• The old marketing landing is retired. Deleting / orphaned marketing/graph/ (~95KB of passing tests for a surface no route mounts), marketing/surfaces/, FeatureBand, SurfaceBento, featureBands. HeroCard/SignInModal stay — the nav's Sign In opens the real OAuth modal.
• e2e/landing-graph.spec.ts goes with the component it pinned. public-seo.spec.ts's SSR guard is retargeted, not deleted: its failure mode (an ssr: false silently dropping the landing's copy from crawled HTML) outlived its selectors, and is sharper on a canvas/WebGL page. It deliberately does not assert the wordmark — that scrambles in client-side, so the h1's aria-label is checked instead. All 7 assertions verified against raw SSR output.
• The five companion pages the nav links to (/team, /wiki, /gallery, /news, /faq). Once v5 took /, those links 404'd. They use the warm paper palette deliberately — that is not a mistake to unify.

Known gaps

• Feature lab demo pane. The source mounts a separate FeatureLab design component per kind via <dc-import> — a distinct 75KB file the task's file list did not scope in. Layout, FLIP, rail, copy and close are faithful; the pane shows the card's miniature enlarged.
• Gallery tiles have no artwork — the import ships no screenshots.

Verification

• tsc --noEmit exit 0 · eslint exit 0 · next build exit 0, all 5 new routes prerendered static
• Unit suite 59 files / 423 tests passing
• Every section walked in a real browser at multiple scroll positions, no console errors; all 9 public routes return 200

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features
  • Introduced a redesigned landing experience with interactive knowledge graphs, tutoring modes, feature demos, gallery, journal, FAQ, and beta signup.
  • Added public FAQ, Gallery, News, Team, and Wiki pages with responsive navigation and searchable or filterable content.
  • Added interactive demonstrations for quizzes, flashcards, grades, calendars, notes, study rooms, guides, and tutoring.
• Documentation
  • Improved server-rendered landing-page checks for key accessible content and beta messaging.
• Refactor
  • Retired the previous marketing sections and legacy landing-page presentation.

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ebab108d-0405-4ae1-8d00-108ba83a0144

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Replaced the landing page with a component-based v5 experience, added interactive feature labs and companion pages, introduced shared animation engines and content data, and updated SSR coverage. Removed the former marketing graph, surface components, and related tests.

Changes

Landing v5 experience

Layer / File(s)	Summary
Landing content and data contracts frontend/src/lib/landing/*	Added landing content, course graph data, drag clusters, color utilities, and companion-page datasets.
Animation and interaction engines frontend/src/lib/landing/engine/*, frontend/src/lib/landing/hero3d/*	Added graph rendering, canvas effects, layout measurement, marquee and FLIP behavior, planting, drag simulation, and WebGL hero support.
Landing composition frontend/src/app/(public)/page.tsx, frontend/src/components/landing-v5/*, frontend/src/components/landing/useLanding.ts	Replaced the previous landing implementation with v5 hero, graph, ingest, tutor, gallery, FAQ, journal, CTA, navigation, modal, and lifecycle components.
Interactive feature labs frontend/src/components/landing-v5/lab/*	Added interactive quiz, flashcard, guide, grade, calendar, notes, rooms, and tutor demos with shared fixture data and controls.
Companion pages frontend/src/components/companion/*, frontend/src/app/(public)/{about,team,wiki,faq,gallery,news}/*	Added shared companion navigation and public About, Team, Wiki, FAQ, Gallery, and News routes.
Styling and SSR validation frontend/src/app/globals.css, frontend/e2e/public-seo.spec.ts, frontend/eslint-suppressions.json, frontend/src/lib/api.ts	Added scoped landing and companion styles, responsive animations, newsletter API wiring, and SSR checks for landing-page copy. Removed obsolete ESLint suppressions.

Estimated code review effort: 5 (Critical) | ~120 minutes

Possibly related PRs

• SaplingLearn/Sapling#513: Replaced the related knowledge-graph landing implementation and its supporting components.
• SaplingLearn/Sapling#63: Uses the same beta/newsletter signup flow implemented through BetaModal.
• SaplingLearn/Sapling#286: Also modifies the public landing page and shared styling layer.

Suggested reviewers:andresl230

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 36.59% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the primary change: porting Sapling Landing v5 into the landing page.
Description check	✅ Passed	The description explains the purpose, major changes, known gaps, related issue context, and verification results in substantial detail.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/landing-v5-port

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[supabase]

This pull request has been ignored for the connected project ybgqdonkoqftwrmweuyv because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[cloudflare-workers-and-pages]

Deploying with Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	frontend-staging	fc36068	Commit Preview URL Branch Preview URL	Aug 16 2026, 09:58 PM

[coderabbitai]

Actionable comments posted: 8

Note

Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.

🟡 Minor comments (14)

frontend/src/components/landing-v5/lab/NotesDemo.tsx-57-80 (1)

57-80: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

extract and summarize timeouts are untracked.

saveT is cleared on unmount, but the 700 ms timeouts at line 60 and line 71 are not stored and not cleared. If the lab panel closes within that window, the callbacks still run and set state on an unmounted component. Hold both handles in refs and clear them in the existing unmount effect.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` around lines 57 - 80,
Update the extract and summarize timeout flows to store their setTimeout handles
in dedicated refs, and clear both refs in the existing unmount effect alongside
saveT. Ensure the callbacks still perform their current state updates when they
complete, while preventing them from running after the component unmounts.

frontend/src/components/landing-v5/lab/CardsDemo.tsx-46-53 (1)

46-53: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The global space handler blocks button activation.

The keydown listener calls e.preventDefault() for every space press on window. A focused button then cannot be activated with space, including "Study again" at line 90. Skip the flip and the preventDefault call when the event target is an interactive element.

♿ Proposed fix

 const onKey = (e: KeyboardEvent) => {
+ const el = e.target as HTMLElement | null;+ if (el?.closest('button, input, textarea, select, [contenteditable]')) return;
if (e.key === ' ') { e.preventDefault(); flip(); }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 46 - 53,
Update the keydown handler in the useEffect to detect when the event target is
an interactive element, such as a button or link, and skip both flip() and
preventDefault() for those targets. Preserve the existing global space-to-flip
and rate-key behavior for non-interactive targets.

frontend/src/components/landing-v5/lab/NotesDemo.tsx-63-63 (1)

63-63: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The "no concepts" sentinel is counted as a linked concept.

When no matcher hits, concepts receives one placeholder entry. The footer at line 141 then renders "1 concepts linked to your MA 242 graph." The count is wrong and contradicts the placeholder. Keep concepts empty and track the empty result separately.

🔧 Proposed fix

+ const [ran, setRan] = useState(false);
@@
- setConcepts(found.length ? found : [{ name: 'No concepts found', tier: 'unexplored' }]);+ setConcepts(found);+ setRan(true);
setBusy(false);
@@
+ {ran && concepts.length === 0 && !busy && (+ <span style={{ fontSize: 12, color: '`#9AA5A0`' }}>No concepts found.</span>+ )}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` at line 63, Update the
concept-loading logic around the setConcepts call to keep concepts empty when
found has no matches instead of inserting a “No concepts found” sentinel; track
the empty-result state separately and use it for the empty-state display while
ensuring the footer count reflects only actual linked concepts.

frontend/src/lib/landing/engine/dom.ts-49-73 (1)

49-73: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Do not cache a zero-sized canvas measurement.

cv() caches w/h from clientWidth/clientHeight on the first call. The cache is dropped only by invalidateCanvas, which measure() calls only when the viewport dimensions change (see frontend/src/lib/landing/engine/measure.ts lines 98-104). If the first cv() call happens while the canvas is not laid out yet, or while its section is hidden, the cache stores 0 × 0. Every later frame then draws into a 0-pixel backing store, and the canvas stays blank until the viewport itself changes.

Skip the cache write when the measured size is zero, so the next frame re-reads it.

🐛 Proposed fix

 if (!c) {
const w = canvas.clientWidth;
const h = canvas.clientHeight;
const dpr = Math.min(window.devicePixelRatio || 1, 1.5);
let ctx = rec.__ctx as CanvasRenderingContext2D | undefined;
if (!ctx) {
ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
rec.__ctx = ctx;
}
c = { ctx, w, h, dpr };
- rec.__cv = c;+ // An unlaid-out or hidden canvas measures 0; don't freeze that in the+ // cache, or the next frames draw into a 0-pixel backing store.+ if (w > 0 && h > 0) rec.__cv = c;
const pw = Math.round(w * dpr);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/dom.ts` around lines 49 - 73, Update cv so
zero-sized measurements are not stored in the CanvasCache: when clientWidth or
clientHeight is zero, avoid assigning the newly measured cache to rec.__cv while
preserving the current context and sizing behavior. Ensure subsequent calls
re-read dimensions until both measurements are nonzero, while retaining normal
caching for valid sizes.

frontend/src/components/landing-v5/Journal.tsx-96-101 (1)

96-101: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Each post card links back to its own section.

href="#newsletter" points at the section that contains the card. The card presents as a link to an article, and activating it does nothing. This PR adds a /news route. Point each card at the article, or at /news until per-post routes exist.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 96 - 101, Update
the post card anchor in the Journal component to navigate to the new /news route
instead of the containing `#newsletter` section, while preserving the existing
card styling and behavior.

frontend/src/lib/landing/engine/sim.ts-184-203 (1)

184-203: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Label binding depends on an SVG sibling order that the markup does not guarantee.engine/sim.ts locates a node's caption through ring.nextElementSibling and casts it to SVGTextElement, while DragField renders that <text> only when a label exists for the node. When a label is missing, the sim binds the following node's glow <circle> and writes x/y onto it every frame, and ly becomes NaN.

• frontend/src/lib/landing/engine/sim.ts#L184-L203: check nextElementSibling.tagName === 'text' before the cast, type SimNode.label as SVGTextElement | null, and skip the label writes at lines 377-378 when it is null.
• frontend/src/components/landing-v5/DragField.tsx#L60-L92: alternatively, or in addition, always emit a <text> element per node so the documented glow → ring → label order holds for every node.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 184 - 203, Prevent
incorrect label binding in sim.ts by verifying ring.nextElementSibling is a text
element before assigning it, type SimNode.label as SVGTextElement | null, and
skip label position updates when it is null; update DragField.tsx to always
render a text element per node so the expected glow, ring, label order is
maintained.

frontend/src/components/landing-v5/Faq.tsx-66-71 (1)

66-71: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

"Read the full FAQ" links to its own section.

href="#faq" targets the section that contains the link, so the control does nothing. This PR adds a /faq route. Point the link there.

🔗 Proposed fix

- <a href="`#faq`" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>+ <a href="/faq" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 66 - 71, Update the
“Read the full FAQ” anchor in the FAQ component to navigate to the newly added
/faq route instead of the local `#faq` section, preserving its existing styling
and text.

frontend/src/components/landing-v5/Journal.tsx-184-199 (1)

184-199: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Set type="email" and guard the current submit flow.

The Journal input is an email address, so use type="email" for mobile keyboard and browser validation. The current actions.subscribe, at frontend/src/components/landing/useLanding.ts:624, only checks email.includes('@') and sets local subscribed state. If this should be a stub, make that intent explicit; otherwise wire onSubscribe to a newsletter endpoint before showing “You’re on the tree”.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 184 - 199,
Update the Journal email input in the landing component to use type="email" and
preserve the existing onSubscribe flow only as an explicit stub, or wire
onSubscribe to the newsletter endpoint and show the subscribed state only after
a successful submission. Locate the handler through actions.subscribe/useLanding
and ensure invalid emails cannot enter the success state.

frontend/src/components/landing-v5/Faq.tsx-79-116 (1)

79-116: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Closed answers stay in the accessibility tree, and the button has no aria-controls.

The collapsed panel uses maxHeight: 0, opacity: 0, and overflow: hidden. None of these remove the content from assistive technology, so a screen reader reads every answer even when the accordion is closed. The button also declares aria-expanded without naming the region it controls.

Add aria-controls with a stable id, and set aria-hidden on the panel while it is closed. aria-hidden does not disturb the max-height transition, because the content holds no focusable elements.

♿ Proposed fix

 <button
onClick={() => onToggle(open ? -1 : i)}
aria-expanded={open}
+ aria-controls={`faq-answer-${i}`}
style={{ width: '100%', background: 'none', border: 'none', cursor: 'pointer', padding: '22px 4px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 20, textAlign: 'left' }}
>

 <div
+ id={`faq-answer-${i}`}+ role="region"+ aria-hidden={!open}
style={{

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 79 - 116, Update the
FAQ accordion around the toggle button and answer panel to give each panel a
stable unique id, reference it from the button via aria-controls, and set
aria-hidden based on the open state so closed answers are excluded from the
accessibility tree. Preserve the existing visual transition and aria-expanded
behavior.

frontend/src/components/landing-v5/Navbar.tsx-199-235 (1)

199-235: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

role="menu" is applied to navigation disclosures whose children are not menu items. Both new navigation panels declare role="menu", but their children are plain button elements and next/link anchors. The ARIA menu pattern permits only menuitem, menuitemradio, and menuitemcheckbox children, so screen readers report both groups incorrectly. Both panels are page navigation, not application menus, so the correct fix in each place is to remove the role rather than to add menuitem roles.

• frontend/src/components/landing-v5/Navbar.tsx#L199-L235: remove role="menu" from the compact panel, and remove aria-haspopup="menu" from the trigger at line 120. Keep aria-expanded.
• frontend/src/components/landing-v5/Closing.tsx#L154-L182: remove role="menu" from the jump panel, and remove aria-haspopup="menu" from the pill at line 188. The enclosing nav with aria-label="Page sections" already carries the correct semantics.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Navbar.tsx` around lines 199 - 235, The
navigation disclosures use menu semantics with ordinary links and buttons;
remove those menu roles and triggers’ menu-haspopup attributes. In
frontend/src/components/landing-v5/Navbar.tsx lines 199-235, remove role="menu"
from the compact panel and remove aria-haspopup="menu" from its trigger while
retaining aria-expanded. In frontend/src/components/landing-v5/Closing.tsx lines
154-182, remove role="menu" from the jump panel and remove aria-haspopup="menu"
from the pill trigger; keep the enclosing navigation semantics and existing
expansion state.

frontend/src/app/(public)/page.tsx-115-116 (1)

115-116: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Clear the deferred openGal timers on unmount.

actions.openGal schedules actions.enterExplore / actions.openGal 260 ms later from onQuiz and onLearn. If the page unmounts before those timers fire, openGal runs after cleanup and writes document.body.style.overflow = 'hidden' after the landing cleanup reset that overflow. Keep the timer refs in useLanding so cleanup can call clearTimeout for them.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/page.tsx around lines 115 - 116, Update useLanding
and the onQuiz/onLearn handlers to store each 260 ms openGal timeout in refs,
rather than discarding the timer IDs. In the landing cleanup, clear both
deferred timers before resetting document.body overflow, preventing
actions.openGal from running after unmount.

frontend/src/components/landing-v5/ActTutor.tsx-93-109 (1)

93-109: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Expose the selected tutor mode, and keep the hidden pills out of the tab order.

Two gaps in this control group:

1. The pills are a mode selector, but the selected state is carried only by background and color. Assistive technology cannot report which mode is active. Add aria-pressed={tutorMode === i}.
2. The container starts at opacity: 0 with pointerEvents: 'none', and the engine fades it in later. The buttons stay focusable while invisible, so a keyboard user can focus a control that is not visible. Mirror the visual state in the tab order.

Also add type="button", which the other sections in this PR set consistently.

♻️ Proposed fix for the pill group

- {CAPTIONS.map(([tag], i) => (- <button- key={tag}- onClick={() => onSetMode(i)}+ {CAPTIONS.map(([tag], i) => (+ <button+ key={tag}+ type="button"+ aria-pressed={tutorMode === i}+ onClick={() => onSetMode(i)}

The engine already writes opacity on the container. Have it also clear visibility or the inert attribute so the pills leave the tab order until the handover:

- <div data-tutor-pills="1" style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>+ <div data-tutor-pills="1" inert style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActTutor.tsx` around lines 93 - 109,
Update the tutor pill group in ActTutor’s CAPTIONS map to add type="button" and
aria-pressed={tutorMode === i} to each button. Keep the hidden container’s
buttons out of the tab order while the engine-controlled opacity is zero by
mirroring its hidden state with inert or an equivalent visibility-based
mechanism, and ensure the existing handover clears that state when the pills
become visible.

frontend/src/components/landing-v5/ActGraph.tsx-333-340 (1)

333-340: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Add an Escape key exit for explore mode.

Explore mode covers the act and closes the navbar, but useLanding only handles Escape for gallery and jump controls. If explore mode is active, call onExitExplore from the key handler so keyboard-only users can leave the mode safely.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActGraph.tsx` around lines 333 - 340,
Update the existing keyboard handler in useLanding to detect Escape while
explore mode is active and call onExitExplore. Preserve the current Escape
behavior for gallery and jump controls, and ensure the explore-mode exit path is
available to keyboard-only users.

frontend/src/lib/landing/hero3d/index.ts-175-189 (1)

175-189: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Release the WebGL context in stop().

stop() already disposes three.js resources and cancels the render loop. WebGLRenderer.dispose() does not release the WebGL context, and this rig creates a new context on its canvas each mount. Add renderer.forceContextLoss() after renderer.dispose() so repeated navigation can reclaim the browser contexts sooner.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/hero3d/index.ts` around lines 175 - 189, Update the
returned stop() method to call renderer.forceContextLoss() immediately after
renderer.dispose(), ensuring the WebGL context is released during cleanup while
preserving the existing resource disposal and animation cancellation behavior.

🧹 Nitpick comments (14)

frontend/src/components/landing-v5/lab/LabShell.tsx (1)

51-84: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Segmented is unused; two demos duplicate it inline.

The comment states that the tutor and calendar demos use this control. They do not import it. CalendarDemo.tsx lines 61-76 and TutorDemo.tsx lines 65-80 each contain an inline copy of the same markup and style logic. Use Segmented in both demos, or delete it and correct the comment.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx` around lines 51 - 84,
Resolve the unused Segmented component by replacing the duplicated inline
segmented-control markup in CalendarDemo and TutorDemo with the shared Segmented
component, passing each demo’s options, current value, and change handler.
Preserve the existing labels, selection behavior, and styling, and keep the
component’s public API unchanged.

frontend/src/components/landing-v5/lab/QuizDemo.tsx (1)

33-35: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Difficulty badge changes while the same question is shown.

submit updates streak before it sets phase to review. qi does not change. The badge therefore flips from MEDIUM to HARD or EASY while the user still reads question 1 and its explanation. Derive the badge from the difficulty that applied when the question was served, for example from answers.length captured at question start.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 33 - 35,
Update the difficulty derivation in QuizDemo so the badge remains tied to the
difficulty assigned when the current question was served, rather than
recomputing from the mutable streak during review. Capture or derive the
question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.

frontend/src/components/landing-v5/lab/GradesDemo.tsx (1)

62-65: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Row percentage is unclamped while the weighted grade is clamped.

Line 25 clamps the score into [0, r.possible]. Line 64 uses the unclamped raw. If the user types 70 in a 50-point row, the row shows 140% while the category bar and the overall grade cap at 100%. Apply the same clamp in both places.

♻️ Proposed fix

 const raw = parseFloat(earned[i]);
- const pct = isNaN(raw) ? null : Math.round((raw / r.possible) * 100);+ const pct = isNaN(raw) ? null : Math.round((Math.max(0, Math.min(raw, r.possible)) / r.possible) * 100);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx` around lines 62 - 65,
Clamp the parsed score used in the row percentage calculation within the same
[0, r.possible] bounds already applied to the weighted grade. Update the
percentage logic in the GB_ROWS map callback, preserving the existing null
handling and color thresholds while ensuring values above or below the row
limits cannot produce percentages outside 0–100.

frontend/src/components/landing-v5/lab/labData.ts (1)

13-13: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Remove duplicated TIER from labData.ts.

labData.ts exports TIER, but the lab demos import LAB_TIER and render with labData.ts content. The four hex values and keys match LAB_TIER, so two copies of this swatch set can drift. Drop TIER from labData.ts and keep using LAB_TIER.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/labData.ts` at line 13, Remove the
exported TIER constant from labData.ts, since it duplicates the matching
LAB_TIER swatch set. Update any references in labData.ts to use LAB_TIER
instead, preserving the existing keys and color values.

frontend/src/lib/landing/engine/graph.ts (1)

122-127: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Replace the random-comparator shuffle with Fisher–Yates.

sort(() => Math.random() - 0.5) uses an inconsistent comparator. The resulting permutation is biased and depends on the engine's sort implementation, so many nodes keep positions close to their original index. That works against the documented intent of an organic reveal order.

♻️ Proposed fix

- // Shuffle the reveal order so the graph assembles organically.- const order = nodes.map((_, i) => i).sort(() => Math.random() - 0.5);+ // Shuffle the reveal order so the graph assembles organically.+ const order = nodes.map((_, i) => i);+ for (let i = order.length - 1; i > 0; i--) {+ const j = Math.floor(Math.random() * (i + 1));+ [order[i], order[j]] = [order[j], order[i]];+ }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/graph.ts` around lines 122 - 127, Replace the
random-comparator sort in the reveal-order logic with an unbiased Fisher–Yates
shuffle of the index array. Keep the existing spawnAt and colorAt calculations
and node ordering behavior after shuffling unchanged.

frontend/src/app/(public)/wiki/page.tsx (1)

31-39: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Make lede optional so the privacy section does not render an empty paragraph.

The privacy section passes lede="". Section always renders the <p>, so the page emits an empty paragraph with 0 0 20px margins. That adds dead space and an empty node in the accessibility tree.

♻️ Proposed fix

-function Section({ id, title, lede, children }: { id: string; title: string; lede: string; children?: React.ReactNode }) {+function Section({ id, title, lede, children }: { id: string; title: string; lede?: string; children?: React.ReactNode }) {
return (
<section style={{ marginTop: 56, scrollMarginTop: 110 }} id={id}>
<SectionHeading>{title}</SectionHeading>
- <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ {lede ? (+ <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ ) : null}
{children}

Then drop lede="" at line 147.

Also applies to: 147-149

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/wiki/page.tsx around lines 31 - 39, Make the lede
prop optional in Section and render the paragraph only when lede has content, so
the privacy section does not produce an empty element or spacing. Remove the
lede="" argument from the privacy Section usage while preserving existing lede
rendering for other sections.

frontend/src/lib/landing/engine/marquee.ts (1)

136-144: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick win

Avoid the per-frame layout read in update().

update() runs from the engine tick on every frame the gallery is on screen. Line 136 reads wrap.clientWidth on each of those frames, and line 156 writes track.style.transform. The write dirties style, so the next frame's read forces a style recalculation and layout. That contradicts the engine invariant documented in frontend/src/lib/landing/engine/index.ts lines 4-8, which states the tick never reads layout.

Observe the container width instead, and re-measure only when it changes.

♻️ Proposed approach

- // measure one card set only when the container width changed- if (!m.setW || m.measuredW !== wrap.clientWidth) {+ // measure one card set only when a ResizeObserver marked it stale+ if (!m.setW) {

Then in bind, mark the state stale from an observer and add its teardown to cleanups:

constro=newResizeObserver(()=>{m.setW=0;});if(wrap)ro.observe(wrap);cleanups.push(()=>ro.disconnect());

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/marquee.ts` around lines 136 - 144, Remove
the per-frame wrap.clientWidth read from update() and move width-change
detection to bind using a ResizeObserver on wrap. Have the observer mark m.setW
stale, register ro.disconnect in cleanups, and preserve the existing measurement
logic when update() sees stale state without reading layout every tick.

frontend/src/components/landing-v5/FeatureLab.tsx (1)

94-119: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Mark the active rail button for assistive technology.

on changes only the colors. Add aria-current="true" on the selected button so the active tool is conveyed without color.

♿ Proposed change

 data-rail={i}
type="button"
+ aria-current={on || undefined}
onClick={() => onPick(i)}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 94 - 119, Add
an aria-current="true" attribute to the selected rail button rendered in the
GAL.map callback, using the existing on condition so assistive technology
identifies the active tool without relying on color.

frontend/src/components/landing-v5/Gallery.tsx (1)

71-73: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

The wrapper duplicates the miniature's own container.

The <div> here sets height: 166, borderRadius: 13, overflow: hidden, the same background, and the same border. Every entry in GALLERY_MINIS opens with a <div> carrying that identical style set (see galleryMinis.tsx line 16). One of the two layers is redundant. Because the minis are generated, drop the wrapper here rather than editing the generated file.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 71 - 73, Remove
the redundant wrapper div around GALLERY_MINIS[i] in Gallery, rendering the
miniature directly while preserving its existing placement and aria-hidden
behavior. Do not modify the generated galleryMinis.tsx entries.

frontend/src/lib/landing/engine/flip.ts (1)

24-25: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

FlipState.ran is never read.

armFlip sets ran = false and flipClose resets it, but no code in this module or in frontend/src/components/landing/useLanding.ts reads it. The consumer tracks the same guard with its own flipRan ref (see useLanding.ts lines 158, 552, 574-575). Two guards for one invariant can drift. Either remove ran from FlipState or make flipOpen own the guard and delete flipRan from the hook.

Also applies to: 78-78

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/flip.ts` around lines 24 - 25, Remove the
unused FlipState.ran field and its assignments in armFlip and flipClose, since
useLanding already owns this guard through flipRan. Keep the existing
flipRan-based behavior unchanged and avoid maintaining duplicate state for the
same invariant.

frontend/src/lib/landing/engine/hero.ts (1)

99-136: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Points behind the camera reach the link pass with a degenerate scale.

sc = FL / (FL + z) is computed for every node. Rotation mixes ox into z, and ox reaches about ±740 while oz reaches about ±340, so z can pass -1000. At z === -FL the divide produces Infinity, and below -FL it produces a negative scale.

The point pass guards this at line 139 with p.z > -FL. The link pass at lines 116-136 does not. A node with Infinity scale gives reach === Infinity, so the break at line 122 never fires for that row and the inner loop degrades to a full scan.

Filter the projection once, so both passes share the guard.

♻️ Proposed change

 const proj = nodes
.map((n) => {
...
})
+ // drop anything at or behind the projection plane: `sc` is not finite+ // there, which breaks both the link reach and the point radius+ .filter((p) => p.z > -FL)
.sort((a, b) => b.z - a.z);

The p.z > -FL test at line 139 then becomes redundant and can go.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/hero.ts` around lines 99 - 136, Filter the
projected nodes immediately after the `proj` mapping so only entries with `p.z >
-FL` remain before sorting and running the link pass. Reuse this filtered
collection for both link rendering and the later point-rendering pass, then
remove the now-redundant `p.z > -FL` guard in the point pass.

frontend/src/components/landing/useLanding.ts (1)

378-392: 🚀 Performance & Scalability | 🔵 Trivial | 💤 Low value

The reveal scan polls every 900ms for the page lifetime.

scan() re-queries [data-reveal] across the whole landing root twice per second, forever, to catch elements that mount later. A MutationObserver on root would react to the same additions without the standing timer. This is a nice-to-have; the current cost is one querySelectorAll per tick.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 378 - 392,
Replace the lifetime polling interval in the reveal setup around scan with a
MutationObserver watching root for added elements, invoking scan when matching
content mounts later. Keep the initial scan, existing seen/io behavior, and
cleanup, but disconnect the mutation observer instead of clearing an interval.

frontend/src/lib/landing/engine/sim.ts (1)

282-299: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

up ignores pointerId, and the window listeners are registered once per cluster.

Two small points in bindDrag:

• up does not compare e.pointerId with f.drag.id. A second pointer that lifts cancels the active drag. onMove does compare the id, so the handlers are inconsistent.
• onMove and up are added to window inside the per-cluster loop. With N clusters in one group, every window pointer event runs N identical handlers. Bind the window listeners once per group instead.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 282 - 299, Update
bindDrag so up ignores pointer events whose pointerId does not match f.drag.id,
matching onMove’s active-pointer validation. Move the window-level pointermove,
pointerup, and pointercancel listener registration out of the per-cluster
binding loop and register each once per group, while keeping the per-SVG
listeners on the individual cluster SVG.

frontend/src/components/landing-v5/Closing.tsx (1)

75-92: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Share the companion-page list, and make the footer icon decorative.

Two points:

1. FOOTER_LINKS repeats PAGES in Navbar.tsx (lines 26-33) with the same six label and href pairs. Both files are new in this PR, so the two lists will drift the first time a companion page is added or renamed. Export one list and import it in both places.
2. Line 91 sets alt="Sapling" on the icon, and the adjacent text already reads "Sapling · © 2026". A screen reader announces the name twice. Navbar.tsx line 100 already uses alt="" for the same icon beside the same wordmark.

♻️ Proposed fix

- <Image src="/sapling-icon.svg" alt="Sapling" width={20} height={20} />+ <Image src="/sapling-icon.svg" alt="" width={20} height={20} />

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Closing.tsx` around lines 75 - 92, Share
the companion-page link list currently duplicated as FOOTER_LINKS in SiteFooter
and PAGES in Navbar by exporting one canonical list and importing it in both
components, preserving all six label/href pairs. Update the footer Image in
SiteFooter to use an empty alt value so the adjacent Sapling text is announced
only once.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/app/globals.css`:
- Around line 1957-2005: Rename the camelCase keyframe declarations in the
affected stylesheet to kebab-case, including symbols such as s1Stem,
saplingBlob, introOrbit, popHold, and the additional reported ranges. Update
every corresponding animation and animation-name reference to the new kebab-case
identifiers, preserving all animation behavior.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 41-50: Update the modal container identified by panelRef in
FeatureLab to add role="dialog", aria-modal="true", and an accessible name. On
mount, move focus into the panel; while open, trap Tab navigation within it so
focus cannot reach the page behind the overlay. Capture and restore focus to the
triggering element stored in FlipState.el when the panel closes, while
preserving the existing Escape close behavior.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 62-85: Update Card so non-ghost cards are keyboard-focusable and
activatable, using the existing track click-delegation contract, while ghost
duplicates remain excluded from the tab order and accessibility tree. Add the
corresponding keyboard activation handling to the card or track using the
existing feature-lab target behavior, and correct the nearby doc comment to
match the implemented accessibility behavior. Add a visible
.ld-galcard:focus-visible style in globals.css.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 37-44: Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout
in the rate handler is stored in a useRef, cleared before scheduling each new
rating and during unmount, and remove the ineffective returned cleanup. Update
NotesDemo.tsx at lines 57-80 so the 700 ms extract and summarize timeouts use
refs and are cleared in the existing unmount effect alongside saveT.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx`:
- Around line 21-24: Update the RECENT entries’ pick values to exactly match an
existing exam option in the corresponding GUIDES course fixture, preserving
openRecent’s assignment and keeping the select value consistent with the guide
heading.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 104-124: Fix the quiz option accessibility semantics in the
q.options mapping: either make each button a radio with role="radio" and
aria-checked bound to isPicked while retaining the radiogroup, or remove the
radiogroup role and expose isPicked through aria-pressed. Preserve the existing
selection and reviewing behavior in the option onClick handler.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 213-224: Update the hero canvas useEffect around startHeroCanvas
to track a cancelled/unmounted flag. Set it during cleanup, check it after the
asynchronous hero module import resolves before starting the canvas, and stop
the returned controller when appropriate so no animation loop or resize listener
remains after unmount.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 423-430: Update the initialization and destroy flow around
ensureInit and destroy to retain each cluster element’s original parent before
moving it into the overlay. During destroy, restore every cluster to that
parent, clear the inline styles applied by ensureInit, then remove the overlay
and reset state so a later ensureInit can rebuild the field without disrupting
React-owned nodes.
---
Minor comments:
In `@frontend/src/app/`(public)/page.tsx:
- Around line 115-116: Update useLanding and the onQuiz/onLearn handlers to
store each 260 ms openGal timeout in refs, rather than discarding the timer IDs.
In the landing cleanup, clear both deferred timers before resetting
document.body overflow, preventing actions.openGal from running after unmount.
In `@frontend/src/components/landing-v5/ActGraph.tsx`:
- Around line 333-340: Update the existing keyboard handler in useLanding to
detect Escape while explore mode is active and call onExitExplore. Preserve the
current Escape behavior for gallery and jump controls, and ensure the
explore-mode exit path is available to keyboard-only users.
In `@frontend/src/components/landing-v5/ActTutor.tsx`:
- Around line 93-109: Update the tutor pill group in ActTutor’s CAPTIONS map to
add type="button" and aria-pressed={tutorMode === i} to each button. Keep the
hidden container’s buttons out of the tab order while the engine-controlled
opacity is zero by mirroring its hidden state with inert or an equivalent
visibility-based mechanism, and ensure the existing handover clears that state
when the pills become visible.
In `@frontend/src/components/landing-v5/Faq.tsx`:
- Around line 66-71: Update the “Read the full FAQ” anchor in the FAQ component
to navigate to the newly added /faq route instead of the local `#faq` section,
preserving its existing styling and text.
- Around line 79-116: Update the FAQ accordion around the toggle button and
answer panel to give each panel a stable unique id, reference it from the button
via aria-controls, and set aria-hidden based on the open state so closed answers
are excluded from the accessibility tree. Preserve the existing visual
transition and aria-expanded behavior.
In `@frontend/src/components/landing-v5/Journal.tsx`:
- Around line 96-101: Update the post card anchor in the Journal component to
navigate to the new /news route instead of the containing `#newsletter` section,
while preserving the existing card styling and behavior.
- Around line 184-199: Update the Journal email input in the landing component
to use type="email" and preserve the existing onSubscribe flow only as an
explicit stub, or wire onSubscribe to the newsletter endpoint and show the
subscribed state only after a successful submission. Locate the handler through
actions.subscribe/useLanding and ensure invalid emails cannot enter the success
state.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 46-53: Update the keydown handler in the useEffect to detect when
the event target is an interactive element, such as a button or link, and skip
both flip() and preventDefault() for those targets. Preserve the existing global
space-to-flip and rate-key behavior for non-interactive targets.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx`:
- Around line 57-80: Update the extract and summarize timeout flows to store
their setTimeout handles in dedicated refs, and clear both refs in the existing
unmount effect alongside saveT. Ensure the callbacks still perform their current
state updates when they complete, while preventing them from running after the
component unmounts.
- Line 63: Update the concept-loading logic around the setConcepts call to keep
concepts empty when found has no matches instead of inserting a “No concepts
found” sentinel; track the empty-result state separately and use it for the
empty-state display while ensuring the footer count reflects only actual linked
concepts.
In `@frontend/src/components/landing-v5/Navbar.tsx`:
- Around line 199-235: The navigation disclosures use menu semantics with
ordinary links and buttons; remove those menu roles and triggers’ menu-haspopup
attributes. In frontend/src/components/landing-v5/Navbar.tsx lines 199-235,
remove role="menu" from the compact panel and remove aria-haspopup="menu" from
its trigger while retaining aria-expanded. In
frontend/src/components/landing-v5/Closing.tsx lines 154-182, remove role="menu"
from the jump panel and remove aria-haspopup="menu" from the pill trigger; keep
the enclosing navigation semantics and existing expansion state.
In `@frontend/src/lib/landing/engine/dom.ts`:
- Around line 49-73: Update cv so zero-sized measurements are not stored in the
CanvasCache: when clientWidth or clientHeight is zero, avoid assigning the newly
measured cache to rec.__cv while preserving the current context and sizing
behavior. Ensure subsequent calls re-read dimensions until both measurements are
nonzero, while retaining normal caching for valid sizes.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 184-203: Prevent incorrect label binding in sim.ts by verifying
ring.nextElementSibling is a text element before assigning it, type
SimNode.label as SVGTextElement | null, and skip label position updates when it
is null; update DragField.tsx to always render a text element per node so the
expected glow, ring, label order is maintained.
In `@frontend/src/lib/landing/hero3d/index.ts`:
- Around line 175-189: Update the returned stop() method to call
renderer.forceContextLoss() immediately after renderer.dispose(), ensuring the
WebGL context is released during cleanup while preserving the existing resource
disposal and animation cancellation behavior.
---
Nitpick comments:
In `@frontend/src/app/`(public)/wiki/page.tsx:
- Around line 31-39: Make the lede prop optional in Section and render the
paragraph only when lede has content, so the privacy section does not produce an
empty element or spacing. Remove the lede="" argument from the privacy Section
usage while preserving existing lede rendering for other sections.
In `@frontend/src/components/landing-v5/Closing.tsx`:
- Around line 75-92: Share the companion-page link list currently duplicated as
FOOTER_LINKS in SiteFooter and PAGES in Navbar by exporting one canonical list
and importing it in both components, preserving all six label/href pairs. Update
the footer Image in SiteFooter to use an empty alt value so the adjacent Sapling
text is announced only once.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 94-119: Add an aria-current="true" attribute to the selected rail
button rendered in the GAL.map callback, using the existing on condition so
assistive technology identifies the active tool without relying on color.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 71-73: Remove the redundant wrapper div around GALLERY_MINIS[i] in
Gallery, rendering the miniature directly while preserving its existing
placement and aria-hidden behavior. Do not modify the generated galleryMinis.tsx
entries.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx`:
- Around line 62-65: Clamp the parsed score used in the row percentage
calculation within the same [0, r.possible] bounds already applied to the
weighted grade. Update the percentage logic in the GB_ROWS map callback,
preserving the existing null handling and color thresholds while ensuring values
above or below the row limits cannot produce percentages outside 0–100.
In `@frontend/src/components/landing-v5/lab/labData.ts`:
- Line 13: Remove the exported TIER constant from labData.ts, since it
duplicates the matching LAB_TIER swatch set. Update any references in labData.ts
to use LAB_TIER instead, preserving the existing keys and color values.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx`:
- Around line 51-84: Resolve the unused Segmented component by replacing the
duplicated inline segmented-control markup in CalendarDemo and TutorDemo with
the shared Segmented component, passing each demo’s options, current value, and
change handler. Preserve the existing labels, selection behavior, and styling,
and keep the component’s public API unchanged.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 33-35: Update the difficulty derivation in QuizDemo so the badge
remains tied to the difficulty assigned when the current question was served,
rather than recomputing from the mutable streak during review. Capture or derive
the question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 378-392: Replace the lifetime polling interval in the reveal setup
around scan with a MutationObserver watching root for added elements, invoking
scan when matching content mounts later. Keep the initial scan, existing seen/io
behavior, and cleanup, but disconnect the mutation observer instead of clearing
an interval.
In `@frontend/src/lib/landing/engine/flip.ts`:
- Around line 24-25: Remove the unused FlipState.ran field and its assignments
in armFlip and flipClose, since useLanding already owns this guard through
flipRan. Keep the existing flipRan-based behavior unchanged and avoid
maintaining duplicate state for the same invariant.
In `@frontend/src/lib/landing/engine/graph.ts`:
- Around line 122-127: Replace the random-comparator sort in the reveal-order
logic with an unbiased Fisher–Yates shuffle of the index array. Keep the
existing spawnAt and colorAt calculations and node ordering behavior after
shuffling unchanged.
In `@frontend/src/lib/landing/engine/hero.ts`:
- Around line 99-136: Filter the projected nodes immediately after the `proj`
mapping so only entries with `p.z > -FL` remain before sorting and running the
link pass. Reuse this filtered collection for both link rendering and the later
point-rendering pass, then remove the now-redundant `p.z > -FL` guard in the
point pass.
In `@frontend/src/lib/landing/engine/marquee.ts`:
- Around line 136-144: Remove the per-frame wrap.clientWidth read from update()
and move width-change detection to bind using a ResizeObserver on wrap. Have the
observer mark m.setW stale, register ro.disconnect in cleanups, and preserve the
existing measurement logic when update() sees stale state without reading layout
every tick.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 282-299: Update bindDrag so up ignores pointer events whose
pointerId does not match f.drag.id, matching onMove’s active-pointer validation.
Move the window-level pointermove, pointerup, and pointercancel listener
registration out of the per-cluster binding loop and register each once per
group, while keeping the per-SVG listeners on the individual cluster SVG.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 865084a7-2f4d-472c-accd-6f67530e2a35

📥 Commits

Reviewing files that changed from the base of the PR and between ec34bf1 and 741ec10.

⛔ Files ignored due to path filters (3)

• frontend/public/journal-ai-homework.png is excluded by !**/*.png
• frontend/public/journal-founding.png is excluded by !**/*.png
• frontend/public/kofi-symbol.png is excluded by !**/*.png

📒 Files selected for processing (75)

• frontend/e2e/landing-graph.spec.ts
• frontend/e2e/public-seo.spec.ts
• frontend/eslint-suppressions.json
• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/companion/primitives.tsx
• frontend/src/components/landing-v5/ActGraph.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/ActTutor.tsx
• frontend/src/components/landing-v5/Closing.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/Faq.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/components/landing-v5/Gallery.tsx
• frontend/src/components/landing-v5/Hero.tsx
• frontend/src/components/landing-v5/IntroOverlay.tsx
• frontend/src/components/landing-v5/Journal.tsx
• frontend/src/components/landing-v5/Navbar.tsx
• frontend/src/components/landing-v5/galleryMinis.tsx
• frontend/src/components/landing-v5/lab/CalendarDemo.tsx
• frontend/src/components/landing-v5/lab/CardsDemo.tsx
• frontend/src/components/landing-v5/lab/GradesDemo.tsx
• frontend/src/components/landing-v5/lab/GuideDemo.tsx
• frontend/src/components/landing-v5/lab/LabShell.tsx
• frontend/src/components/landing-v5/lab/NotesDemo.tsx
• frontend/src/components/landing-v5/lab/QuizDemo.tsx
• frontend/src/components/landing-v5/lab/RoomsDemo.tsx
• frontend/src/components/landing-v5/lab/TutorDemo.tsx
• frontend/src/components/landing-v5/lab/index.tsx
• frontend/src/components/landing-v5/lab/labData.ts
• frontend/src/components/landing-v5/navTheme.ts
• frontend/src/components/landing/useLanding.ts
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx
• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/lib/landing/color.ts
• frontend/src/lib/landing/companionContent.ts
• frontend/src/lib/landing/content.ts
• frontend/src/lib/landing/course.ts
• frontend/src/lib/landing/dragClusters.ts
• frontend/src/lib/landing/engine/ambient.ts
• frontend/src/lib/landing/engine/dom.ts
• frontend/src/lib/landing/engine/flip.ts
• frontend/src/lib/landing/engine/graph.ts
• frontend/src/lib/landing/engine/graphView.ts
• frontend/src/lib/landing/engine/hero.ts
• frontend/src/lib/landing/engine/index.ts
• frontend/src/lib/landing/engine/marquee.ts
• frontend/src/lib/landing/engine/measure.ts
• frontend/src/lib/landing/engine/plant.ts
• frontend/src/lib/landing/engine/sim.ts
• frontend/src/lib/landing/hero3d/cardTexture.ts
• frontend/src/lib/landing/hero3d/index.ts

💤 Files with no reviewable changes (20)

• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/e2e/landing-graph.spec.ts
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

Use kebab-case keyframe names.

Stylelint reports every new camelCase keyframe identifier against keyframes-name-pattern. This leaves lint errors in the changed stylesheet. Rename the declarations to kebab case and update every matching animation or animation-name reference in the same change.

Also applies to: 2031-2033, 2082-2082, 2094-2096

🧰 Tools

🪛 Stylelint (17.14.0)

[error] 1957-1957: Expected keyframe name "s1Stem" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1958-1958: Expected keyframe name "s1LeafLo" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1964-1964: Expected keyframe name "s1LeafHi" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1970-1970: Expected keyframe name "s1Bud" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1971-1971: Expected keyframe name "s1Word" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1972-1972: Expected keyframe name "s1Rule" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1975-1975: Expected keyframe name "saplingBlob" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1976-1976: Expected keyframe name "introOrbit" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1977-1977: Expected keyframe name "floatIndicator" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1978-1978: Expected keyframe name "betaGlow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1979-1979: Expected keyframe name "nodeFloatA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1980-1980: Expected keyframe name "nodeFloatB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1983-1983: Expected keyframe name "popHold" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1984-1984: Expected keyframe name "chipSwapA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1985-1985: Expected keyframe name "chipSwapB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1986-1986: Expected keyframe name "flipLoop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1987-1987: Expected keyframe name "lineReveal" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1988-1988: Expected keyframe name "underSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1989-1989: Expected keyframe name "barGrow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1990-1990: Expected keyframe name "coverRise" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1991-1991: Expected keyframe name "ringDraw" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1992-1992: Expected keyframe name "gaugeFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1993-1993: Expected keyframe name "answerTick" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1994-1994: Expected keyframe name "waveBar" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1995-1995: Expected keyframe name "gaugeMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1996-1996: Expected keyframe name "coverMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1997-1997: Expected keyframe name "cursorMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1998-1998: Expected keyframe name "cardFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1999-1999: Expected keyframe name "scanSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2000-2000: Expected keyframe name "ocrBlink" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2001-2001: Expected keyframe name "panelFade" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2002-2002: Expected keyframe name "fillX" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2003-2003: Expected keyframe name "typingDot" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2004-2004: Expected keyframe name "ringPop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2005-2005: Expected keyframe name "cursorDrift" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/globals.css` around lines 1957 - 2005, Rename the camelCase
keyframe declarations in the affected stylesheet to kebab-case, including
symbols such as s1Stem, saplingBlob, introOrbit, popHold, and the additional
reported ranges. Update every corresponding animation and animation-name
reference to the new kebab-case identifiers, preserving all animation behavior.

Source: Linters/SAST tools

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

The overlay is a modal without dialog semantics or focus management.

The panel covers the viewport at zIndex: 80 and the caller locks body scroll. Three parts are missing:

• No role="dialog" and no aria-modal="true", so assistive technology does not announce a modal context.
• No accessible name on the container.
• No focus management. Focus stays on the gallery card behind the overlay, tabbing walks the page underneath, and closing does not return focus to the card that opened the panel.

Escape already closes the panel through useLanding.ts lines 272-276, so only the semantics and focus handling remain.

♿ Proposed direction

- <div style={{ position: 'fixed', inset: 0, zIndex: 80 }}>+ <div+ role="dialog"+ aria-modal="true"+ aria-label={`${g.kicker} demo`}+ style={{ position: 'fixed', inset: 0, zIndex: 80 }}+ >

Then move focus into the panel when it mounts, keep Tab inside it while it is open, and restore focus to the element captured by armFlip when it closes. frontend/src/lib/landing/engine/flip.ts already holds that element in FlipState.el.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 41 - 50,
Update the modal container identified by panelRef in FeatureLab to add
role="dialog", aria-modal="true", and an accessible name. On mount, move focus
into the panel; while open, trap Tab navigation within it so focus cannot reach
the page behind the overlay. Capture and restore focus to the triggering element
stored in FlipState.el when the panel closes, while preserving the existing
Escape close behavior.

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win

The gallery cards cannot be opened with a keyboard.

Opening the feature lab depends on the onClick delegation on the track div at lines 99-102. Card renders an <article> with no tabIndex, no role, and no key handler, and the track div has no key handler either. A keyboard user cannot reach or activate any card, so the feature lab is unreachable without a pointer. The doc comment at lines 14-15 states that the first copy is reachable by keyboard, which does not match the markup.

Make each non-ghost card an activatable control, keep the duplicate copies out of the tab order, and then correct the doc comment.

♿ Proposed fix

-function Card({ i, ghost }: { i: number; ghost: boolean }) {+function Card({ i, ghost, onOpen }: { i: number; ghost: boolean; onOpen: (i: number, el: HTMLElement | null) => void }) {
const c = CARDS[i];
return (
<article
data-tk={i}
aria-hidden={ghost || undefined}
+ role="button"+ tabIndex={ghost ? -1 : 0}+ aria-label={`Open ${c.kicker}`}+ onKeyDown={(e) => {+ if (e.key !== 'Enter' && e.key !== ' ') return;+ e.preventDefault();+ onOpen(i, e.currentTarget);+ }}
style={CARD}
className="ld-galcard"
>

- {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} />)}- {order.map((i) => <Card key={`b${i}`} i={i} ghost />)}+ {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} onOpen={onOpen} />)}+ {order.map((i) => <Card key={`b${i}`} i={i} ghost onOpen={onOpen} />)}

Add a visible focus style for .ld-galcard:focus-visible in globals.css.

Also applies to: 96-107

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 62 - 85, Update
Card so non-ghost cards are keyboard-focusable and activatable, using the
existing track click-delegation contract, while ghost duplicates remain excluded
from the tab order and accessibility tree. Add the corresponding keyboard
activation handling to the card or track using the existing feature-lab target
behavior, and correct the nearby doc comment to match the implemented
accessibility behavior. Add a visible .ld-galcard:focus-visible style in
globals.css.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

Handler timeouts are created without a ref, so they are never cancelled. Both demos schedule a state update from an event handler without storing the handle. The timeout cannot be cleared on unmount, and a second click cannot cancel a pending one. The other demos in this layer already hold each handle in a useRef and clear it in an unmount effect.

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44: store the 300 ms advance timeout in a ref, clear it before each new rating, and clear it on unmount; delete the returned cleanup, which React never calls.
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80: store the 700 ms extract and summarize timeouts in refs and clear them in the existing unmount effect beside saveT.

📍 Affects 2 files

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44 (this comment)
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 37 - 44,
Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout in the rate handler is
stored in a useRef, cleared before scheduling each new rating and during
unmount, and remove the ineffective returned cleanup. Update NotesDemo.tsx at
lines 57-80 so the 700 ms extract and summarize timeouts use refs and are
cleared in the existing unmount effect alongside saveT.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

RECENT[].pick values are not options of the exam select.

openRecent at line 53 sets exam to r.pick. 'Midterm 1 · Sep 30' is not in GUIDES['MA 242'].exams, and 'Quiz 2 · Oct 03' is not in GUIDES['CS 201'].exams. The controlled select at line 76 then falls back to displaying its first option while the guide heading at line 104 prints exam. The control and the heading disagree, and the user cannot select the displayed exam again.

Use an exam that exists in the course fixture, or add the recent exam to the option list when it is selected.

🔧 Proposed fix using existing fixture values

 const RECENT = [
- { i: 0, exam: 'MA 242 · Midterm 1', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Midterm 1 · Sep 30' },- { i: 1, exam: 'CS 201 · Quiz 2', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Quiz 2 · Oct 03' },+ { i: 0, exam: 'MA 242 · Final', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Final · Dec 12' },+ { i: 1, exam: 'CS 201 · Midterm 1', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Midterm 1 · Oct 17' },
];

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	constRECENT=[
	{i: 0,exam: 'MA 242 · Midterm 1',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Midterm 1 · Sep 30'},
	{i: 1,exam: 'CS 201 · Quiz 2',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Quiz 2 · Oct 03'},
	];
	constRECENT=[
	{i: 0,exam: 'MA 242 · Final',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Final · Dec 12'},
	{i: 1,exam: 'CS 201 · Midterm 1',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Midterm 1 · Oct 17'},
	];

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx` around lines 21 - 24,
Update the RECENT entries’ pick values to exactly match an existing exam option
in the corresponding GUIDES course fixture, preserving openRecent’s assignment
and keeping the select value consistent with the guide heading.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

role="radiogroup" has no radio children.

The container declares role="radiogroup", but each option is a plain <button>. A radiogroup requires children with role="radio" and aria-checked. Assistive technology cannot report which option is selected. Add the roles and state, or drop role="radiogroup" and expose selection with aria-pressed.

♿ Proposed fix

 <button
key={o.label}
type="button"
+ role="radio"+ aria-checked={isPicked}+ aria-disabled={reviewing}
onClick={() => { if (!reviewing) setPicked(o.label); }}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='#E3E0D5',bg='#FDFCF9',fg='#33443B',mark='',markCol='';
	if(reviewing&&correct){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';mark='CORRECT';markCol='#0C5638';}
	elseif(reviewing&&isPicked){bd='#b25855';bg='rgba(178,88,85,0.09)';fg='#9c4b48';mark='YOUR PICK';markCol='#9c4b48';}
	elseif(isPicked){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';}
	return(
	<button
	key={o.label}
	type="button"
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '#0E9E5A' : '#9AA5A0'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}
	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='`#E3E0D5`',bg='`#FDFCF9`',fg='`#33443B`',mark='',markCol='';
	if(reviewing&&correct){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';mark='CORRECT';markCol='`#0C5638`';}
	elseif(reviewing&&isPicked){bd='`#b25855`';bg='rgba(178,88,85,0.09)';fg='`#9c4b48`';mark='YOUR PICK';markCol='`#9c4b48`';}
	elseif(isPicked){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';}
	return(
	<button
	key={o.label}
	type="button"
	role="radio"
	aria-checked={isPicked}
	aria-disabled={reviewing}
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '`#0E9E5A`' : '`#9AA5A0`'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 104 - 124,
Fix the quiz option accessibility semantics in the q.options mapping: either
make each button a radio with role="radio" and aria-checked bound to isPicked
while retaining the radiogroup, or remove the radiogroup role and expose
isPicked through aria-pressed. Preserve the existing selection and reviewing
behavior in the option onClick handler.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

The hero canvas effect can start a loop that is never stopped.

import('@/lib/landing/engine/hero') resolves asynchronously. If the component unmounts before the promise resolves, the cleanup at line 222 runs while stopped is still null. The then callback then calls startHeroCanvas, which installs a requestAnimationFrame loop and a resize listener (see frontend/src/lib/landing/engine/hero.ts lines 83-87). Nothing cancels them afterwards, so the loop keeps drawing after navigation away from the landing page.

The WebGL effect at lines 227-244 already uses a cancelled flag. Apply the same pattern here.

🛠️ Proposed fix

 let stopped: { stop(): void } | null = null;
+ let cancelled = false;
// imported lazily so the module isn't pulled into the server bundle
import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas }) => {
+ if (cancelled) return;
stopped = startHeroCanvas(canvas, () => engine.mouse, () => engine.parallaxY);
});
- return () => stopped?.stop();+ return () => {+ cancelled = true;+ stopped?.stop();+ };

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	// imported lazily so the module isn't pulled into the server bundle
	import('@/lib/landing/engine/hero').then(({ startHeroCanvas })=>{
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>stopped?.stop();
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);
	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	letcancelled=false;
	// imported lazily so the module isn't pulled into the server bundle
	import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas })=>{
	if(cancelled)return;
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>{
	cancelled=true;
	stopped?.stop();
	};
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 213 - 224, Update
the hero canvas useEffect around startHeroCanvas to track a cancelled/unmounted
flag. Set it during cleanup, check it after the asynchronous hero module import
resolves before starting the canvas, and stop the returned controller when
appropriate so no animation loop or resize listener remains after unmount.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | 🏗️ Heavy lift

destroy() discards the re-homed clusters, so the field cannot be rebuilt.

ensureInit moves every cluster element out of its .drag-field and into the overlay (line 172), and it mutates the cluster's inline styles (lines 165-171). destroy() removes the shell through the queued cleanup, which deletes those cluster elements from the document. It does not put them back.

Two consequences:

1. A second ensureInit on the same DOM finds .drag-field elements with no [data-dragnode] children, returns false at line 232, and the field stays empty forever. This happens on any stop/start cycle, including the React StrictMode double-invoke of the engine effect in frontend/src/components/landing/useLanding.ts lines 162-210.
2. React still owns those cluster nodes, because DragField rendered them. React records the original parent for each child. Removing or reparenting the nodes outside React can make the later unmount removal fail.

Restore each cluster to its original parent and clear the inline styles that ensureInit set.

🛠️ Proposed fix: remember the original parent and restore it on destroy

 interface ClusterAnchor {
el: HTMLElement;
field: HTMLElement;
+ /** Where the cluster lived before it was re-homed into the overlay. */+ home: Node | null;+ before: Node | null;
/** The pinned act this field belongs to, if any — drives the scroll drift. */
sect: HTMLElement | null;
left: number;
top: number;
}

 anchors.push({
el: cl, field, sect,
+ home: cl.parentNode,+ before: cl.nextSibling,
left: b.left - fb.left,
top: b.top - fb.top,
});

 function destroy(): void {
+ // put the clusters back before the overlay goes away, otherwise React+ // still owns nodes that no longer exist and a later ensureInit finds+ // empty fields+ for (const a of anchors) {+ a.el.style.cssText = '';+ if (a.home) a.home.insertBefore(a.el, a.before);+ }
cleanups.forEach((fn) => fn());
cleanups.length = 0;
anchors.length = 0;
groups = null;
- if (overlay && overlay.parentElement) overlay.parentElement.removeChild(overlay);
overlay = null;
}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 423 - 430, Update the
initialization and destroy flow around ensureInit and destroy to retain each
cluster element’s original parent before moving it into the overlay. During
destroy, restore every cluster to that parent, clear the inline styles applied
by ensureInit, then remove the overlay and reset state so a later ensureInit can
rebuild the field without disrupting React-owned nodes.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/landing-v5/BetaModal.tsx`:
- Around line 52-70: Update the subscribed confirmation branch in BetaModal so
the rendered Close button receives focus after the form is replaced. Add a ref
to that button and focus it after the subscribed state commits, using the
component’s existing lifecycle pattern; preserve the current onClose behavior
and button styling.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ee1ca146-7600-423b-98c7-56bcec09e4e1

📥 Commits

Reviewing files that changed from the base of the PR and between 741ec10 and e506827.

📒 Files selected for processing (13)

• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/BetaModal.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/lib/landing/content.ts

💤 Files with no reviewable changes (2)

• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx

🚧 Files skipped from review as they are similar to previous changes (5)

• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/lib/landing/content.ts

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

Restore modal focus after the subscribed state replaces the form.

When subscribed becomes true, this branch unmounts the focused email input while Dialog remains open. Dialog only applies its initial focus when open changes. Focus can then leave the dialog and bypass its Tab trap. Move focus to the Close button after the confirmation state renders.

Proposed fix

-import { useId, useRef } from 'react';+import { useEffect, useId, useRef } from 'react';
...
const inputRef = useRef<HTMLInputElement>(null);
+ const confirmationCloseRef = useRef<HTMLButtonElement>(null);
const headingId = useId();
const valid = email.includes('@');
++ useEffect(() => {+ if (open && subscribed) confirmationCloseRef.current?.focus();+ }, [open, subscribed]);
...
<button
+ ref={confirmationCloseRef}
onClick={onClose}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '#12201A',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '#0C5638'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '#61726A',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '#0C5638',color: '#fff',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>
	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '`#12201A`',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '`#0C5638`'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '`#61726A`',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	ref={confirmationCloseRef}
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '`#0C5638`',color: '`#fff`',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/BetaModal.tsx` around lines 52 - 70,
Update the subscribed confirmation branch in BetaModal so the rendered Close
button receives focus after the form is replaced. Add a ref to that button and
focus it after the subscribed state commits, using the component’s existing
lifecycle pattern; preserve the current onClose behavior and button styling.

[Darkest-Teddy]

Ports Sapling Landing v5.dc.html (from docs/frontend-audit/Sapling landing page import (1).zip) into the Next.js frontend. v5 is now the landing page at /, replacing the previous marketing landing.

Supersedes #523. Based on feat/landing-v4-port, so its four commits ride along — v5 reuses that branch's scroll engine, course-graph model and editorial content. If v5 is the direction, #523 can be closed unmerged.

The title screen is a ground-up rebuild

Not a v4 tweak. Reading the source rather than the summary that accompanied the task turned up six divergences:

	Assumed	Actual v5 source
Wordmark	Archivo 800, ink #12201A	Playfair Display 600, #0C5638
Reveal	heroWipe clip-path	character scramble — heroWipe is defined, never referenced
Eyebrow	mono "GROW YOUR KNOWLEDGE"	Playfair "Grow Your Knowledge", title case, scrambled
Cascade	—	tagline leads (760ms), wordmark follows 260ms behind — v4 ran the reverse
Right bloom	mirrored green	teal rgba(43,140,150,0.2)
Panel rig	CSS perspective cards	three.js WebGL scene

Act III is likewise not the clipped 918×348 card track described in the brief — the source has a rotating triangular-prism carousel.

The v4 title screen was deleted rather than kept alongside. three/@types/three were already dependencies.

Four dead branches in the source

The design component carries a lot of machinery its own markup never reaches. Documented at each site:

1. const wantDark = false — the navbar's full two-theme colour table is built, then pinned to light. Wired live here, driven off the section under the viewport centre, as the brief calls for.
2. heroWipe / heroChar keyframes — defined, unreferenced. Not ported.
3. setHero0/1/2 + mode pills — exist only in renderVals(), so heroMode is pinned at 0 and only the panel scene can ever be seen. The constellation and growth-field shaders are unreachable; porting them would be porting dead code.
4. "Plant a concept" — plantVal, plantedCount, _plant(), a localStorage-backed grove and a canvas ref, none of it referenced. The CTA is heading + line + button.

Two engine bugs fixed

Both pre-existing in the v4 port, both invisible until a section actually had drag clusters:

• sim.ts reads a ring's halo via previousElementSibling and its caption via nextElementSibling; a <g> wrapper broke the adjacency and it threw on a null label.
• Clusters were anchored once, in page coordinates. The source captures each cluster's offset within its field, parks the overlay in a position:fixed shell, and re-applies anchor + field.rect every frame — which is what lets a cluster track its sticky section, and where the ≤150px drift inside a pinned act comes from.

Verified against the original served side by side: at 45% through act-tutor the source puts its 7 rings on screen at y≈121–608. This port now matches; before the fix it was 0 of 7, parked 8752px down.

Generated, not retyped

• galleryMinis.tsx — the 8 card miniatures, mechanically converted from the source's <article data-tk> blocks. Dense decorative animation where exact geometry and per-element delays are the effect. Regenerate rather than hand-edit.
• dragClusters.ts — the 8 course clusters, ~2KB of inline SVG each in the source, reduced to data + one component.
• companionContent.ts — 18 copy arrays lifted verbatim from the sibling pages.

Also in this PR

• The old marketing landing is retired. Deleting / orphaned marketing/graph/ (~95KB of passing tests for a surface no route mounts), marketing/surfaces/, FeatureBand, SurfaceBento, featureBands. HeroCard/SignInModal stay — the nav's Sign In opens the real OAuth modal.
• e2e/landing-graph.spec.ts goes with the component it pinned. public-seo.spec.ts's SSR guard is retargeted, not deleted: its failure mode (an ssr: false silently dropping the landing's copy from crawled HTML) outlived its selectors, and is sharper on a canvas/WebGL page. It deliberately does not assert the wordmark — that scrambles in client-side, so the h1's aria-label is checked instead. All 7 assertions verified against raw SSR output.
• The five companion pages the nav links to (/team, /wiki, /gallery, /news, /faq). Once v5 took /, those links 404'd. They use the warm paper palette deliberately — that is not a mistake to unify.

Known gaps

• Feature lab demo pane. The source mounts a separate FeatureLab design component per kind via <dc-import> — a distinct 75KB file the task's file list did not scope in. Layout, FLIP, rail, copy and close are faithful; the pane shows the card's miniature enlarged.
• Gallery tiles have no artwork — the import ships no screenshots.

Verification

• tsc --noEmit exit 0 · eslint exit 0 · next build exit 0, all 5 new routes prerendered static
• Unit suite 59 files / 423 tests passing
• Every section walked in a real browser at multiple scroll positions, no console errors; all 9 public routes return 200

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features
  • Introduced a redesigned landing experience with interactive knowledge graphs, tutoring modes, feature demos, gallery, journal, FAQ, and beta signup.
  • Added public FAQ, Gallery, News, Team, and Wiki pages with responsive navigation and searchable or filterable content.
  • Added interactive demonstrations for quizzes, flashcards, grades, calendars, notes, study rooms, guides, and tutoring.
• Documentation
  • Improved server-rendered landing-page checks for key accessible content and beta messaging.
• Refactor
  • Retired the previous marketing sections and legacy landing-page presentation.

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ebab108d-0405-4ae1-8d00-108ba83a0144

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Replaced the landing page with a component-based v5 experience, added interactive feature labs and companion pages, introduced shared animation engines and content data, and updated SSR coverage. Removed the former marketing graph, surface components, and related tests.

Changes

Landing v5 experience

Layer / File(s)	Summary
Landing content and data contracts frontend/src/lib/landing/*	Added landing content, course graph data, drag clusters, color utilities, and companion-page datasets.
Animation and interaction engines frontend/src/lib/landing/engine/*, frontend/src/lib/landing/hero3d/*	Added graph rendering, canvas effects, layout measurement, marquee and FLIP behavior, planting, drag simulation, and WebGL hero support.
Landing composition frontend/src/app/(public)/page.tsx, frontend/src/components/landing-v5/*, frontend/src/components/landing/useLanding.ts	Replaced the previous landing implementation with v5 hero, graph, ingest, tutor, gallery, FAQ, journal, CTA, navigation, modal, and lifecycle components.
Interactive feature labs frontend/src/components/landing-v5/lab/*	Added interactive quiz, flashcard, guide, grade, calendar, notes, rooms, and tutor demos with shared fixture data and controls.
Companion pages frontend/src/components/companion/*, frontend/src/app/(public)/{about,team,wiki,faq,gallery,news}/*	Added shared companion navigation and public About, Team, Wiki, FAQ, Gallery, and News routes.
Styling and SSR validation frontend/src/app/globals.css, frontend/e2e/public-seo.spec.ts, frontend/eslint-suppressions.json, frontend/src/lib/api.ts	Added scoped landing and companion styles, responsive animations, newsletter API wiring, and SSR checks for landing-page copy. Removed obsolete ESLint suppressions.

Estimated code review effort: 5 (Critical) | ~120 minutes

Possibly related PRs

• SaplingLearn/Sapling#513: Replaced the related knowledge-graph landing implementation and its supporting components.
• SaplingLearn/Sapling#63: Uses the same beta/newsletter signup flow implemented through BetaModal.
• SaplingLearn/Sapling#286: Also modifies the public landing page and shared styling layer.

Suggested reviewers:andresl230

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 36.59% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the primary change: porting Sapling Landing v5 into the landing page.
Description check	✅ Passed	The description explains the purpose, major changes, known gaps, related issue context, and verification results in substantial detail.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/landing-v5-port

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[supabase]

This pull request has been ignored for the connected project ybgqdonkoqftwrmweuyv because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[cloudflare-workers-and-pages]

Deploying with Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	frontend-staging	fc36068	Commit Preview URL Branch Preview URL	Aug 16 2026, 09:58 PM

[coderabbitai]

Actionable comments posted: 8

Note

Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.

🟡 Minor comments (14)

frontend/src/components/landing-v5/lab/NotesDemo.tsx-57-80 (1)

57-80: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

extract and summarize timeouts are untracked.

saveT is cleared on unmount, but the 700 ms timeouts at line 60 and line 71 are not stored and not cleared. If the lab panel closes within that window, the callbacks still run and set state on an unmounted component. Hold both handles in refs and clear them in the existing unmount effect.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` around lines 57 - 80,
Update the extract and summarize timeout flows to store their setTimeout handles
in dedicated refs, and clear both refs in the existing unmount effect alongside
saveT. Ensure the callbacks still perform their current state updates when they
complete, while preventing them from running after the component unmounts.

frontend/src/components/landing-v5/lab/CardsDemo.tsx-46-53 (1)

46-53: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The global space handler blocks button activation.

The keydown listener calls e.preventDefault() for every space press on window. A focused button then cannot be activated with space, including "Study again" at line 90. Skip the flip and the preventDefault call when the event target is an interactive element.

♿ Proposed fix

 const onKey = (e: KeyboardEvent) => {
+ const el = e.target as HTMLElement | null;+ if (el?.closest('button, input, textarea, select, [contenteditable]')) return;
if (e.key === ' ') { e.preventDefault(); flip(); }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 46 - 53,
Update the keydown handler in the useEffect to detect when the event target is
an interactive element, such as a button or link, and skip both flip() and
preventDefault() for those targets. Preserve the existing global space-to-flip
and rate-key behavior for non-interactive targets.

frontend/src/components/landing-v5/lab/NotesDemo.tsx-63-63 (1)

63-63: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The "no concepts" sentinel is counted as a linked concept.

When no matcher hits, concepts receives one placeholder entry. The footer at line 141 then renders "1 concepts linked to your MA 242 graph." The count is wrong and contradicts the placeholder. Keep concepts empty and track the empty result separately.

🔧 Proposed fix

+ const [ran, setRan] = useState(false);
@@
- setConcepts(found.length ? found : [{ name: 'No concepts found', tier: 'unexplored' }]);+ setConcepts(found);+ setRan(true);
setBusy(false);
@@
+ {ran && concepts.length === 0 && !busy && (+ <span style={{ fontSize: 12, color: '`#9AA5A0`' }}>No concepts found.</span>+ )}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` at line 63, Update the
concept-loading logic around the setConcepts call to keep concepts empty when
found has no matches instead of inserting a “No concepts found” sentinel; track
the empty-result state separately and use it for the empty-state display while
ensuring the footer count reflects only actual linked concepts.

frontend/src/lib/landing/engine/dom.ts-49-73 (1)

49-73: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Do not cache a zero-sized canvas measurement.

cv() caches w/h from clientWidth/clientHeight on the first call. The cache is dropped only by invalidateCanvas, which measure() calls only when the viewport dimensions change (see frontend/src/lib/landing/engine/measure.ts lines 98-104). If the first cv() call happens while the canvas is not laid out yet, or while its section is hidden, the cache stores 0 × 0. Every later frame then draws into a 0-pixel backing store, and the canvas stays blank until the viewport itself changes.

Skip the cache write when the measured size is zero, so the next frame re-reads it.

🐛 Proposed fix

 if (!c) {
const w = canvas.clientWidth;
const h = canvas.clientHeight;
const dpr = Math.min(window.devicePixelRatio || 1, 1.5);
let ctx = rec.__ctx as CanvasRenderingContext2D | undefined;
if (!ctx) {
ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
rec.__ctx = ctx;
}
c = { ctx, w, h, dpr };
- rec.__cv = c;+ // An unlaid-out or hidden canvas measures 0; don't freeze that in the+ // cache, or the next frames draw into a 0-pixel backing store.+ if (w > 0 && h > 0) rec.__cv = c;
const pw = Math.round(w * dpr);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/dom.ts` around lines 49 - 73, Update cv so
zero-sized measurements are not stored in the CanvasCache: when clientWidth or
clientHeight is zero, avoid assigning the newly measured cache to rec.__cv while
preserving the current context and sizing behavior. Ensure subsequent calls
re-read dimensions until both measurements are nonzero, while retaining normal
caching for valid sizes.

frontend/src/components/landing-v5/Journal.tsx-96-101 (1)

96-101: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Each post card links back to its own section.

href="#newsletter" points at the section that contains the card. The card presents as a link to an article, and activating it does nothing. This PR adds a /news route. Point each card at the article, or at /news until per-post routes exist.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 96 - 101, Update
the post card anchor in the Journal component to navigate to the new /news route
instead of the containing `#newsletter` section, while preserving the existing
card styling and behavior.

frontend/src/lib/landing/engine/sim.ts-184-203 (1)

184-203: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Label binding depends on an SVG sibling order that the markup does not guarantee.engine/sim.ts locates a node's caption through ring.nextElementSibling and casts it to SVGTextElement, while DragField renders that <text> only when a label exists for the node. When a label is missing, the sim binds the following node's glow <circle> and writes x/y onto it every frame, and ly becomes NaN.

• frontend/src/lib/landing/engine/sim.ts#L184-L203: check nextElementSibling.tagName === 'text' before the cast, type SimNode.label as SVGTextElement | null, and skip the label writes at lines 377-378 when it is null.
• frontend/src/components/landing-v5/DragField.tsx#L60-L92: alternatively, or in addition, always emit a <text> element per node so the documented glow → ring → label order holds for every node.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 184 - 203, Prevent
incorrect label binding in sim.ts by verifying ring.nextElementSibling is a text
element before assigning it, type SimNode.label as SVGTextElement | null, and
skip label position updates when it is null; update DragField.tsx to always
render a text element per node so the expected glow, ring, label order is
maintained.

frontend/src/components/landing-v5/Faq.tsx-66-71 (1)

66-71: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

"Read the full FAQ" links to its own section.

href="#faq" targets the section that contains the link, so the control does nothing. This PR adds a /faq route. Point the link there.

🔗 Proposed fix

- <a href="`#faq`" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>+ <a href="/faq" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 66 - 71, Update the
“Read the full FAQ” anchor in the FAQ component to navigate to the newly added
/faq route instead of the local `#faq` section, preserving its existing styling
and text.

frontend/src/components/landing-v5/Journal.tsx-184-199 (1)

184-199: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Set type="email" and guard the current submit flow.

The Journal input is an email address, so use type="email" for mobile keyboard and browser validation. The current actions.subscribe, at frontend/src/components/landing/useLanding.ts:624, only checks email.includes('@') and sets local subscribed state. If this should be a stub, make that intent explicit; otherwise wire onSubscribe to a newsletter endpoint before showing “You’re on the tree”.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 184 - 199,
Update the Journal email input in the landing component to use type="email" and
preserve the existing onSubscribe flow only as an explicit stub, or wire
onSubscribe to the newsletter endpoint and show the subscribed state only after
a successful submission. Locate the handler through actions.subscribe/useLanding
and ensure invalid emails cannot enter the success state.

frontend/src/components/landing-v5/Faq.tsx-79-116 (1)

79-116: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Closed answers stay in the accessibility tree, and the button has no aria-controls.

The collapsed panel uses maxHeight: 0, opacity: 0, and overflow: hidden. None of these remove the content from assistive technology, so a screen reader reads every answer even when the accordion is closed. The button also declares aria-expanded without naming the region it controls.

Add aria-controls with a stable id, and set aria-hidden on the panel while it is closed. aria-hidden does not disturb the max-height transition, because the content holds no focusable elements.

♿ Proposed fix

 <button
onClick={() => onToggle(open ? -1 : i)}
aria-expanded={open}
+ aria-controls={`faq-answer-${i}`}
style={{ width: '100%', background: 'none', border: 'none', cursor: 'pointer', padding: '22px 4px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 20, textAlign: 'left' }}
>

 <div
+ id={`faq-answer-${i}`}+ role="region"+ aria-hidden={!open}
style={{

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 79 - 116, Update the
FAQ accordion around the toggle button and answer panel to give each panel a
stable unique id, reference it from the button via aria-controls, and set
aria-hidden based on the open state so closed answers are excluded from the
accessibility tree. Preserve the existing visual transition and aria-expanded
behavior.

frontend/src/components/landing-v5/Navbar.tsx-199-235 (1)

199-235: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

role="menu" is applied to navigation disclosures whose children are not menu items. Both new navigation panels declare role="menu", but their children are plain button elements and next/link anchors. The ARIA menu pattern permits only menuitem, menuitemradio, and menuitemcheckbox children, so screen readers report both groups incorrectly. Both panels are page navigation, not application menus, so the correct fix in each place is to remove the role rather than to add menuitem roles.

• frontend/src/components/landing-v5/Navbar.tsx#L199-L235: remove role="menu" from the compact panel, and remove aria-haspopup="menu" from the trigger at line 120. Keep aria-expanded.
• frontend/src/components/landing-v5/Closing.tsx#L154-L182: remove role="menu" from the jump panel, and remove aria-haspopup="menu" from the pill at line 188. The enclosing nav with aria-label="Page sections" already carries the correct semantics.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Navbar.tsx` around lines 199 - 235, The
navigation disclosures use menu semantics with ordinary links and buttons;
remove those menu roles and triggers’ menu-haspopup attributes. In
frontend/src/components/landing-v5/Navbar.tsx lines 199-235, remove role="menu"
from the compact panel and remove aria-haspopup="menu" from its trigger while
retaining aria-expanded. In frontend/src/components/landing-v5/Closing.tsx lines
154-182, remove role="menu" from the jump panel and remove aria-haspopup="menu"
from the pill trigger; keep the enclosing navigation semantics and existing
expansion state.

frontend/src/app/(public)/page.tsx-115-116 (1)

115-116: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Clear the deferred openGal timers on unmount.

actions.openGal schedules actions.enterExplore / actions.openGal 260 ms later from onQuiz and onLearn. If the page unmounts before those timers fire, openGal runs after cleanup and writes document.body.style.overflow = 'hidden' after the landing cleanup reset that overflow. Keep the timer refs in useLanding so cleanup can call clearTimeout for them.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/page.tsx around lines 115 - 116, Update useLanding
and the onQuiz/onLearn handlers to store each 260 ms openGal timeout in refs,
rather than discarding the timer IDs. In the landing cleanup, clear both
deferred timers before resetting document.body overflow, preventing
actions.openGal from running after unmount.

frontend/src/components/landing-v5/ActTutor.tsx-93-109 (1)

93-109: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Expose the selected tutor mode, and keep the hidden pills out of the tab order.

Two gaps in this control group:

1. The pills are a mode selector, but the selected state is carried only by background and color. Assistive technology cannot report which mode is active. Add aria-pressed={tutorMode === i}.
2. The container starts at opacity: 0 with pointerEvents: 'none', and the engine fades it in later. The buttons stay focusable while invisible, so a keyboard user can focus a control that is not visible. Mirror the visual state in the tab order.

Also add type="button", which the other sections in this PR set consistently.

♻️ Proposed fix for the pill group

- {CAPTIONS.map(([tag], i) => (- <button- key={tag}- onClick={() => onSetMode(i)}+ {CAPTIONS.map(([tag], i) => (+ <button+ key={tag}+ type="button"+ aria-pressed={tutorMode === i}+ onClick={() => onSetMode(i)}

The engine already writes opacity on the container. Have it also clear visibility or the inert attribute so the pills leave the tab order until the handover:

- <div data-tutor-pills="1" style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>+ <div data-tutor-pills="1" inert style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActTutor.tsx` around lines 93 - 109,
Update the tutor pill group in ActTutor’s CAPTIONS map to add type="button" and
aria-pressed={tutorMode === i} to each button. Keep the hidden container’s
buttons out of the tab order while the engine-controlled opacity is zero by
mirroring its hidden state with inert or an equivalent visibility-based
mechanism, and ensure the existing handover clears that state when the pills
become visible.

frontend/src/components/landing-v5/ActGraph.tsx-333-340 (1)

333-340: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Add an Escape key exit for explore mode.

Explore mode covers the act and closes the navbar, but useLanding only handles Escape for gallery and jump controls. If explore mode is active, call onExitExplore from the key handler so keyboard-only users can leave the mode safely.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActGraph.tsx` around lines 333 - 340,
Update the existing keyboard handler in useLanding to detect Escape while
explore mode is active and call onExitExplore. Preserve the current Escape
behavior for gallery and jump controls, and ensure the explore-mode exit path is
available to keyboard-only users.

frontend/src/lib/landing/hero3d/index.ts-175-189 (1)

175-189: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Release the WebGL context in stop().

stop() already disposes three.js resources and cancels the render loop. WebGLRenderer.dispose() does not release the WebGL context, and this rig creates a new context on its canvas each mount. Add renderer.forceContextLoss() after renderer.dispose() so repeated navigation can reclaim the browser contexts sooner.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/hero3d/index.ts` around lines 175 - 189, Update the
returned stop() method to call renderer.forceContextLoss() immediately after
renderer.dispose(), ensuring the WebGL context is released during cleanup while
preserving the existing resource disposal and animation cancellation behavior.

🧹 Nitpick comments (14)

frontend/src/components/landing-v5/lab/LabShell.tsx (1)

51-84: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Segmented is unused; two demos duplicate it inline.

The comment states that the tutor and calendar demos use this control. They do not import it. CalendarDemo.tsx lines 61-76 and TutorDemo.tsx lines 65-80 each contain an inline copy of the same markup and style logic. Use Segmented in both demos, or delete it and correct the comment.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx` around lines 51 - 84,
Resolve the unused Segmented component by replacing the duplicated inline
segmented-control markup in CalendarDemo and TutorDemo with the shared Segmented
component, passing each demo’s options, current value, and change handler.
Preserve the existing labels, selection behavior, and styling, and keep the
component’s public API unchanged.

frontend/src/components/landing-v5/lab/QuizDemo.tsx (1)

33-35: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Difficulty badge changes while the same question is shown.

submit updates streak before it sets phase to review. qi does not change. The badge therefore flips from MEDIUM to HARD or EASY while the user still reads question 1 and its explanation. Derive the badge from the difficulty that applied when the question was served, for example from answers.length captured at question start.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 33 - 35,
Update the difficulty derivation in QuizDemo so the badge remains tied to the
difficulty assigned when the current question was served, rather than
recomputing from the mutable streak during review. Capture or derive the
question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.

frontend/src/components/landing-v5/lab/GradesDemo.tsx (1)

62-65: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Row percentage is unclamped while the weighted grade is clamped.

Line 25 clamps the score into [0, r.possible]. Line 64 uses the unclamped raw. If the user types 70 in a 50-point row, the row shows 140% while the category bar and the overall grade cap at 100%. Apply the same clamp in both places.

♻️ Proposed fix

 const raw = parseFloat(earned[i]);
- const pct = isNaN(raw) ? null : Math.round((raw / r.possible) * 100);+ const pct = isNaN(raw) ? null : Math.round((Math.max(0, Math.min(raw, r.possible)) / r.possible) * 100);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx` around lines 62 - 65,
Clamp the parsed score used in the row percentage calculation within the same
[0, r.possible] bounds already applied to the weighted grade. Update the
percentage logic in the GB_ROWS map callback, preserving the existing null
handling and color thresholds while ensuring values above or below the row
limits cannot produce percentages outside 0–100.

frontend/src/components/landing-v5/lab/labData.ts (1)

13-13: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Remove duplicated TIER from labData.ts.

labData.ts exports TIER, but the lab demos import LAB_TIER and render with labData.ts content. The four hex values and keys match LAB_TIER, so two copies of this swatch set can drift. Drop TIER from labData.ts and keep using LAB_TIER.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/labData.ts` at line 13, Remove the
exported TIER constant from labData.ts, since it duplicates the matching
LAB_TIER swatch set. Update any references in labData.ts to use LAB_TIER
instead, preserving the existing keys and color values.

frontend/src/lib/landing/engine/graph.ts (1)

122-127: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Replace the random-comparator shuffle with Fisher–Yates.

sort(() => Math.random() - 0.5) uses an inconsistent comparator. The resulting permutation is biased and depends on the engine's sort implementation, so many nodes keep positions close to their original index. That works against the documented intent of an organic reveal order.

♻️ Proposed fix

- // Shuffle the reveal order so the graph assembles organically.- const order = nodes.map((_, i) => i).sort(() => Math.random() - 0.5);+ // Shuffle the reveal order so the graph assembles organically.+ const order = nodes.map((_, i) => i);+ for (let i = order.length - 1; i > 0; i--) {+ const j = Math.floor(Math.random() * (i + 1));+ [order[i], order[j]] = [order[j], order[i]];+ }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/graph.ts` around lines 122 - 127, Replace the
random-comparator sort in the reveal-order logic with an unbiased Fisher–Yates
shuffle of the index array. Keep the existing spawnAt and colorAt calculations
and node ordering behavior after shuffling unchanged.

frontend/src/app/(public)/wiki/page.tsx (1)

31-39: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Make lede optional so the privacy section does not render an empty paragraph.

The privacy section passes lede="". Section always renders the <p>, so the page emits an empty paragraph with 0 0 20px margins. That adds dead space and an empty node in the accessibility tree.

♻️ Proposed fix

-function Section({ id, title, lede, children }: { id: string; title: string; lede: string; children?: React.ReactNode }) {+function Section({ id, title, lede, children }: { id: string; title: string; lede?: string; children?: React.ReactNode }) {
return (
<section style={{ marginTop: 56, scrollMarginTop: 110 }} id={id}>
<SectionHeading>{title}</SectionHeading>
- <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ {lede ? (+ <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ ) : null}
{children}

Then drop lede="" at line 147.

Also applies to: 147-149

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/wiki/page.tsx around lines 31 - 39, Make the lede
prop optional in Section and render the paragraph only when lede has content, so
the privacy section does not produce an empty element or spacing. Remove the
lede="" argument from the privacy Section usage while preserving existing lede
rendering for other sections.

frontend/src/lib/landing/engine/marquee.ts (1)

136-144: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick win

Avoid the per-frame layout read in update().

update() runs from the engine tick on every frame the gallery is on screen. Line 136 reads wrap.clientWidth on each of those frames, and line 156 writes track.style.transform. The write dirties style, so the next frame's read forces a style recalculation and layout. That contradicts the engine invariant documented in frontend/src/lib/landing/engine/index.ts lines 4-8, which states the tick never reads layout.

Observe the container width instead, and re-measure only when it changes.

♻️ Proposed approach

- // measure one card set only when the container width changed- if (!m.setW || m.measuredW !== wrap.clientWidth) {+ // measure one card set only when a ResizeObserver marked it stale+ if (!m.setW) {

Then in bind, mark the state stale from an observer and add its teardown to cleanups:

constro=newResizeObserver(()=>{m.setW=0;});if(wrap)ro.observe(wrap);cleanups.push(()=>ro.disconnect());

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/marquee.ts` around lines 136 - 144, Remove
the per-frame wrap.clientWidth read from update() and move width-change
detection to bind using a ResizeObserver on wrap. Have the observer mark m.setW
stale, register ro.disconnect in cleanups, and preserve the existing measurement
logic when update() sees stale state without reading layout every tick.

frontend/src/components/landing-v5/FeatureLab.tsx (1)

94-119: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Mark the active rail button for assistive technology.

on changes only the colors. Add aria-current="true" on the selected button so the active tool is conveyed without color.

♿ Proposed change

 data-rail={i}
type="button"
+ aria-current={on || undefined}
onClick={() => onPick(i)}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 94 - 119, Add
an aria-current="true" attribute to the selected rail button rendered in the
GAL.map callback, using the existing on condition so assistive technology
identifies the active tool without relying on color.

frontend/src/components/landing-v5/Gallery.tsx (1)

71-73: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

The wrapper duplicates the miniature's own container.

The <div> here sets height: 166, borderRadius: 13, overflow: hidden, the same background, and the same border. Every entry in GALLERY_MINIS opens with a <div> carrying that identical style set (see galleryMinis.tsx line 16). One of the two layers is redundant. Because the minis are generated, drop the wrapper here rather than editing the generated file.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 71 - 73, Remove
the redundant wrapper div around GALLERY_MINIS[i] in Gallery, rendering the
miniature directly while preserving its existing placement and aria-hidden
behavior. Do not modify the generated galleryMinis.tsx entries.

frontend/src/lib/landing/engine/flip.ts (1)

24-25: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

FlipState.ran is never read.

armFlip sets ran = false and flipClose resets it, but no code in this module or in frontend/src/components/landing/useLanding.ts reads it. The consumer tracks the same guard with its own flipRan ref (see useLanding.ts lines 158, 552, 574-575). Two guards for one invariant can drift. Either remove ran from FlipState or make flipOpen own the guard and delete flipRan from the hook.

Also applies to: 78-78

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/flip.ts` around lines 24 - 25, Remove the
unused FlipState.ran field and its assignments in armFlip and flipClose, since
useLanding already owns this guard through flipRan. Keep the existing
flipRan-based behavior unchanged and avoid maintaining duplicate state for the
same invariant.

frontend/src/lib/landing/engine/hero.ts (1)

99-136: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Points behind the camera reach the link pass with a degenerate scale.

sc = FL / (FL + z) is computed for every node. Rotation mixes ox into z, and ox reaches about ±740 while oz reaches about ±340, so z can pass -1000. At z === -FL the divide produces Infinity, and below -FL it produces a negative scale.

The point pass guards this at line 139 with p.z > -FL. The link pass at lines 116-136 does not. A node with Infinity scale gives reach === Infinity, so the break at line 122 never fires for that row and the inner loop degrades to a full scan.

Filter the projection once, so both passes share the guard.

♻️ Proposed change

 const proj = nodes
.map((n) => {
...
})
+ // drop anything at or behind the projection plane: `sc` is not finite+ // there, which breaks both the link reach and the point radius+ .filter((p) => p.z > -FL)
.sort((a, b) => b.z - a.z);

The p.z > -FL test at line 139 then becomes redundant and can go.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/hero.ts` around lines 99 - 136, Filter the
projected nodes immediately after the `proj` mapping so only entries with `p.z >
-FL` remain before sorting and running the link pass. Reuse this filtered
collection for both link rendering and the later point-rendering pass, then
remove the now-redundant `p.z > -FL` guard in the point pass.

frontend/src/components/landing/useLanding.ts (1)

378-392: 🚀 Performance & Scalability | 🔵 Trivial | 💤 Low value

The reveal scan polls every 900ms for the page lifetime.

scan() re-queries [data-reveal] across the whole landing root twice per second, forever, to catch elements that mount later. A MutationObserver on root would react to the same additions without the standing timer. This is a nice-to-have; the current cost is one querySelectorAll per tick.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 378 - 392,
Replace the lifetime polling interval in the reveal setup around scan with a
MutationObserver watching root for added elements, invoking scan when matching
content mounts later. Keep the initial scan, existing seen/io behavior, and
cleanup, but disconnect the mutation observer instead of clearing an interval.

frontend/src/lib/landing/engine/sim.ts (1)

282-299: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

up ignores pointerId, and the window listeners are registered once per cluster.

Two small points in bindDrag:

• up does not compare e.pointerId with f.drag.id. A second pointer that lifts cancels the active drag. onMove does compare the id, so the handlers are inconsistent.
• onMove and up are added to window inside the per-cluster loop. With N clusters in one group, every window pointer event runs N identical handlers. Bind the window listeners once per group instead.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 282 - 299, Update
bindDrag so up ignores pointer events whose pointerId does not match f.drag.id,
matching onMove’s active-pointer validation. Move the window-level pointermove,
pointerup, and pointercancel listener registration out of the per-cluster
binding loop and register each once per group, while keeping the per-SVG
listeners on the individual cluster SVG.

frontend/src/components/landing-v5/Closing.tsx (1)

75-92: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Share the companion-page list, and make the footer icon decorative.

Two points:

1. FOOTER_LINKS repeats PAGES in Navbar.tsx (lines 26-33) with the same six label and href pairs. Both files are new in this PR, so the two lists will drift the first time a companion page is added or renamed. Export one list and import it in both places.
2. Line 91 sets alt="Sapling" on the icon, and the adjacent text already reads "Sapling · © 2026". A screen reader announces the name twice. Navbar.tsx line 100 already uses alt="" for the same icon beside the same wordmark.

♻️ Proposed fix

- <Image src="/sapling-icon.svg" alt="Sapling" width={20} height={20} />+ <Image src="/sapling-icon.svg" alt="" width={20} height={20} />

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Closing.tsx` around lines 75 - 92, Share
the companion-page link list currently duplicated as FOOTER_LINKS in SiteFooter
and PAGES in Navbar by exporting one canonical list and importing it in both
components, preserving all six label/href pairs. Update the footer Image in
SiteFooter to use an empty alt value so the adjacent Sapling text is announced
only once.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/app/globals.css`:
- Around line 1957-2005: Rename the camelCase keyframe declarations in the
affected stylesheet to kebab-case, including symbols such as s1Stem,
saplingBlob, introOrbit, popHold, and the additional reported ranges. Update
every corresponding animation and animation-name reference to the new kebab-case
identifiers, preserving all animation behavior.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 41-50: Update the modal container identified by panelRef in
FeatureLab to add role="dialog", aria-modal="true", and an accessible name. On
mount, move focus into the panel; while open, trap Tab navigation within it so
focus cannot reach the page behind the overlay. Capture and restore focus to the
triggering element stored in FlipState.el when the panel closes, while
preserving the existing Escape close behavior.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 62-85: Update Card so non-ghost cards are keyboard-focusable and
activatable, using the existing track click-delegation contract, while ghost
duplicates remain excluded from the tab order and accessibility tree. Add the
corresponding keyboard activation handling to the card or track using the
existing feature-lab target behavior, and correct the nearby doc comment to
match the implemented accessibility behavior. Add a visible
.ld-galcard:focus-visible style in globals.css.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 37-44: Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout
in the rate handler is stored in a useRef, cleared before scheduling each new
rating and during unmount, and remove the ineffective returned cleanup. Update
NotesDemo.tsx at lines 57-80 so the 700 ms extract and summarize timeouts use
refs and are cleared in the existing unmount effect alongside saveT.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx`:
- Around line 21-24: Update the RECENT entries’ pick values to exactly match an
existing exam option in the corresponding GUIDES course fixture, preserving
openRecent’s assignment and keeping the select value consistent with the guide
heading.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 104-124: Fix the quiz option accessibility semantics in the
q.options mapping: either make each button a radio with role="radio" and
aria-checked bound to isPicked while retaining the radiogroup, or remove the
radiogroup role and expose isPicked through aria-pressed. Preserve the existing
selection and reviewing behavior in the option onClick handler.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 213-224: Update the hero canvas useEffect around startHeroCanvas
to track a cancelled/unmounted flag. Set it during cleanup, check it after the
asynchronous hero module import resolves before starting the canvas, and stop
the returned controller when appropriate so no animation loop or resize listener
remains after unmount.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 423-430: Update the initialization and destroy flow around
ensureInit and destroy to retain each cluster element’s original parent before
moving it into the overlay. During destroy, restore every cluster to that
parent, clear the inline styles applied by ensureInit, then remove the overlay
and reset state so a later ensureInit can rebuild the field without disrupting
React-owned nodes.
---
Minor comments:
In `@frontend/src/app/`(public)/page.tsx:
- Around line 115-116: Update useLanding and the onQuiz/onLearn handlers to
store each 260 ms openGal timeout in refs, rather than discarding the timer IDs.
In the landing cleanup, clear both deferred timers before resetting
document.body overflow, preventing actions.openGal from running after unmount.
In `@frontend/src/components/landing-v5/ActGraph.tsx`:
- Around line 333-340: Update the existing keyboard handler in useLanding to
detect Escape while explore mode is active and call onExitExplore. Preserve the
current Escape behavior for gallery and jump controls, and ensure the
explore-mode exit path is available to keyboard-only users.
In `@frontend/src/components/landing-v5/ActTutor.tsx`:
- Around line 93-109: Update the tutor pill group in ActTutor’s CAPTIONS map to
add type="button" and aria-pressed={tutorMode === i} to each button. Keep the
hidden container’s buttons out of the tab order while the engine-controlled
opacity is zero by mirroring its hidden state with inert or an equivalent
visibility-based mechanism, and ensure the existing handover clears that state
when the pills become visible.
In `@frontend/src/components/landing-v5/Faq.tsx`:
- Around line 66-71: Update the “Read the full FAQ” anchor in the FAQ component
to navigate to the newly added /faq route instead of the local `#faq` section,
preserving its existing styling and text.
- Around line 79-116: Update the FAQ accordion around the toggle button and
answer panel to give each panel a stable unique id, reference it from the button
via aria-controls, and set aria-hidden based on the open state so closed answers
are excluded from the accessibility tree. Preserve the existing visual
transition and aria-expanded behavior.
In `@frontend/src/components/landing-v5/Journal.tsx`:
- Around line 96-101: Update the post card anchor in the Journal component to
navigate to the new /news route instead of the containing `#newsletter` section,
while preserving the existing card styling and behavior.
- Around line 184-199: Update the Journal email input in the landing component
to use type="email" and preserve the existing onSubscribe flow only as an
explicit stub, or wire onSubscribe to the newsletter endpoint and show the
subscribed state only after a successful submission. Locate the handler through
actions.subscribe/useLanding and ensure invalid emails cannot enter the success
state.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 46-53: Update the keydown handler in the useEffect to detect when
the event target is an interactive element, such as a button or link, and skip
both flip() and preventDefault() for those targets. Preserve the existing global
space-to-flip and rate-key behavior for non-interactive targets.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx`:
- Around line 57-80: Update the extract and summarize timeout flows to store
their setTimeout handles in dedicated refs, and clear both refs in the existing
unmount effect alongside saveT. Ensure the callbacks still perform their current
state updates when they complete, while preventing them from running after the
component unmounts.
- Line 63: Update the concept-loading logic around the setConcepts call to keep
concepts empty when found has no matches instead of inserting a “No concepts
found” sentinel; track the empty-result state separately and use it for the
empty-state display while ensuring the footer count reflects only actual linked
concepts.
In `@frontend/src/components/landing-v5/Navbar.tsx`:
- Around line 199-235: The navigation disclosures use menu semantics with
ordinary links and buttons; remove those menu roles and triggers’ menu-haspopup
attributes. In frontend/src/components/landing-v5/Navbar.tsx lines 199-235,
remove role="menu" from the compact panel and remove aria-haspopup="menu" from
its trigger while retaining aria-expanded. In
frontend/src/components/landing-v5/Closing.tsx lines 154-182, remove role="menu"
from the jump panel and remove aria-haspopup="menu" from the pill trigger; keep
the enclosing navigation semantics and existing expansion state.
In `@frontend/src/lib/landing/engine/dom.ts`:
- Around line 49-73: Update cv so zero-sized measurements are not stored in the
CanvasCache: when clientWidth or clientHeight is zero, avoid assigning the newly
measured cache to rec.__cv while preserving the current context and sizing
behavior. Ensure subsequent calls re-read dimensions until both measurements are
nonzero, while retaining normal caching for valid sizes.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 184-203: Prevent incorrect label binding in sim.ts by verifying
ring.nextElementSibling is a text element before assigning it, type
SimNode.label as SVGTextElement | null, and skip label position updates when it
is null; update DragField.tsx to always render a text element per node so the
expected glow, ring, label order is maintained.
In `@frontend/src/lib/landing/hero3d/index.ts`:
- Around line 175-189: Update the returned stop() method to call
renderer.forceContextLoss() immediately after renderer.dispose(), ensuring the
WebGL context is released during cleanup while preserving the existing resource
disposal and animation cancellation behavior.
---
Nitpick comments:
In `@frontend/src/app/`(public)/wiki/page.tsx:
- Around line 31-39: Make the lede prop optional in Section and render the
paragraph only when lede has content, so the privacy section does not produce an
empty element or spacing. Remove the lede="" argument from the privacy Section
usage while preserving existing lede rendering for other sections.
In `@frontend/src/components/landing-v5/Closing.tsx`:
- Around line 75-92: Share the companion-page link list currently duplicated as
FOOTER_LINKS in SiteFooter and PAGES in Navbar by exporting one canonical list
and importing it in both components, preserving all six label/href pairs. Update
the footer Image in SiteFooter to use an empty alt value so the adjacent Sapling
text is announced only once.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 94-119: Add an aria-current="true" attribute to the selected rail
button rendered in the GAL.map callback, using the existing on condition so
assistive technology identifies the active tool without relying on color.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 71-73: Remove the redundant wrapper div around GALLERY_MINIS[i] in
Gallery, rendering the miniature directly while preserving its existing
placement and aria-hidden behavior. Do not modify the generated galleryMinis.tsx
entries.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx`:
- Around line 62-65: Clamp the parsed score used in the row percentage
calculation within the same [0, r.possible] bounds already applied to the
weighted grade. Update the percentage logic in the GB_ROWS map callback,
preserving the existing null handling and color thresholds while ensuring values
above or below the row limits cannot produce percentages outside 0–100.
In `@frontend/src/components/landing-v5/lab/labData.ts`:
- Line 13: Remove the exported TIER constant from labData.ts, since it
duplicates the matching LAB_TIER swatch set. Update any references in labData.ts
to use LAB_TIER instead, preserving the existing keys and color values.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx`:
- Around line 51-84: Resolve the unused Segmented component by replacing the
duplicated inline segmented-control markup in CalendarDemo and TutorDemo with
the shared Segmented component, passing each demo’s options, current value, and
change handler. Preserve the existing labels, selection behavior, and styling,
and keep the component’s public API unchanged.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 33-35: Update the difficulty derivation in QuizDemo so the badge
remains tied to the difficulty assigned when the current question was served,
rather than recomputing from the mutable streak during review. Capture or derive
the question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 378-392: Replace the lifetime polling interval in the reveal setup
around scan with a MutationObserver watching root for added elements, invoking
scan when matching content mounts later. Keep the initial scan, existing seen/io
behavior, and cleanup, but disconnect the mutation observer instead of clearing
an interval.
In `@frontend/src/lib/landing/engine/flip.ts`:
- Around line 24-25: Remove the unused FlipState.ran field and its assignments
in armFlip and flipClose, since useLanding already owns this guard through
flipRan. Keep the existing flipRan-based behavior unchanged and avoid
maintaining duplicate state for the same invariant.
In `@frontend/src/lib/landing/engine/graph.ts`:
- Around line 122-127: Replace the random-comparator sort in the reveal-order
logic with an unbiased Fisher–Yates shuffle of the index array. Keep the
existing spawnAt and colorAt calculations and node ordering behavior after
shuffling unchanged.
In `@frontend/src/lib/landing/engine/hero.ts`:
- Around line 99-136: Filter the projected nodes immediately after the `proj`
mapping so only entries with `p.z > -FL` remain before sorting and running the
link pass. Reuse this filtered collection for both link rendering and the later
point-rendering pass, then remove the now-redundant `p.z > -FL` guard in the
point pass.
In `@frontend/src/lib/landing/engine/marquee.ts`:
- Around line 136-144: Remove the per-frame wrap.clientWidth read from update()
and move width-change detection to bind using a ResizeObserver on wrap. Have the
observer mark m.setW stale, register ro.disconnect in cleanups, and preserve the
existing measurement logic when update() sees stale state without reading layout
every tick.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 282-299: Update bindDrag so up ignores pointer events whose
pointerId does not match f.drag.id, matching onMove’s active-pointer validation.
Move the window-level pointermove, pointerup, and pointercancel listener
registration out of the per-cluster binding loop and register each once per
group, while keeping the per-SVG listeners on the individual cluster SVG.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 865084a7-2f4d-472c-accd-6f67530e2a35

📥 Commits

Reviewing files that changed from the base of the PR and between ec34bf1 and 741ec10.

⛔ Files ignored due to path filters (3)

• frontend/public/journal-ai-homework.png is excluded by !**/*.png
• frontend/public/journal-founding.png is excluded by !**/*.png
• frontend/public/kofi-symbol.png is excluded by !**/*.png

📒 Files selected for processing (75)

• frontend/e2e/landing-graph.spec.ts
• frontend/e2e/public-seo.spec.ts
• frontend/eslint-suppressions.json
• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/companion/primitives.tsx
• frontend/src/components/landing-v5/ActGraph.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/ActTutor.tsx
• frontend/src/components/landing-v5/Closing.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/Faq.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/components/landing-v5/Gallery.tsx
• frontend/src/components/landing-v5/Hero.tsx
• frontend/src/components/landing-v5/IntroOverlay.tsx
• frontend/src/components/landing-v5/Journal.tsx
• frontend/src/components/landing-v5/Navbar.tsx
• frontend/src/components/landing-v5/galleryMinis.tsx
• frontend/src/components/landing-v5/lab/CalendarDemo.tsx
• frontend/src/components/landing-v5/lab/CardsDemo.tsx
• frontend/src/components/landing-v5/lab/GradesDemo.tsx
• frontend/src/components/landing-v5/lab/GuideDemo.tsx
• frontend/src/components/landing-v5/lab/LabShell.tsx
• frontend/src/components/landing-v5/lab/NotesDemo.tsx
• frontend/src/components/landing-v5/lab/QuizDemo.tsx
• frontend/src/components/landing-v5/lab/RoomsDemo.tsx
• frontend/src/components/landing-v5/lab/TutorDemo.tsx
• frontend/src/components/landing-v5/lab/index.tsx
• frontend/src/components/landing-v5/lab/labData.ts
• frontend/src/components/landing-v5/navTheme.ts
• frontend/src/components/landing/useLanding.ts
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx
• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/lib/landing/color.ts
• frontend/src/lib/landing/companionContent.ts
• frontend/src/lib/landing/content.ts
• frontend/src/lib/landing/course.ts
• frontend/src/lib/landing/dragClusters.ts
• frontend/src/lib/landing/engine/ambient.ts
• frontend/src/lib/landing/engine/dom.ts
• frontend/src/lib/landing/engine/flip.ts
• frontend/src/lib/landing/engine/graph.ts
• frontend/src/lib/landing/engine/graphView.ts
• frontend/src/lib/landing/engine/hero.ts
• frontend/src/lib/landing/engine/index.ts
• frontend/src/lib/landing/engine/marquee.ts
• frontend/src/lib/landing/engine/measure.ts
• frontend/src/lib/landing/engine/plant.ts
• frontend/src/lib/landing/engine/sim.ts
• frontend/src/lib/landing/hero3d/cardTexture.ts
• frontend/src/lib/landing/hero3d/index.ts

💤 Files with no reviewable changes (20)

• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/e2e/landing-graph.spec.ts
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

Use kebab-case keyframe names.

Stylelint reports every new camelCase keyframe identifier against keyframes-name-pattern. This leaves lint errors in the changed stylesheet. Rename the declarations to kebab case and update every matching animation or animation-name reference in the same change.

Also applies to: 2031-2033, 2082-2082, 2094-2096

🧰 Tools

🪛 Stylelint (17.14.0)

[error] 1957-1957: Expected keyframe name "s1Stem" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1958-1958: Expected keyframe name "s1LeafLo" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1964-1964: Expected keyframe name "s1LeafHi" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1970-1970: Expected keyframe name "s1Bud" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1971-1971: Expected keyframe name "s1Word" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1972-1972: Expected keyframe name "s1Rule" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1975-1975: Expected keyframe name "saplingBlob" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1976-1976: Expected keyframe name "introOrbit" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1977-1977: Expected keyframe name "floatIndicator" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1978-1978: Expected keyframe name "betaGlow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1979-1979: Expected keyframe name "nodeFloatA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1980-1980: Expected keyframe name "nodeFloatB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1983-1983: Expected keyframe name "popHold" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1984-1984: Expected keyframe name "chipSwapA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1985-1985: Expected keyframe name "chipSwapB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1986-1986: Expected keyframe name "flipLoop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1987-1987: Expected keyframe name "lineReveal" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1988-1988: Expected keyframe name "underSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1989-1989: Expected keyframe name "barGrow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1990-1990: Expected keyframe name "coverRise" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1991-1991: Expected keyframe name "ringDraw" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1992-1992: Expected keyframe name "gaugeFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1993-1993: Expected keyframe name "answerTick" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1994-1994: Expected keyframe name "waveBar" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1995-1995: Expected keyframe name "gaugeMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1996-1996: Expected keyframe name "coverMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1997-1997: Expected keyframe name "cursorMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1998-1998: Expected keyframe name "cardFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1999-1999: Expected keyframe name "scanSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2000-2000: Expected keyframe name "ocrBlink" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2001-2001: Expected keyframe name "panelFade" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2002-2002: Expected keyframe name "fillX" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2003-2003: Expected keyframe name "typingDot" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2004-2004: Expected keyframe name "ringPop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2005-2005: Expected keyframe name "cursorDrift" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/globals.css` around lines 1957 - 2005, Rename the camelCase
keyframe declarations in the affected stylesheet to kebab-case, including
symbols such as s1Stem, saplingBlob, introOrbit, popHold, and the additional
reported ranges. Update every corresponding animation and animation-name
reference to the new kebab-case identifiers, preserving all animation behavior.

Source: Linters/SAST tools

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

The overlay is a modal without dialog semantics or focus management.

The panel covers the viewport at zIndex: 80 and the caller locks body scroll. Three parts are missing:

• No role="dialog" and no aria-modal="true", so assistive technology does not announce a modal context.
• No accessible name on the container.
• No focus management. Focus stays on the gallery card behind the overlay, tabbing walks the page underneath, and closing does not return focus to the card that opened the panel.

Escape already closes the panel through useLanding.ts lines 272-276, so only the semantics and focus handling remain.

♿ Proposed direction

- <div style={{ position: 'fixed', inset: 0, zIndex: 80 }}>+ <div+ role="dialog"+ aria-modal="true"+ aria-label={`${g.kicker} demo`}+ style={{ position: 'fixed', inset: 0, zIndex: 80 }}+ >

Then move focus into the panel when it mounts, keep Tab inside it while it is open, and restore focus to the element captured by armFlip when it closes. frontend/src/lib/landing/engine/flip.ts already holds that element in FlipState.el.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 41 - 50,
Update the modal container identified by panelRef in FeatureLab to add
role="dialog", aria-modal="true", and an accessible name. On mount, move focus
into the panel; while open, trap Tab navigation within it so focus cannot reach
the page behind the overlay. Capture and restore focus to the triggering element
stored in FlipState.el when the panel closes, while preserving the existing
Escape close behavior.

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win

The gallery cards cannot be opened with a keyboard.

Opening the feature lab depends on the onClick delegation on the track div at lines 99-102. Card renders an <article> with no tabIndex, no role, and no key handler, and the track div has no key handler either. A keyboard user cannot reach or activate any card, so the feature lab is unreachable without a pointer. The doc comment at lines 14-15 states that the first copy is reachable by keyboard, which does not match the markup.

Make each non-ghost card an activatable control, keep the duplicate copies out of the tab order, and then correct the doc comment.

♿ Proposed fix

-function Card({ i, ghost }: { i: number; ghost: boolean }) {+function Card({ i, ghost, onOpen }: { i: number; ghost: boolean; onOpen: (i: number, el: HTMLElement | null) => void }) {
const c = CARDS[i];
return (
<article
data-tk={i}
aria-hidden={ghost || undefined}
+ role="button"+ tabIndex={ghost ? -1 : 0}+ aria-label={`Open ${c.kicker}`}+ onKeyDown={(e) => {+ if (e.key !== 'Enter' && e.key !== ' ') return;+ e.preventDefault();+ onOpen(i, e.currentTarget);+ }}
style={CARD}
className="ld-galcard"
>

- {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} />)}- {order.map((i) => <Card key={`b${i}`} i={i} ghost />)}+ {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} onOpen={onOpen} />)}+ {order.map((i) => <Card key={`b${i}`} i={i} ghost onOpen={onOpen} />)}

Add a visible focus style for .ld-galcard:focus-visible in globals.css.

Also applies to: 96-107

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 62 - 85, Update
Card so non-ghost cards are keyboard-focusable and activatable, using the
existing track click-delegation contract, while ghost duplicates remain excluded
from the tab order and accessibility tree. Add the corresponding keyboard
activation handling to the card or track using the existing feature-lab target
behavior, and correct the nearby doc comment to match the implemented
accessibility behavior. Add a visible .ld-galcard:focus-visible style in
globals.css.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

Handler timeouts are created without a ref, so they are never cancelled. Both demos schedule a state update from an event handler without storing the handle. The timeout cannot be cleared on unmount, and a second click cannot cancel a pending one. The other demos in this layer already hold each handle in a useRef and clear it in an unmount effect.

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44: store the 300 ms advance timeout in a ref, clear it before each new rating, and clear it on unmount; delete the returned cleanup, which React never calls.
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80: store the 700 ms extract and summarize timeouts in refs and clear them in the existing unmount effect beside saveT.

📍 Affects 2 files

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44 (this comment)
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 37 - 44,
Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout in the rate handler is
stored in a useRef, cleared before scheduling each new rating and during
unmount, and remove the ineffective returned cleanup. Update NotesDemo.tsx at
lines 57-80 so the 700 ms extract and summarize timeouts use refs and are
cleared in the existing unmount effect alongside saveT.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

RECENT[].pick values are not options of the exam select.

openRecent at line 53 sets exam to r.pick. 'Midterm 1 · Sep 30' is not in GUIDES['MA 242'].exams, and 'Quiz 2 · Oct 03' is not in GUIDES['CS 201'].exams. The controlled select at line 76 then falls back to displaying its first option while the guide heading at line 104 prints exam. The control and the heading disagree, and the user cannot select the displayed exam again.

Use an exam that exists in the course fixture, or add the recent exam to the option list when it is selected.

🔧 Proposed fix using existing fixture values

 const RECENT = [
- { i: 0, exam: 'MA 242 · Midterm 1', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Midterm 1 · Sep 30' },- { i: 1, exam: 'CS 201 · Quiz 2', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Quiz 2 · Oct 03' },+ { i: 0, exam: 'MA 242 · Final', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Final · Dec 12' },+ { i: 1, exam: 'CS 201 · Midterm 1', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Midterm 1 · Oct 17' },
];

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	constRECENT=[
	{i: 0,exam: 'MA 242 · Midterm 1',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Midterm 1 · Sep 30'},
	{i: 1,exam: 'CS 201 · Quiz 2',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Quiz 2 · Oct 03'},
	];
	constRECENT=[
	{i: 0,exam: 'MA 242 · Final',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Final · Dec 12'},
	{i: 1,exam: 'CS 201 · Midterm 1',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Midterm 1 · Oct 17'},
	];

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx` around lines 21 - 24,
Update the RECENT entries’ pick values to exactly match an existing exam option
in the corresponding GUIDES course fixture, preserving openRecent’s assignment
and keeping the select value consistent with the guide heading.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

role="radiogroup" has no radio children.

The container declares role="radiogroup", but each option is a plain <button>. A radiogroup requires children with role="radio" and aria-checked. Assistive technology cannot report which option is selected. Add the roles and state, or drop role="radiogroup" and expose selection with aria-pressed.

♿ Proposed fix

 <button
key={o.label}
type="button"
+ role="radio"+ aria-checked={isPicked}+ aria-disabled={reviewing}
onClick={() => { if (!reviewing) setPicked(o.label); }}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='#E3E0D5',bg='#FDFCF9',fg='#33443B',mark='',markCol='';
	if(reviewing&&correct){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';mark='CORRECT';markCol='#0C5638';}
	elseif(reviewing&&isPicked){bd='#b25855';bg='rgba(178,88,85,0.09)';fg='#9c4b48';mark='YOUR PICK';markCol='#9c4b48';}
	elseif(isPicked){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';}
	return(
	<button
	key={o.label}
	type="button"
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '#0E9E5A' : '#9AA5A0'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}
	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='`#E3E0D5`',bg='`#FDFCF9`',fg='`#33443B`',mark='',markCol='';
	if(reviewing&&correct){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';mark='CORRECT';markCol='`#0C5638`';}
	elseif(reviewing&&isPicked){bd='`#b25855`';bg='rgba(178,88,85,0.09)';fg='`#9c4b48`';mark='YOUR PICK';markCol='`#9c4b48`';}
	elseif(isPicked){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';}
	return(
	<button
	key={o.label}
	type="button"
	role="radio"
	aria-checked={isPicked}
	aria-disabled={reviewing}
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '`#0E9E5A`' : '`#9AA5A0`'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 104 - 124,
Fix the quiz option accessibility semantics in the q.options mapping: either
make each button a radio with role="radio" and aria-checked bound to isPicked
while retaining the radiogroup, or remove the radiogroup role and expose
isPicked through aria-pressed. Preserve the existing selection and reviewing
behavior in the option onClick handler.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

The hero canvas effect can start a loop that is never stopped.

import('@/lib/landing/engine/hero') resolves asynchronously. If the component unmounts before the promise resolves, the cleanup at line 222 runs while stopped is still null. The then callback then calls startHeroCanvas, which installs a requestAnimationFrame loop and a resize listener (see frontend/src/lib/landing/engine/hero.ts lines 83-87). Nothing cancels them afterwards, so the loop keeps drawing after navigation away from the landing page.

The WebGL effect at lines 227-244 already uses a cancelled flag. Apply the same pattern here.

🛠️ Proposed fix

 let stopped: { stop(): void } | null = null;
+ let cancelled = false;
// imported lazily so the module isn't pulled into the server bundle
import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas }) => {
+ if (cancelled) return;
stopped = startHeroCanvas(canvas, () => engine.mouse, () => engine.parallaxY);
});
- return () => stopped?.stop();+ return () => {+ cancelled = true;+ stopped?.stop();+ };

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	// imported lazily so the module isn't pulled into the server bundle
	import('@/lib/landing/engine/hero').then(({ startHeroCanvas })=>{
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>stopped?.stop();
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);
	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	letcancelled=false;
	// imported lazily so the module isn't pulled into the server bundle
	import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas })=>{
	if(cancelled)return;
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>{
	cancelled=true;
	stopped?.stop();
	};
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 213 - 224, Update
the hero canvas useEffect around startHeroCanvas to track a cancelled/unmounted
flag. Set it during cleanup, check it after the asynchronous hero module import
resolves before starting the canvas, and stop the returned controller when
appropriate so no animation loop or resize listener remains after unmount.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | 🏗️ Heavy lift

destroy() discards the re-homed clusters, so the field cannot be rebuilt.

ensureInit moves every cluster element out of its .drag-field and into the overlay (line 172), and it mutates the cluster's inline styles (lines 165-171). destroy() removes the shell through the queued cleanup, which deletes those cluster elements from the document. It does not put them back.

Two consequences:

1. A second ensureInit on the same DOM finds .drag-field elements with no [data-dragnode] children, returns false at line 232, and the field stays empty forever. This happens on any stop/start cycle, including the React StrictMode double-invoke of the engine effect in frontend/src/components/landing/useLanding.ts lines 162-210.
2. React still owns those cluster nodes, because DragField rendered them. React records the original parent for each child. Removing or reparenting the nodes outside React can make the later unmount removal fail.

Restore each cluster to its original parent and clear the inline styles that ensureInit set.

🛠️ Proposed fix: remember the original parent and restore it on destroy

 interface ClusterAnchor {
el: HTMLElement;
field: HTMLElement;
+ /** Where the cluster lived before it was re-homed into the overlay. */+ home: Node | null;+ before: Node | null;
/** The pinned act this field belongs to, if any — drives the scroll drift. */
sect: HTMLElement | null;
left: number;
top: number;
}

 anchors.push({
el: cl, field, sect,
+ home: cl.parentNode,+ before: cl.nextSibling,
left: b.left - fb.left,
top: b.top - fb.top,
});

 function destroy(): void {
+ // put the clusters back before the overlay goes away, otherwise React+ // still owns nodes that no longer exist and a later ensureInit finds+ // empty fields+ for (const a of anchors) {+ a.el.style.cssText = '';+ if (a.home) a.home.insertBefore(a.el, a.before);+ }
cleanups.forEach((fn) => fn());
cleanups.length = 0;
anchors.length = 0;
groups = null;
- if (overlay && overlay.parentElement) overlay.parentElement.removeChild(overlay);
overlay = null;
}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 423 - 430, Update the
initialization and destroy flow around ensureInit and destroy to retain each
cluster element’s original parent before moving it into the overlay. During
destroy, restore every cluster to that parent, clear the inline styles applied
by ensureInit, then remove the overlay and reset state so a later ensureInit can
rebuild the field without disrupting React-owned nodes.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/landing-v5/BetaModal.tsx`:
- Around line 52-70: Update the subscribed confirmation branch in BetaModal so
the rendered Close button receives focus after the form is replaced. Add a ref
to that button and focus it after the subscribed state commits, using the
component’s existing lifecycle pattern; preserve the current onClose behavior
and button styling.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ee1ca146-7600-423b-98c7-56bcec09e4e1

📥 Commits

Reviewing files that changed from the base of the PR and between 741ec10 and e506827.

📒 Files selected for processing (13)

• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/BetaModal.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/lib/landing/content.ts

💤 Files with no reviewable changes (2)

• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx

🚧 Files skipped from review as they are similar to previous changes (5)

• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/lib/landing/content.ts

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

Restore modal focus after the subscribed state replaces the form.

When subscribed becomes true, this branch unmounts the focused email input while Dialog remains open. Dialog only applies its initial focus when open changes. Focus can then leave the dialog and bypass its Tab trap. Move focus to the Close button after the confirmation state renders.

Proposed fix

-import { useId, useRef } from 'react';+import { useEffect, useId, useRef } from 'react';
...
const inputRef = useRef<HTMLInputElement>(null);
+ const confirmationCloseRef = useRef<HTMLButtonElement>(null);
const headingId = useId();
const valid = email.includes('@');
++ useEffect(() => {+ if (open && subscribed) confirmationCloseRef.current?.focus();+ }, [open, subscribed]);
...
<button
+ ref={confirmationCloseRef}
onClick={onClose}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '#12201A',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '#0C5638'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '#61726A',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '#0C5638',color: '#fff',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>
	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '`#12201A`',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '`#0C5638`'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '`#61726A`',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	ref={confirmationCloseRef}
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '`#0C5638`',color: '`#fff`',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/BetaModal.tsx` around lines 52 - 70,
Update the subscribed confirmation branch in BetaModal so the rendered Close
button receives focus after the form is replaced. Add a ref to that button and
focus it after the subscribed state commits, using the component’s existing
lifecycle pattern; preserve the current onClose behavior and button styling.

[Darkest-Teddy]

Ports Sapling Landing v5.dc.html (from docs/frontend-audit/Sapling landing page import (1).zip) into the Next.js frontend. v5 is now the landing page at /, replacing the previous marketing landing.

Supersedes #523. Based on feat/landing-v4-port, so its four commits ride along — v5 reuses that branch's scroll engine, course-graph model and editorial content. If v5 is the direction, #523 can be closed unmerged.

The title screen is a ground-up rebuild

Not a v4 tweak. Reading the source rather than the summary that accompanied the task turned up six divergences:

	Assumed	Actual v5 source
Wordmark	Archivo 800, ink #12201A	Playfair Display 600, #0C5638
Reveal	heroWipe clip-path	character scramble — heroWipe is defined, never referenced
Eyebrow	mono "GROW YOUR KNOWLEDGE"	Playfair "Grow Your Knowledge", title case, scrambled
Cascade	—	tagline leads (760ms), wordmark follows 260ms behind — v4 ran the reverse
Right bloom	mirrored green	teal rgba(43,140,150,0.2)
Panel rig	CSS perspective cards	three.js WebGL scene

Act III is likewise not the clipped 918×348 card track described in the brief — the source has a rotating triangular-prism carousel.

The v4 title screen was deleted rather than kept alongside. three/@types/three were already dependencies.

Four dead branches in the source

The design component carries a lot of machinery its own markup never reaches. Documented at each site:

1. const wantDark = false — the navbar's full two-theme colour table is built, then pinned to light. Wired live here, driven off the section under the viewport centre, as the brief calls for.
2. heroWipe / heroChar keyframes — defined, unreferenced. Not ported.
3. setHero0/1/2 + mode pills — exist only in renderVals(), so heroMode is pinned at 0 and only the panel scene can ever be seen. The constellation and growth-field shaders are unreachable; porting them would be porting dead code.
4. "Plant a concept" — plantVal, plantedCount, _plant(), a localStorage-backed grove and a canvas ref, none of it referenced. The CTA is heading + line + button.

Two engine bugs fixed

Both pre-existing in the v4 port, both invisible until a section actually had drag clusters:

• sim.ts reads a ring's halo via previousElementSibling and its caption via nextElementSibling; a <g> wrapper broke the adjacency and it threw on a null label.
• Clusters were anchored once, in page coordinates. The source captures each cluster's offset within its field, parks the overlay in a position:fixed shell, and re-applies anchor + field.rect every frame — which is what lets a cluster track its sticky section, and where the ≤150px drift inside a pinned act comes from.

Verified against the original served side by side: at 45% through act-tutor the source puts its 7 rings on screen at y≈121–608. This port now matches; before the fix it was 0 of 7, parked 8752px down.

Generated, not retyped

• galleryMinis.tsx — the 8 card miniatures, mechanically converted from the source's <article data-tk> blocks. Dense decorative animation where exact geometry and per-element delays are the effect. Regenerate rather than hand-edit.
• dragClusters.ts — the 8 course clusters, ~2KB of inline SVG each in the source, reduced to data + one component.
• companionContent.ts — 18 copy arrays lifted verbatim from the sibling pages.

Also in this PR

• The old marketing landing is retired. Deleting / orphaned marketing/graph/ (~95KB of passing tests for a surface no route mounts), marketing/surfaces/, FeatureBand, SurfaceBento, featureBands. HeroCard/SignInModal stay — the nav's Sign In opens the real OAuth modal.
• e2e/landing-graph.spec.ts goes with the component it pinned. public-seo.spec.ts's SSR guard is retargeted, not deleted: its failure mode (an ssr: false silently dropping the landing's copy from crawled HTML) outlived its selectors, and is sharper on a canvas/WebGL page. It deliberately does not assert the wordmark — that scrambles in client-side, so the h1's aria-label is checked instead. All 7 assertions verified against raw SSR output.
• The five companion pages the nav links to (/team, /wiki, /gallery, /news, /faq). Once v5 took /, those links 404'd. They use the warm paper palette deliberately — that is not a mistake to unify.

Known gaps

• Feature lab demo pane. The source mounts a separate FeatureLab design component per kind via <dc-import> — a distinct 75KB file the task's file list did not scope in. Layout, FLIP, rail, copy and close are faithful; the pane shows the card's miniature enlarged.
• Gallery tiles have no artwork — the import ships no screenshots.

Verification

• tsc --noEmit exit 0 · eslint exit 0 · next build exit 0, all 5 new routes prerendered static
• Unit suite 59 files / 423 tests passing
• Every section walked in a real browser at multiple scroll positions, no console errors; all 9 public routes return 200

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features
  • Introduced a redesigned landing experience with interactive knowledge graphs, tutoring modes, feature demos, gallery, journal, FAQ, and beta signup.
  • Added public FAQ, Gallery, News, Team, and Wiki pages with responsive navigation and searchable or filterable content.
  • Added interactive demonstrations for quizzes, flashcards, grades, calendars, notes, study rooms, guides, and tutoring.
• Documentation
  • Improved server-rendered landing-page checks for key accessible content and beta messaging.
• Refactor
  • Retired the previous marketing sections and legacy landing-page presentation.

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ebab108d-0405-4ae1-8d00-108ba83a0144

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Replaced the landing page with a component-based v5 experience, added interactive feature labs and companion pages, introduced shared animation engines and content data, and updated SSR coverage. Removed the former marketing graph, surface components, and related tests.

Changes

Landing v5 experience

Layer / File(s)	Summary
Landing content and data contracts frontend/src/lib/landing/*	Added landing content, course graph data, drag clusters, color utilities, and companion-page datasets.
Animation and interaction engines frontend/src/lib/landing/engine/*, frontend/src/lib/landing/hero3d/*	Added graph rendering, canvas effects, layout measurement, marquee and FLIP behavior, planting, drag simulation, and WebGL hero support.
Landing composition frontend/src/app/(public)/page.tsx, frontend/src/components/landing-v5/*, frontend/src/components/landing/useLanding.ts	Replaced the previous landing implementation with v5 hero, graph, ingest, tutor, gallery, FAQ, journal, CTA, navigation, modal, and lifecycle components.
Interactive feature labs frontend/src/components/landing-v5/lab/*	Added interactive quiz, flashcard, guide, grade, calendar, notes, rooms, and tutor demos with shared fixture data and controls.
Companion pages frontend/src/components/companion/*, frontend/src/app/(public)/{about,team,wiki,faq,gallery,news}/*	Added shared companion navigation and public About, Team, Wiki, FAQ, Gallery, and News routes.
Styling and SSR validation frontend/src/app/globals.css, frontend/e2e/public-seo.spec.ts, frontend/eslint-suppressions.json, frontend/src/lib/api.ts	Added scoped landing and companion styles, responsive animations, newsletter API wiring, and SSR checks for landing-page copy. Removed obsolete ESLint suppressions.

Estimated code review effort: 5 (Critical) | ~120 minutes

Possibly related PRs

• SaplingLearn/Sapling#513: Replaced the related knowledge-graph landing implementation and its supporting components.
• SaplingLearn/Sapling#63: Uses the same beta/newsletter signup flow implemented through BetaModal.
• SaplingLearn/Sapling#286: Also modifies the public landing page and shared styling layer.

Suggested reviewers:andresl230

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 36.59% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the primary change: porting Sapling Landing v5 into the landing page.
Description check	✅ Passed	The description explains the purpose, major changes, known gaps, related issue context, and verification results in substantial detail.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/landing-v5-port

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[supabase]

This pull request has been ignored for the connected project ybgqdonkoqftwrmweuyv because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[cloudflare-workers-and-pages]

Deploying with Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	frontend-staging	fc36068	Commit Preview URL Branch Preview URL	Aug 16 2026, 09:58 PM

[coderabbitai]

Actionable comments posted: 8

Note

Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.

🟡 Minor comments (14)

frontend/src/components/landing-v5/lab/NotesDemo.tsx-57-80 (1)

57-80: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

extract and summarize timeouts are untracked.

saveT is cleared on unmount, but the 700 ms timeouts at line 60 and line 71 are not stored and not cleared. If the lab panel closes within that window, the callbacks still run and set state on an unmounted component. Hold both handles in refs and clear them in the existing unmount effect.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` around lines 57 - 80,
Update the extract and summarize timeout flows to store their setTimeout handles
in dedicated refs, and clear both refs in the existing unmount effect alongside
saveT. Ensure the callbacks still perform their current state updates when they
complete, while preventing them from running after the component unmounts.

frontend/src/components/landing-v5/lab/CardsDemo.tsx-46-53 (1)

46-53: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The global space handler blocks button activation.

The keydown listener calls e.preventDefault() for every space press on window. A focused button then cannot be activated with space, including "Study again" at line 90. Skip the flip and the preventDefault call when the event target is an interactive element.

♿ Proposed fix

 const onKey = (e: KeyboardEvent) => {
+ const el = e.target as HTMLElement | null;+ if (el?.closest('button, input, textarea, select, [contenteditable]')) return;
if (e.key === ' ') { e.preventDefault(); flip(); }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 46 - 53,
Update the keydown handler in the useEffect to detect when the event target is
an interactive element, such as a button or link, and skip both flip() and
preventDefault() for those targets. Preserve the existing global space-to-flip
and rate-key behavior for non-interactive targets.

frontend/src/components/landing-v5/lab/NotesDemo.tsx-63-63 (1)

63-63: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The "no concepts" sentinel is counted as a linked concept.

When no matcher hits, concepts receives one placeholder entry. The footer at line 141 then renders "1 concepts linked to your MA 242 graph." The count is wrong and contradicts the placeholder. Keep concepts empty and track the empty result separately.

🔧 Proposed fix

+ const [ran, setRan] = useState(false);
@@
- setConcepts(found.length ? found : [{ name: 'No concepts found', tier: 'unexplored' }]);+ setConcepts(found);+ setRan(true);
setBusy(false);
@@
+ {ran && concepts.length === 0 && !busy && (+ <span style={{ fontSize: 12, color: '`#9AA5A0`' }}>No concepts found.</span>+ )}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` at line 63, Update the
concept-loading logic around the setConcepts call to keep concepts empty when
found has no matches instead of inserting a “No concepts found” sentinel; track
the empty-result state separately and use it for the empty-state display while
ensuring the footer count reflects only actual linked concepts.

frontend/src/lib/landing/engine/dom.ts-49-73 (1)

49-73: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Do not cache a zero-sized canvas measurement.

cv() caches w/h from clientWidth/clientHeight on the first call. The cache is dropped only by invalidateCanvas, which measure() calls only when the viewport dimensions change (see frontend/src/lib/landing/engine/measure.ts lines 98-104). If the first cv() call happens while the canvas is not laid out yet, or while its section is hidden, the cache stores 0 × 0. Every later frame then draws into a 0-pixel backing store, and the canvas stays blank until the viewport itself changes.

Skip the cache write when the measured size is zero, so the next frame re-reads it.

🐛 Proposed fix

 if (!c) {
const w = canvas.clientWidth;
const h = canvas.clientHeight;
const dpr = Math.min(window.devicePixelRatio || 1, 1.5);
let ctx = rec.__ctx as CanvasRenderingContext2D | undefined;
if (!ctx) {
ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
rec.__ctx = ctx;
}
c = { ctx, w, h, dpr };
- rec.__cv = c;+ // An unlaid-out or hidden canvas measures 0; don't freeze that in the+ // cache, or the next frames draw into a 0-pixel backing store.+ if (w > 0 && h > 0) rec.__cv = c;
const pw = Math.round(w * dpr);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/dom.ts` around lines 49 - 73, Update cv so
zero-sized measurements are not stored in the CanvasCache: when clientWidth or
clientHeight is zero, avoid assigning the newly measured cache to rec.__cv while
preserving the current context and sizing behavior. Ensure subsequent calls
re-read dimensions until both measurements are nonzero, while retaining normal
caching for valid sizes.

frontend/src/components/landing-v5/Journal.tsx-96-101 (1)

96-101: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Each post card links back to its own section.

href="#newsletter" points at the section that contains the card. The card presents as a link to an article, and activating it does nothing. This PR adds a /news route. Point each card at the article, or at /news until per-post routes exist.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 96 - 101, Update
the post card anchor in the Journal component to navigate to the new /news route
instead of the containing `#newsletter` section, while preserving the existing
card styling and behavior.

frontend/src/lib/landing/engine/sim.ts-184-203 (1)

184-203: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Label binding depends on an SVG sibling order that the markup does not guarantee.engine/sim.ts locates a node's caption through ring.nextElementSibling and casts it to SVGTextElement, while DragField renders that <text> only when a label exists for the node. When a label is missing, the sim binds the following node's glow <circle> and writes x/y onto it every frame, and ly becomes NaN.

• frontend/src/lib/landing/engine/sim.ts#L184-L203: check nextElementSibling.tagName === 'text' before the cast, type SimNode.label as SVGTextElement | null, and skip the label writes at lines 377-378 when it is null.
• frontend/src/components/landing-v5/DragField.tsx#L60-L92: alternatively, or in addition, always emit a <text> element per node so the documented glow → ring → label order holds for every node.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 184 - 203, Prevent
incorrect label binding in sim.ts by verifying ring.nextElementSibling is a text
element before assigning it, type SimNode.label as SVGTextElement | null, and
skip label position updates when it is null; update DragField.tsx to always
render a text element per node so the expected glow, ring, label order is
maintained.

frontend/src/components/landing-v5/Faq.tsx-66-71 (1)

66-71: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

"Read the full FAQ" links to its own section.

href="#faq" targets the section that contains the link, so the control does nothing. This PR adds a /faq route. Point the link there.

🔗 Proposed fix

- <a href="`#faq`" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>+ <a href="/faq" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 66 - 71, Update the
“Read the full FAQ” anchor in the FAQ component to navigate to the newly added
/faq route instead of the local `#faq` section, preserving its existing styling
and text.

frontend/src/components/landing-v5/Journal.tsx-184-199 (1)

184-199: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Set type="email" and guard the current submit flow.

The Journal input is an email address, so use type="email" for mobile keyboard and browser validation. The current actions.subscribe, at frontend/src/components/landing/useLanding.ts:624, only checks email.includes('@') and sets local subscribed state. If this should be a stub, make that intent explicit; otherwise wire onSubscribe to a newsletter endpoint before showing “You’re on the tree”.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 184 - 199,
Update the Journal email input in the landing component to use type="email" and
preserve the existing onSubscribe flow only as an explicit stub, or wire
onSubscribe to the newsletter endpoint and show the subscribed state only after
a successful submission. Locate the handler through actions.subscribe/useLanding
and ensure invalid emails cannot enter the success state.

frontend/src/components/landing-v5/Faq.tsx-79-116 (1)

79-116: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Closed answers stay in the accessibility tree, and the button has no aria-controls.

The collapsed panel uses maxHeight: 0, opacity: 0, and overflow: hidden. None of these remove the content from assistive technology, so a screen reader reads every answer even when the accordion is closed. The button also declares aria-expanded without naming the region it controls.

Add aria-controls with a stable id, and set aria-hidden on the panel while it is closed. aria-hidden does not disturb the max-height transition, because the content holds no focusable elements.

♿ Proposed fix

 <button
onClick={() => onToggle(open ? -1 : i)}
aria-expanded={open}
+ aria-controls={`faq-answer-${i}`}
style={{ width: '100%', background: 'none', border: 'none', cursor: 'pointer', padding: '22px 4px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 20, textAlign: 'left' }}
>

 <div
+ id={`faq-answer-${i}`}+ role="region"+ aria-hidden={!open}
style={{

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 79 - 116, Update the
FAQ accordion around the toggle button and answer panel to give each panel a
stable unique id, reference it from the button via aria-controls, and set
aria-hidden based on the open state so closed answers are excluded from the
accessibility tree. Preserve the existing visual transition and aria-expanded
behavior.

frontend/src/components/landing-v5/Navbar.tsx-199-235 (1)

199-235: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

role="menu" is applied to navigation disclosures whose children are not menu items. Both new navigation panels declare role="menu", but their children are plain button elements and next/link anchors. The ARIA menu pattern permits only menuitem, menuitemradio, and menuitemcheckbox children, so screen readers report both groups incorrectly. Both panels are page navigation, not application menus, so the correct fix in each place is to remove the role rather than to add menuitem roles.

• frontend/src/components/landing-v5/Navbar.tsx#L199-L235: remove role="menu" from the compact panel, and remove aria-haspopup="menu" from the trigger at line 120. Keep aria-expanded.
• frontend/src/components/landing-v5/Closing.tsx#L154-L182: remove role="menu" from the jump panel, and remove aria-haspopup="menu" from the pill at line 188. The enclosing nav with aria-label="Page sections" already carries the correct semantics.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Navbar.tsx` around lines 199 - 235, The
navigation disclosures use menu semantics with ordinary links and buttons;
remove those menu roles and triggers’ menu-haspopup attributes. In
frontend/src/components/landing-v5/Navbar.tsx lines 199-235, remove role="menu"
from the compact panel and remove aria-haspopup="menu" from its trigger while
retaining aria-expanded. In frontend/src/components/landing-v5/Closing.tsx lines
154-182, remove role="menu" from the jump panel and remove aria-haspopup="menu"
from the pill trigger; keep the enclosing navigation semantics and existing
expansion state.

frontend/src/app/(public)/page.tsx-115-116 (1)

115-116: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Clear the deferred openGal timers on unmount.

actions.openGal schedules actions.enterExplore / actions.openGal 260 ms later from onQuiz and onLearn. If the page unmounts before those timers fire, openGal runs after cleanup and writes document.body.style.overflow = 'hidden' after the landing cleanup reset that overflow. Keep the timer refs in useLanding so cleanup can call clearTimeout for them.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/page.tsx around lines 115 - 116, Update useLanding
and the onQuiz/onLearn handlers to store each 260 ms openGal timeout in refs,
rather than discarding the timer IDs. In the landing cleanup, clear both
deferred timers before resetting document.body overflow, preventing
actions.openGal from running after unmount.

frontend/src/components/landing-v5/ActTutor.tsx-93-109 (1)

93-109: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Expose the selected tutor mode, and keep the hidden pills out of the tab order.

Two gaps in this control group:

1. The pills are a mode selector, but the selected state is carried only by background and color. Assistive technology cannot report which mode is active. Add aria-pressed={tutorMode === i}.
2. The container starts at opacity: 0 with pointerEvents: 'none', and the engine fades it in later. The buttons stay focusable while invisible, so a keyboard user can focus a control that is not visible. Mirror the visual state in the tab order.

Also add type="button", which the other sections in this PR set consistently.

♻️ Proposed fix for the pill group

- {CAPTIONS.map(([tag], i) => (- <button- key={tag}- onClick={() => onSetMode(i)}+ {CAPTIONS.map(([tag], i) => (+ <button+ key={tag}+ type="button"+ aria-pressed={tutorMode === i}+ onClick={() => onSetMode(i)}

The engine already writes opacity on the container. Have it also clear visibility or the inert attribute so the pills leave the tab order until the handover:

- <div data-tutor-pills="1" style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>+ <div data-tutor-pills="1" inert style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActTutor.tsx` around lines 93 - 109,
Update the tutor pill group in ActTutor’s CAPTIONS map to add type="button" and
aria-pressed={tutorMode === i} to each button. Keep the hidden container’s
buttons out of the tab order while the engine-controlled opacity is zero by
mirroring its hidden state with inert or an equivalent visibility-based
mechanism, and ensure the existing handover clears that state when the pills
become visible.

frontend/src/components/landing-v5/ActGraph.tsx-333-340 (1)

333-340: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Add an Escape key exit for explore mode.

Explore mode covers the act and closes the navbar, but useLanding only handles Escape for gallery and jump controls. If explore mode is active, call onExitExplore from the key handler so keyboard-only users can leave the mode safely.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActGraph.tsx` around lines 333 - 340,
Update the existing keyboard handler in useLanding to detect Escape while
explore mode is active and call onExitExplore. Preserve the current Escape
behavior for gallery and jump controls, and ensure the explore-mode exit path is
available to keyboard-only users.

frontend/src/lib/landing/hero3d/index.ts-175-189 (1)

175-189: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Release the WebGL context in stop().

stop() already disposes three.js resources and cancels the render loop. WebGLRenderer.dispose() does not release the WebGL context, and this rig creates a new context on its canvas each mount. Add renderer.forceContextLoss() after renderer.dispose() so repeated navigation can reclaim the browser contexts sooner.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/hero3d/index.ts` around lines 175 - 189, Update the
returned stop() method to call renderer.forceContextLoss() immediately after
renderer.dispose(), ensuring the WebGL context is released during cleanup while
preserving the existing resource disposal and animation cancellation behavior.

🧹 Nitpick comments (14)

frontend/src/components/landing-v5/lab/LabShell.tsx (1)

51-84: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Segmented is unused; two demos duplicate it inline.

The comment states that the tutor and calendar demos use this control. They do not import it. CalendarDemo.tsx lines 61-76 and TutorDemo.tsx lines 65-80 each contain an inline copy of the same markup and style logic. Use Segmented in both demos, or delete it and correct the comment.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx` around lines 51 - 84,
Resolve the unused Segmented component by replacing the duplicated inline
segmented-control markup in CalendarDemo and TutorDemo with the shared Segmented
component, passing each demo’s options, current value, and change handler.
Preserve the existing labels, selection behavior, and styling, and keep the
component’s public API unchanged.

frontend/src/components/landing-v5/lab/QuizDemo.tsx (1)

33-35: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Difficulty badge changes while the same question is shown.

submit updates streak before it sets phase to review. qi does not change. The badge therefore flips from MEDIUM to HARD or EASY while the user still reads question 1 and its explanation. Derive the badge from the difficulty that applied when the question was served, for example from answers.length captured at question start.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 33 - 35,
Update the difficulty derivation in QuizDemo so the badge remains tied to the
difficulty assigned when the current question was served, rather than
recomputing from the mutable streak during review. Capture or derive the
question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.

frontend/src/components/landing-v5/lab/GradesDemo.tsx (1)

62-65: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Row percentage is unclamped while the weighted grade is clamped.

Line 25 clamps the score into [0, r.possible]. Line 64 uses the unclamped raw. If the user types 70 in a 50-point row, the row shows 140% while the category bar and the overall grade cap at 100%. Apply the same clamp in both places.

♻️ Proposed fix

 const raw = parseFloat(earned[i]);
- const pct = isNaN(raw) ? null : Math.round((raw / r.possible) * 100);+ const pct = isNaN(raw) ? null : Math.round((Math.max(0, Math.min(raw, r.possible)) / r.possible) * 100);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx` around lines 62 - 65,
Clamp the parsed score used in the row percentage calculation within the same
[0, r.possible] bounds already applied to the weighted grade. Update the
percentage logic in the GB_ROWS map callback, preserving the existing null
handling and color thresholds while ensuring values above or below the row
limits cannot produce percentages outside 0–100.

frontend/src/components/landing-v5/lab/labData.ts (1)

13-13: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Remove duplicated TIER from labData.ts.

labData.ts exports TIER, but the lab demos import LAB_TIER and render with labData.ts content. The four hex values and keys match LAB_TIER, so two copies of this swatch set can drift. Drop TIER from labData.ts and keep using LAB_TIER.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/labData.ts` at line 13, Remove the
exported TIER constant from labData.ts, since it duplicates the matching
LAB_TIER swatch set. Update any references in labData.ts to use LAB_TIER
instead, preserving the existing keys and color values.

frontend/src/lib/landing/engine/graph.ts (1)

122-127: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Replace the random-comparator shuffle with Fisher–Yates.

sort(() => Math.random() - 0.5) uses an inconsistent comparator. The resulting permutation is biased and depends on the engine's sort implementation, so many nodes keep positions close to their original index. That works against the documented intent of an organic reveal order.

♻️ Proposed fix

- // Shuffle the reveal order so the graph assembles organically.- const order = nodes.map((_, i) => i).sort(() => Math.random() - 0.5);+ // Shuffle the reveal order so the graph assembles organically.+ const order = nodes.map((_, i) => i);+ for (let i = order.length - 1; i > 0; i--) {+ const j = Math.floor(Math.random() * (i + 1));+ [order[i], order[j]] = [order[j], order[i]];+ }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/graph.ts` around lines 122 - 127, Replace the
random-comparator sort in the reveal-order logic with an unbiased Fisher–Yates
shuffle of the index array. Keep the existing spawnAt and colorAt calculations
and node ordering behavior after shuffling unchanged.

frontend/src/app/(public)/wiki/page.tsx (1)

31-39: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Make lede optional so the privacy section does not render an empty paragraph.

The privacy section passes lede="". Section always renders the <p>, so the page emits an empty paragraph with 0 0 20px margins. That adds dead space and an empty node in the accessibility tree.

♻️ Proposed fix

-function Section({ id, title, lede, children }: { id: string; title: string; lede: string; children?: React.ReactNode }) {+function Section({ id, title, lede, children }: { id: string; title: string; lede?: string; children?: React.ReactNode }) {
return (
<section style={{ marginTop: 56, scrollMarginTop: 110 }} id={id}>
<SectionHeading>{title}</SectionHeading>
- <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ {lede ? (+ <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ ) : null}
{children}

Then drop lede="" at line 147.

Also applies to: 147-149

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/wiki/page.tsx around lines 31 - 39, Make the lede
prop optional in Section and render the paragraph only when lede has content, so
the privacy section does not produce an empty element or spacing. Remove the
lede="" argument from the privacy Section usage while preserving existing lede
rendering for other sections.

frontend/src/lib/landing/engine/marquee.ts (1)

136-144: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick win

Avoid the per-frame layout read in update().

update() runs from the engine tick on every frame the gallery is on screen. Line 136 reads wrap.clientWidth on each of those frames, and line 156 writes track.style.transform. The write dirties style, so the next frame's read forces a style recalculation and layout. That contradicts the engine invariant documented in frontend/src/lib/landing/engine/index.ts lines 4-8, which states the tick never reads layout.

Observe the container width instead, and re-measure only when it changes.

♻️ Proposed approach

- // measure one card set only when the container width changed- if (!m.setW || m.measuredW !== wrap.clientWidth) {+ // measure one card set only when a ResizeObserver marked it stale+ if (!m.setW) {

Then in bind, mark the state stale from an observer and add its teardown to cleanups:

constro=newResizeObserver(()=>{m.setW=0;});if(wrap)ro.observe(wrap);cleanups.push(()=>ro.disconnect());

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/marquee.ts` around lines 136 - 144, Remove
the per-frame wrap.clientWidth read from update() and move width-change
detection to bind using a ResizeObserver on wrap. Have the observer mark m.setW
stale, register ro.disconnect in cleanups, and preserve the existing measurement
logic when update() sees stale state without reading layout every tick.

frontend/src/components/landing-v5/FeatureLab.tsx (1)

94-119: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Mark the active rail button for assistive technology.

on changes only the colors. Add aria-current="true" on the selected button so the active tool is conveyed without color.

♿ Proposed change

 data-rail={i}
type="button"
+ aria-current={on || undefined}
onClick={() => onPick(i)}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 94 - 119, Add
an aria-current="true" attribute to the selected rail button rendered in the
GAL.map callback, using the existing on condition so assistive technology
identifies the active tool without relying on color.

frontend/src/components/landing-v5/Gallery.tsx (1)

71-73: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

The wrapper duplicates the miniature's own container.

The <div> here sets height: 166, borderRadius: 13, overflow: hidden, the same background, and the same border. Every entry in GALLERY_MINIS opens with a <div> carrying that identical style set (see galleryMinis.tsx line 16). One of the two layers is redundant. Because the minis are generated, drop the wrapper here rather than editing the generated file.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 71 - 73, Remove
the redundant wrapper div around GALLERY_MINIS[i] in Gallery, rendering the
miniature directly while preserving its existing placement and aria-hidden
behavior. Do not modify the generated galleryMinis.tsx entries.

frontend/src/lib/landing/engine/flip.ts (1)

24-25: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

FlipState.ran is never read.

armFlip sets ran = false and flipClose resets it, but no code in this module or in frontend/src/components/landing/useLanding.ts reads it. The consumer tracks the same guard with its own flipRan ref (see useLanding.ts lines 158, 552, 574-575). Two guards for one invariant can drift. Either remove ran from FlipState or make flipOpen own the guard and delete flipRan from the hook.

Also applies to: 78-78

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/flip.ts` around lines 24 - 25, Remove the
unused FlipState.ran field and its assignments in armFlip and flipClose, since
useLanding already owns this guard through flipRan. Keep the existing
flipRan-based behavior unchanged and avoid maintaining duplicate state for the
same invariant.

frontend/src/lib/landing/engine/hero.ts (1)

99-136: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Points behind the camera reach the link pass with a degenerate scale.

sc = FL / (FL + z) is computed for every node. Rotation mixes ox into z, and ox reaches about ±740 while oz reaches about ±340, so z can pass -1000. At z === -FL the divide produces Infinity, and below -FL it produces a negative scale.

The point pass guards this at line 139 with p.z > -FL. The link pass at lines 116-136 does not. A node with Infinity scale gives reach === Infinity, so the break at line 122 never fires for that row and the inner loop degrades to a full scan.

Filter the projection once, so both passes share the guard.

♻️ Proposed change

 const proj = nodes
.map((n) => {
...
})
+ // drop anything at or behind the projection plane: `sc` is not finite+ // there, which breaks both the link reach and the point radius+ .filter((p) => p.z > -FL)
.sort((a, b) => b.z - a.z);

The p.z > -FL test at line 139 then becomes redundant and can go.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/hero.ts` around lines 99 - 136, Filter the
projected nodes immediately after the `proj` mapping so only entries with `p.z >
-FL` remain before sorting and running the link pass. Reuse this filtered
collection for both link rendering and the later point-rendering pass, then
remove the now-redundant `p.z > -FL` guard in the point pass.

frontend/src/components/landing/useLanding.ts (1)

378-392: 🚀 Performance & Scalability | 🔵 Trivial | 💤 Low value

The reveal scan polls every 900ms for the page lifetime.

scan() re-queries [data-reveal] across the whole landing root twice per second, forever, to catch elements that mount later. A MutationObserver on root would react to the same additions without the standing timer. This is a nice-to-have; the current cost is one querySelectorAll per tick.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 378 - 392,
Replace the lifetime polling interval in the reveal setup around scan with a
MutationObserver watching root for added elements, invoking scan when matching
content mounts later. Keep the initial scan, existing seen/io behavior, and
cleanup, but disconnect the mutation observer instead of clearing an interval.

frontend/src/lib/landing/engine/sim.ts (1)

282-299: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

up ignores pointerId, and the window listeners are registered once per cluster.

Two small points in bindDrag:

• up does not compare e.pointerId with f.drag.id. A second pointer that lifts cancels the active drag. onMove does compare the id, so the handlers are inconsistent.
• onMove and up are added to window inside the per-cluster loop. With N clusters in one group, every window pointer event runs N identical handlers. Bind the window listeners once per group instead.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 282 - 299, Update
bindDrag so up ignores pointer events whose pointerId does not match f.drag.id,
matching onMove’s active-pointer validation. Move the window-level pointermove,
pointerup, and pointercancel listener registration out of the per-cluster
binding loop and register each once per group, while keeping the per-SVG
listeners on the individual cluster SVG.

frontend/src/components/landing-v5/Closing.tsx (1)

75-92: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Share the companion-page list, and make the footer icon decorative.

Two points:

1. FOOTER_LINKS repeats PAGES in Navbar.tsx (lines 26-33) with the same six label and href pairs. Both files are new in this PR, so the two lists will drift the first time a companion page is added or renamed. Export one list and import it in both places.
2. Line 91 sets alt="Sapling" on the icon, and the adjacent text already reads "Sapling · © 2026". A screen reader announces the name twice. Navbar.tsx line 100 already uses alt="" for the same icon beside the same wordmark.

♻️ Proposed fix

- <Image src="/sapling-icon.svg" alt="Sapling" width={20} height={20} />+ <Image src="/sapling-icon.svg" alt="" width={20} height={20} />

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Closing.tsx` around lines 75 - 92, Share
the companion-page link list currently duplicated as FOOTER_LINKS in SiteFooter
and PAGES in Navbar by exporting one canonical list and importing it in both
components, preserving all six label/href pairs. Update the footer Image in
SiteFooter to use an empty alt value so the adjacent Sapling text is announced
only once.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/app/globals.css`:
- Around line 1957-2005: Rename the camelCase keyframe declarations in the
affected stylesheet to kebab-case, including symbols such as s1Stem,
saplingBlob, introOrbit, popHold, and the additional reported ranges. Update
every corresponding animation and animation-name reference to the new kebab-case
identifiers, preserving all animation behavior.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 41-50: Update the modal container identified by panelRef in
FeatureLab to add role="dialog", aria-modal="true", and an accessible name. On
mount, move focus into the panel; while open, trap Tab navigation within it so
focus cannot reach the page behind the overlay. Capture and restore focus to the
triggering element stored in FlipState.el when the panel closes, while
preserving the existing Escape close behavior.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 62-85: Update Card so non-ghost cards are keyboard-focusable and
activatable, using the existing track click-delegation contract, while ghost
duplicates remain excluded from the tab order and accessibility tree. Add the
corresponding keyboard activation handling to the card or track using the
existing feature-lab target behavior, and correct the nearby doc comment to
match the implemented accessibility behavior. Add a visible
.ld-galcard:focus-visible style in globals.css.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 37-44: Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout
in the rate handler is stored in a useRef, cleared before scheduling each new
rating and during unmount, and remove the ineffective returned cleanup. Update
NotesDemo.tsx at lines 57-80 so the 700 ms extract and summarize timeouts use
refs and are cleared in the existing unmount effect alongside saveT.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx`:
- Around line 21-24: Update the RECENT entries’ pick values to exactly match an
existing exam option in the corresponding GUIDES course fixture, preserving
openRecent’s assignment and keeping the select value consistent with the guide
heading.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 104-124: Fix the quiz option accessibility semantics in the
q.options mapping: either make each button a radio with role="radio" and
aria-checked bound to isPicked while retaining the radiogroup, or remove the
radiogroup role and expose isPicked through aria-pressed. Preserve the existing
selection and reviewing behavior in the option onClick handler.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 213-224: Update the hero canvas useEffect around startHeroCanvas
to track a cancelled/unmounted flag. Set it during cleanup, check it after the
asynchronous hero module import resolves before starting the canvas, and stop
the returned controller when appropriate so no animation loop or resize listener
remains after unmount.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 423-430: Update the initialization and destroy flow around
ensureInit and destroy to retain each cluster element’s original parent before
moving it into the overlay. During destroy, restore every cluster to that
parent, clear the inline styles applied by ensureInit, then remove the overlay
and reset state so a later ensureInit can rebuild the field without disrupting
React-owned nodes.
---
Minor comments:
In `@frontend/src/app/`(public)/page.tsx:
- Around line 115-116: Update useLanding and the onQuiz/onLearn handlers to
store each 260 ms openGal timeout in refs, rather than discarding the timer IDs.
In the landing cleanup, clear both deferred timers before resetting
document.body overflow, preventing actions.openGal from running after unmount.
In `@frontend/src/components/landing-v5/ActGraph.tsx`:
- Around line 333-340: Update the existing keyboard handler in useLanding to
detect Escape while explore mode is active and call onExitExplore. Preserve the
current Escape behavior for gallery and jump controls, and ensure the
explore-mode exit path is available to keyboard-only users.
In `@frontend/src/components/landing-v5/ActTutor.tsx`:
- Around line 93-109: Update the tutor pill group in ActTutor’s CAPTIONS map to
add type="button" and aria-pressed={tutorMode === i} to each button. Keep the
hidden container’s buttons out of the tab order while the engine-controlled
opacity is zero by mirroring its hidden state with inert or an equivalent
visibility-based mechanism, and ensure the existing handover clears that state
when the pills become visible.
In `@frontend/src/components/landing-v5/Faq.tsx`:
- Around line 66-71: Update the “Read the full FAQ” anchor in the FAQ component
to navigate to the newly added /faq route instead of the local `#faq` section,
preserving its existing styling and text.
- Around line 79-116: Update the FAQ accordion around the toggle button and
answer panel to give each panel a stable unique id, reference it from the button
via aria-controls, and set aria-hidden based on the open state so closed answers
are excluded from the accessibility tree. Preserve the existing visual
transition and aria-expanded behavior.
In `@frontend/src/components/landing-v5/Journal.tsx`:
- Around line 96-101: Update the post card anchor in the Journal component to
navigate to the new /news route instead of the containing `#newsletter` section,
while preserving the existing card styling and behavior.
- Around line 184-199: Update the Journal email input in the landing component
to use type="email" and preserve the existing onSubscribe flow only as an
explicit stub, or wire onSubscribe to the newsletter endpoint and show the
subscribed state only after a successful submission. Locate the handler through
actions.subscribe/useLanding and ensure invalid emails cannot enter the success
state.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 46-53: Update the keydown handler in the useEffect to detect when
the event target is an interactive element, such as a button or link, and skip
both flip() and preventDefault() for those targets. Preserve the existing global
space-to-flip and rate-key behavior for non-interactive targets.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx`:
- Around line 57-80: Update the extract and summarize timeout flows to store
their setTimeout handles in dedicated refs, and clear both refs in the existing
unmount effect alongside saveT. Ensure the callbacks still perform their current
state updates when they complete, while preventing them from running after the
component unmounts.
- Line 63: Update the concept-loading logic around the setConcepts call to keep
concepts empty when found has no matches instead of inserting a “No concepts
found” sentinel; track the empty-result state separately and use it for the
empty-state display while ensuring the footer count reflects only actual linked
concepts.
In `@frontend/src/components/landing-v5/Navbar.tsx`:
- Around line 199-235: The navigation disclosures use menu semantics with
ordinary links and buttons; remove those menu roles and triggers’ menu-haspopup
attributes. In frontend/src/components/landing-v5/Navbar.tsx lines 199-235,
remove role="menu" from the compact panel and remove aria-haspopup="menu" from
its trigger while retaining aria-expanded. In
frontend/src/components/landing-v5/Closing.tsx lines 154-182, remove role="menu"
from the jump panel and remove aria-haspopup="menu" from the pill trigger; keep
the enclosing navigation semantics and existing expansion state.
In `@frontend/src/lib/landing/engine/dom.ts`:
- Around line 49-73: Update cv so zero-sized measurements are not stored in the
CanvasCache: when clientWidth or clientHeight is zero, avoid assigning the newly
measured cache to rec.__cv while preserving the current context and sizing
behavior. Ensure subsequent calls re-read dimensions until both measurements are
nonzero, while retaining normal caching for valid sizes.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 184-203: Prevent incorrect label binding in sim.ts by verifying
ring.nextElementSibling is a text element before assigning it, type
SimNode.label as SVGTextElement | null, and skip label position updates when it
is null; update DragField.tsx to always render a text element per node so the
expected glow, ring, label order is maintained.
In `@frontend/src/lib/landing/hero3d/index.ts`:
- Around line 175-189: Update the returned stop() method to call
renderer.forceContextLoss() immediately after renderer.dispose(), ensuring the
WebGL context is released during cleanup while preserving the existing resource
disposal and animation cancellation behavior.
---
Nitpick comments:
In `@frontend/src/app/`(public)/wiki/page.tsx:
- Around line 31-39: Make the lede prop optional in Section and render the
paragraph only when lede has content, so the privacy section does not produce an
empty element or spacing. Remove the lede="" argument from the privacy Section
usage while preserving existing lede rendering for other sections.
In `@frontend/src/components/landing-v5/Closing.tsx`:
- Around line 75-92: Share the companion-page link list currently duplicated as
FOOTER_LINKS in SiteFooter and PAGES in Navbar by exporting one canonical list
and importing it in both components, preserving all six label/href pairs. Update
the footer Image in SiteFooter to use an empty alt value so the adjacent Sapling
text is announced only once.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 94-119: Add an aria-current="true" attribute to the selected rail
button rendered in the GAL.map callback, using the existing on condition so
assistive technology identifies the active tool without relying on color.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 71-73: Remove the redundant wrapper div around GALLERY_MINIS[i] in
Gallery, rendering the miniature directly while preserving its existing
placement and aria-hidden behavior. Do not modify the generated galleryMinis.tsx
entries.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx`:
- Around line 62-65: Clamp the parsed score used in the row percentage
calculation within the same [0, r.possible] bounds already applied to the
weighted grade. Update the percentage logic in the GB_ROWS map callback,
preserving the existing null handling and color thresholds while ensuring values
above or below the row limits cannot produce percentages outside 0–100.
In `@frontend/src/components/landing-v5/lab/labData.ts`:
- Line 13: Remove the exported TIER constant from labData.ts, since it
duplicates the matching LAB_TIER swatch set. Update any references in labData.ts
to use LAB_TIER instead, preserving the existing keys and color values.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx`:
- Around line 51-84: Resolve the unused Segmented component by replacing the
duplicated inline segmented-control markup in CalendarDemo and TutorDemo with
the shared Segmented component, passing each demo’s options, current value, and
change handler. Preserve the existing labels, selection behavior, and styling,
and keep the component’s public API unchanged.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 33-35: Update the difficulty derivation in QuizDemo so the badge
remains tied to the difficulty assigned when the current question was served,
rather than recomputing from the mutable streak during review. Capture or derive
the question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 378-392: Replace the lifetime polling interval in the reveal setup
around scan with a MutationObserver watching root for added elements, invoking
scan when matching content mounts later. Keep the initial scan, existing seen/io
behavior, and cleanup, but disconnect the mutation observer instead of clearing
an interval.
In `@frontend/src/lib/landing/engine/flip.ts`:
- Around line 24-25: Remove the unused FlipState.ran field and its assignments
in armFlip and flipClose, since useLanding already owns this guard through
flipRan. Keep the existing flipRan-based behavior unchanged and avoid
maintaining duplicate state for the same invariant.
In `@frontend/src/lib/landing/engine/graph.ts`:
- Around line 122-127: Replace the random-comparator sort in the reveal-order
logic with an unbiased Fisher–Yates shuffle of the index array. Keep the
existing spawnAt and colorAt calculations and node ordering behavior after
shuffling unchanged.
In `@frontend/src/lib/landing/engine/hero.ts`:
- Around line 99-136: Filter the projected nodes immediately after the `proj`
mapping so only entries with `p.z > -FL` remain before sorting and running the
link pass. Reuse this filtered collection for both link rendering and the later
point-rendering pass, then remove the now-redundant `p.z > -FL` guard in the
point pass.
In `@frontend/src/lib/landing/engine/marquee.ts`:
- Around line 136-144: Remove the per-frame wrap.clientWidth read from update()
and move width-change detection to bind using a ResizeObserver on wrap. Have the
observer mark m.setW stale, register ro.disconnect in cleanups, and preserve the
existing measurement logic when update() sees stale state without reading layout
every tick.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 282-299: Update bindDrag so up ignores pointer events whose
pointerId does not match f.drag.id, matching onMove’s active-pointer validation.
Move the window-level pointermove, pointerup, and pointercancel listener
registration out of the per-cluster binding loop and register each once per
group, while keeping the per-SVG listeners on the individual cluster SVG.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 865084a7-2f4d-472c-accd-6f67530e2a35

📥 Commits

Reviewing files that changed from the base of the PR and between ec34bf1 and 741ec10.

⛔ Files ignored due to path filters (3)

• frontend/public/journal-ai-homework.png is excluded by !**/*.png
• frontend/public/journal-founding.png is excluded by !**/*.png
• frontend/public/kofi-symbol.png is excluded by !**/*.png

📒 Files selected for processing (75)

• frontend/e2e/landing-graph.spec.ts
• frontend/e2e/public-seo.spec.ts
• frontend/eslint-suppressions.json
• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/companion/primitives.tsx
• frontend/src/components/landing-v5/ActGraph.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/ActTutor.tsx
• frontend/src/components/landing-v5/Closing.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/Faq.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/components/landing-v5/Gallery.tsx
• frontend/src/components/landing-v5/Hero.tsx
• frontend/src/components/landing-v5/IntroOverlay.tsx
• frontend/src/components/landing-v5/Journal.tsx
• frontend/src/components/landing-v5/Navbar.tsx
• frontend/src/components/landing-v5/galleryMinis.tsx
• frontend/src/components/landing-v5/lab/CalendarDemo.tsx
• frontend/src/components/landing-v5/lab/CardsDemo.tsx
• frontend/src/components/landing-v5/lab/GradesDemo.tsx
• frontend/src/components/landing-v5/lab/GuideDemo.tsx
• frontend/src/components/landing-v5/lab/LabShell.tsx
• frontend/src/components/landing-v5/lab/NotesDemo.tsx
• frontend/src/components/landing-v5/lab/QuizDemo.tsx
• frontend/src/components/landing-v5/lab/RoomsDemo.tsx
• frontend/src/components/landing-v5/lab/TutorDemo.tsx
• frontend/src/components/landing-v5/lab/index.tsx
• frontend/src/components/landing-v5/lab/labData.ts
• frontend/src/components/landing-v5/navTheme.ts
• frontend/src/components/landing/useLanding.ts
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx
• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/lib/landing/color.ts
• frontend/src/lib/landing/companionContent.ts
• frontend/src/lib/landing/content.ts
• frontend/src/lib/landing/course.ts
• frontend/src/lib/landing/dragClusters.ts
• frontend/src/lib/landing/engine/ambient.ts
• frontend/src/lib/landing/engine/dom.ts
• frontend/src/lib/landing/engine/flip.ts
• frontend/src/lib/landing/engine/graph.ts
• frontend/src/lib/landing/engine/graphView.ts
• frontend/src/lib/landing/engine/hero.ts
• frontend/src/lib/landing/engine/index.ts
• frontend/src/lib/landing/engine/marquee.ts
• frontend/src/lib/landing/engine/measure.ts
• frontend/src/lib/landing/engine/plant.ts
• frontend/src/lib/landing/engine/sim.ts
• frontend/src/lib/landing/hero3d/cardTexture.ts
• frontend/src/lib/landing/hero3d/index.ts

💤 Files with no reviewable changes (20)

• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/e2e/landing-graph.spec.ts
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

Use kebab-case keyframe names.

Stylelint reports every new camelCase keyframe identifier against keyframes-name-pattern. This leaves lint errors in the changed stylesheet. Rename the declarations to kebab case and update every matching animation or animation-name reference in the same change.

Also applies to: 2031-2033, 2082-2082, 2094-2096

🧰 Tools

🪛 Stylelint (17.14.0)

[error] 1957-1957: Expected keyframe name "s1Stem" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1958-1958: Expected keyframe name "s1LeafLo" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1964-1964: Expected keyframe name "s1LeafHi" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1970-1970: Expected keyframe name "s1Bud" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1971-1971: Expected keyframe name "s1Word" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1972-1972: Expected keyframe name "s1Rule" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1975-1975: Expected keyframe name "saplingBlob" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1976-1976: Expected keyframe name "introOrbit" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1977-1977: Expected keyframe name "floatIndicator" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1978-1978: Expected keyframe name "betaGlow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1979-1979: Expected keyframe name "nodeFloatA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1980-1980: Expected keyframe name "nodeFloatB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1983-1983: Expected keyframe name "popHold" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1984-1984: Expected keyframe name "chipSwapA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1985-1985: Expected keyframe name "chipSwapB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1986-1986: Expected keyframe name "flipLoop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1987-1987: Expected keyframe name "lineReveal" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1988-1988: Expected keyframe name "underSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1989-1989: Expected keyframe name "barGrow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1990-1990: Expected keyframe name "coverRise" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1991-1991: Expected keyframe name "ringDraw" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1992-1992: Expected keyframe name "gaugeFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1993-1993: Expected keyframe name "answerTick" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1994-1994: Expected keyframe name "waveBar" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1995-1995: Expected keyframe name "gaugeMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1996-1996: Expected keyframe name "coverMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1997-1997: Expected keyframe name "cursorMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1998-1998: Expected keyframe name "cardFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1999-1999: Expected keyframe name "scanSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2000-2000: Expected keyframe name "ocrBlink" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2001-2001: Expected keyframe name "panelFade" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2002-2002: Expected keyframe name "fillX" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2003-2003: Expected keyframe name "typingDot" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2004-2004: Expected keyframe name "ringPop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2005-2005: Expected keyframe name "cursorDrift" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/globals.css` around lines 1957 - 2005, Rename the camelCase
keyframe declarations in the affected stylesheet to kebab-case, including
symbols such as s1Stem, saplingBlob, introOrbit, popHold, and the additional
reported ranges. Update every corresponding animation and animation-name
reference to the new kebab-case identifiers, preserving all animation behavior.

Source: Linters/SAST tools

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

The overlay is a modal without dialog semantics or focus management.

The panel covers the viewport at zIndex: 80 and the caller locks body scroll. Three parts are missing:

• No role="dialog" and no aria-modal="true", so assistive technology does not announce a modal context.
• No accessible name on the container.
• No focus management. Focus stays on the gallery card behind the overlay, tabbing walks the page underneath, and closing does not return focus to the card that opened the panel.

Escape already closes the panel through useLanding.ts lines 272-276, so only the semantics and focus handling remain.

♿ Proposed direction

- <div style={{ position: 'fixed', inset: 0, zIndex: 80 }}>+ <div+ role="dialog"+ aria-modal="true"+ aria-label={`${g.kicker} demo`}+ style={{ position: 'fixed', inset: 0, zIndex: 80 }}+ >

Then move focus into the panel when it mounts, keep Tab inside it while it is open, and restore focus to the element captured by armFlip when it closes. frontend/src/lib/landing/engine/flip.ts already holds that element in FlipState.el.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 41 - 50,
Update the modal container identified by panelRef in FeatureLab to add
role="dialog", aria-modal="true", and an accessible name. On mount, move focus
into the panel; while open, trap Tab navigation within it so focus cannot reach
the page behind the overlay. Capture and restore focus to the triggering element
stored in FlipState.el when the panel closes, while preserving the existing
Escape close behavior.

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win

The gallery cards cannot be opened with a keyboard.

Opening the feature lab depends on the onClick delegation on the track div at lines 99-102. Card renders an <article> with no tabIndex, no role, and no key handler, and the track div has no key handler either. A keyboard user cannot reach or activate any card, so the feature lab is unreachable without a pointer. The doc comment at lines 14-15 states that the first copy is reachable by keyboard, which does not match the markup.

Make each non-ghost card an activatable control, keep the duplicate copies out of the tab order, and then correct the doc comment.

♿ Proposed fix

-function Card({ i, ghost }: { i: number; ghost: boolean }) {+function Card({ i, ghost, onOpen }: { i: number; ghost: boolean; onOpen: (i: number, el: HTMLElement | null) => void }) {
const c = CARDS[i];
return (
<article
data-tk={i}
aria-hidden={ghost || undefined}
+ role="button"+ tabIndex={ghost ? -1 : 0}+ aria-label={`Open ${c.kicker}`}+ onKeyDown={(e) => {+ if (e.key !== 'Enter' && e.key !== ' ') return;+ e.preventDefault();+ onOpen(i, e.currentTarget);+ }}
style={CARD}
className="ld-galcard"
>

- {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} />)}- {order.map((i) => <Card key={`b${i}`} i={i} ghost />)}+ {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} onOpen={onOpen} />)}+ {order.map((i) => <Card key={`b${i}`} i={i} ghost onOpen={onOpen} />)}

Add a visible focus style for .ld-galcard:focus-visible in globals.css.

Also applies to: 96-107

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 62 - 85, Update
Card so non-ghost cards are keyboard-focusable and activatable, using the
existing track click-delegation contract, while ghost duplicates remain excluded
from the tab order and accessibility tree. Add the corresponding keyboard
activation handling to the card or track using the existing feature-lab target
behavior, and correct the nearby doc comment to match the implemented
accessibility behavior. Add a visible .ld-galcard:focus-visible style in
globals.css.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

Handler timeouts are created without a ref, so they are never cancelled. Both demos schedule a state update from an event handler without storing the handle. The timeout cannot be cleared on unmount, and a second click cannot cancel a pending one. The other demos in this layer already hold each handle in a useRef and clear it in an unmount effect.

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44: store the 300 ms advance timeout in a ref, clear it before each new rating, and clear it on unmount; delete the returned cleanup, which React never calls.
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80: store the 700 ms extract and summarize timeouts in refs and clear them in the existing unmount effect beside saveT.

📍 Affects 2 files

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44 (this comment)
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 37 - 44,
Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout in the rate handler is
stored in a useRef, cleared before scheduling each new rating and during
unmount, and remove the ineffective returned cleanup. Update NotesDemo.tsx at
lines 57-80 so the 700 ms extract and summarize timeouts use refs and are
cleared in the existing unmount effect alongside saveT.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

RECENT[].pick values are not options of the exam select.

openRecent at line 53 sets exam to r.pick. 'Midterm 1 · Sep 30' is not in GUIDES['MA 242'].exams, and 'Quiz 2 · Oct 03' is not in GUIDES['CS 201'].exams. The controlled select at line 76 then falls back to displaying its first option while the guide heading at line 104 prints exam. The control and the heading disagree, and the user cannot select the displayed exam again.

Use an exam that exists in the course fixture, or add the recent exam to the option list when it is selected.

🔧 Proposed fix using existing fixture values

 const RECENT = [
- { i: 0, exam: 'MA 242 · Midterm 1', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Midterm 1 · Sep 30' },- { i: 1, exam: 'CS 201 · Quiz 2', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Quiz 2 · Oct 03' },+ { i: 0, exam: 'MA 242 · Final', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Final · Dec 12' },+ { i: 1, exam: 'CS 201 · Midterm 1', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Midterm 1 · Oct 17' },
];

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	constRECENT=[
	{i: 0,exam: 'MA 242 · Midterm 1',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Midterm 1 · Sep 30'},
	{i: 1,exam: 'CS 201 · Quiz 2',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Quiz 2 · Oct 03'},
	];
	constRECENT=[
	{i: 0,exam: 'MA 242 · Final',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Final · Dec 12'},
	{i: 1,exam: 'CS 201 · Midterm 1',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Midterm 1 · Oct 17'},
	];

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx` around lines 21 - 24,
Update the RECENT entries’ pick values to exactly match an existing exam option
in the corresponding GUIDES course fixture, preserving openRecent’s assignment
and keeping the select value consistent with the guide heading.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

role="radiogroup" has no radio children.

The container declares role="radiogroup", but each option is a plain <button>. A radiogroup requires children with role="radio" and aria-checked. Assistive technology cannot report which option is selected. Add the roles and state, or drop role="radiogroup" and expose selection with aria-pressed.

♿ Proposed fix

 <button
key={o.label}
type="button"
+ role="radio"+ aria-checked={isPicked}+ aria-disabled={reviewing}
onClick={() => { if (!reviewing) setPicked(o.label); }}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='#E3E0D5',bg='#FDFCF9',fg='#33443B',mark='',markCol='';
	if(reviewing&&correct){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';mark='CORRECT';markCol='#0C5638';}
	elseif(reviewing&&isPicked){bd='#b25855';bg='rgba(178,88,85,0.09)';fg='#9c4b48';mark='YOUR PICK';markCol='#9c4b48';}
	elseif(isPicked){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';}
	return(
	<button
	key={o.label}
	type="button"
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '#0E9E5A' : '#9AA5A0'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}
	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='`#E3E0D5`',bg='`#FDFCF9`',fg='`#33443B`',mark='',markCol='';
	if(reviewing&&correct){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';mark='CORRECT';markCol='`#0C5638`';}
	elseif(reviewing&&isPicked){bd='`#b25855`';bg='rgba(178,88,85,0.09)';fg='`#9c4b48`';mark='YOUR PICK';markCol='`#9c4b48`';}
	elseif(isPicked){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';}
	return(
	<button
	key={o.label}
	type="button"
	role="radio"
	aria-checked={isPicked}
	aria-disabled={reviewing}
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '`#0E9E5A`' : '`#9AA5A0`'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 104 - 124,
Fix the quiz option accessibility semantics in the q.options mapping: either
make each button a radio with role="radio" and aria-checked bound to isPicked
while retaining the radiogroup, or remove the radiogroup role and expose
isPicked through aria-pressed. Preserve the existing selection and reviewing
behavior in the option onClick handler.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

The hero canvas effect can start a loop that is never stopped.

import('@/lib/landing/engine/hero') resolves asynchronously. If the component unmounts before the promise resolves, the cleanup at line 222 runs while stopped is still null. The then callback then calls startHeroCanvas, which installs a requestAnimationFrame loop and a resize listener (see frontend/src/lib/landing/engine/hero.ts lines 83-87). Nothing cancels them afterwards, so the loop keeps drawing after navigation away from the landing page.

The WebGL effect at lines 227-244 already uses a cancelled flag. Apply the same pattern here.

🛠️ Proposed fix

 let stopped: { stop(): void } | null = null;
+ let cancelled = false;
// imported lazily so the module isn't pulled into the server bundle
import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas }) => {
+ if (cancelled) return;
stopped = startHeroCanvas(canvas, () => engine.mouse, () => engine.parallaxY);
});
- return () => stopped?.stop();+ return () => {+ cancelled = true;+ stopped?.stop();+ };

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	// imported lazily so the module isn't pulled into the server bundle
	import('@/lib/landing/engine/hero').then(({ startHeroCanvas })=>{
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>stopped?.stop();
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);
	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	letcancelled=false;
	// imported lazily so the module isn't pulled into the server bundle
	import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas })=>{
	if(cancelled)return;
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>{
	cancelled=true;
	stopped?.stop();
	};
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 213 - 224, Update
the hero canvas useEffect around startHeroCanvas to track a cancelled/unmounted
flag. Set it during cleanup, check it after the asynchronous hero module import
resolves before starting the canvas, and stop the returned controller when
appropriate so no animation loop or resize listener remains after unmount.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | 🏗️ Heavy lift

destroy() discards the re-homed clusters, so the field cannot be rebuilt.

ensureInit moves every cluster element out of its .drag-field and into the overlay (line 172), and it mutates the cluster's inline styles (lines 165-171). destroy() removes the shell through the queued cleanup, which deletes those cluster elements from the document. It does not put them back.

Two consequences:

1. A second ensureInit on the same DOM finds .drag-field elements with no [data-dragnode] children, returns false at line 232, and the field stays empty forever. This happens on any stop/start cycle, including the React StrictMode double-invoke of the engine effect in frontend/src/components/landing/useLanding.ts lines 162-210.
2. React still owns those cluster nodes, because DragField rendered them. React records the original parent for each child. Removing or reparenting the nodes outside React can make the later unmount removal fail.

Restore each cluster to its original parent and clear the inline styles that ensureInit set.

🛠️ Proposed fix: remember the original parent and restore it on destroy

 interface ClusterAnchor {
el: HTMLElement;
field: HTMLElement;
+ /** Where the cluster lived before it was re-homed into the overlay. */+ home: Node | null;+ before: Node | null;
/** The pinned act this field belongs to, if any — drives the scroll drift. */
sect: HTMLElement | null;
left: number;
top: number;
}

 anchors.push({
el: cl, field, sect,
+ home: cl.parentNode,+ before: cl.nextSibling,
left: b.left - fb.left,
top: b.top - fb.top,
});

 function destroy(): void {
+ // put the clusters back before the overlay goes away, otherwise React+ // still owns nodes that no longer exist and a later ensureInit finds+ // empty fields+ for (const a of anchors) {+ a.el.style.cssText = '';+ if (a.home) a.home.insertBefore(a.el, a.before);+ }
cleanups.forEach((fn) => fn());
cleanups.length = 0;
anchors.length = 0;
groups = null;
- if (overlay && overlay.parentElement) overlay.parentElement.removeChild(overlay);
overlay = null;
}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 423 - 430, Update the
initialization and destroy flow around ensureInit and destroy to retain each
cluster element’s original parent before moving it into the overlay. During
destroy, restore every cluster to that parent, clear the inline styles applied
by ensureInit, then remove the overlay and reset state so a later ensureInit can
rebuild the field without disrupting React-owned nodes.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/landing-v5/BetaModal.tsx`:
- Around line 52-70: Update the subscribed confirmation branch in BetaModal so
the rendered Close button receives focus after the form is replaced. Add a ref
to that button and focus it after the subscribed state commits, using the
component’s existing lifecycle pattern; preserve the current onClose behavior
and button styling.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ee1ca146-7600-423b-98c7-56bcec09e4e1

📥 Commits

Reviewing files that changed from the base of the PR and between 741ec10 and e506827.

📒 Files selected for processing (13)

• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/BetaModal.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/lib/landing/content.ts

💤 Files with no reviewable changes (2)

• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx

🚧 Files skipped from review as they are similar to previous changes (5)

• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/lib/landing/content.ts

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

Restore modal focus after the subscribed state replaces the form.

When subscribed becomes true, this branch unmounts the focused email input while Dialog remains open. Dialog only applies its initial focus when open changes. Focus can then leave the dialog and bypass its Tab trap. Move focus to the Close button after the confirmation state renders.

Proposed fix

-import { useId, useRef } from 'react';+import { useEffect, useId, useRef } from 'react';
...
const inputRef = useRef<HTMLInputElement>(null);
+ const confirmationCloseRef = useRef<HTMLButtonElement>(null);
const headingId = useId();
const valid = email.includes('@');
++ useEffect(() => {+ if (open && subscribed) confirmationCloseRef.current?.focus();+ }, [open, subscribed]);
...
<button
+ ref={confirmationCloseRef}
onClick={onClose}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '#12201A',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '#0C5638'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '#61726A',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '#0C5638',color: '#fff',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>
	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '`#12201A`',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '`#0C5638`'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '`#61726A`',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	ref={confirmationCloseRef}
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '`#0C5638`',color: '`#fff`',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/BetaModal.tsx` around lines 52 - 70,
Update the subscribed confirmation branch in BetaModal so the rendered Close
button receives focus after the form is replaced. Add a ref to that button and
focus it after the subscribed state commits, using the component’s existing
lifecycle pattern; preserve the current onClose behavior and button styling.

[Darkest-Teddy]

Ports Sapling Landing v5.dc.html (from docs/frontend-audit/Sapling landing page import (1).zip) into the Next.js frontend. v5 is now the landing page at /, replacing the previous marketing landing.

Supersedes #523. Based on feat/landing-v4-port, so its four commits ride along — v5 reuses that branch's scroll engine, course-graph model and editorial content. If v5 is the direction, #523 can be closed unmerged.

The title screen is a ground-up rebuild

Not a v4 tweak. Reading the source rather than the summary that accompanied the task turned up six divergences:

	Assumed	Actual v5 source
Wordmark	Archivo 800, ink #12201A	Playfair Display 600, #0C5638
Reveal	heroWipe clip-path	character scramble — heroWipe is defined, never referenced
Eyebrow	mono "GROW YOUR KNOWLEDGE"	Playfair "Grow Your Knowledge", title case, scrambled
Cascade	—	tagline leads (760ms), wordmark follows 260ms behind — v4 ran the reverse
Right bloom	mirrored green	teal rgba(43,140,150,0.2)
Panel rig	CSS perspective cards	three.js WebGL scene

Act III is likewise not the clipped 918×348 card track described in the brief — the source has a rotating triangular-prism carousel.

The v4 title screen was deleted rather than kept alongside. three/@types/three were already dependencies.

Four dead branches in the source

The design component carries a lot of machinery its own markup never reaches. Documented at each site:

1. const wantDark = false — the navbar's full two-theme colour table is built, then pinned to light. Wired live here, driven off the section under the viewport centre, as the brief calls for.
2. heroWipe / heroChar keyframes — defined, unreferenced. Not ported.
3. setHero0/1/2 + mode pills — exist only in renderVals(), so heroMode is pinned at 0 and only the panel scene can ever be seen. The constellation and growth-field shaders are unreachable; porting them would be porting dead code.
4. "Plant a concept" — plantVal, plantedCount, _plant(), a localStorage-backed grove and a canvas ref, none of it referenced. The CTA is heading + line + button.

Two engine bugs fixed

Both pre-existing in the v4 port, both invisible until a section actually had drag clusters:

• sim.ts reads a ring's halo via previousElementSibling and its caption via nextElementSibling; a <g> wrapper broke the adjacency and it threw on a null label.
• Clusters were anchored once, in page coordinates. The source captures each cluster's offset within its field, parks the overlay in a position:fixed shell, and re-applies anchor + field.rect every frame — which is what lets a cluster track its sticky section, and where the ≤150px drift inside a pinned act comes from.

Verified against the original served side by side: at 45% through act-tutor the source puts its 7 rings on screen at y≈121–608. This port now matches; before the fix it was 0 of 7, parked 8752px down.

Generated, not retyped

• galleryMinis.tsx — the 8 card miniatures, mechanically converted from the source's <article data-tk> blocks. Dense decorative animation where exact geometry and per-element delays are the effect. Regenerate rather than hand-edit.
• dragClusters.ts — the 8 course clusters, ~2KB of inline SVG each in the source, reduced to data + one component.
• companionContent.ts — 18 copy arrays lifted verbatim from the sibling pages.

Also in this PR

• The old marketing landing is retired. Deleting / orphaned marketing/graph/ (~95KB of passing tests for a surface no route mounts), marketing/surfaces/, FeatureBand, SurfaceBento, featureBands. HeroCard/SignInModal stay — the nav's Sign In opens the real OAuth modal.
• e2e/landing-graph.spec.ts goes with the component it pinned. public-seo.spec.ts's SSR guard is retargeted, not deleted: its failure mode (an ssr: false silently dropping the landing's copy from crawled HTML) outlived its selectors, and is sharper on a canvas/WebGL page. It deliberately does not assert the wordmark — that scrambles in client-side, so the h1's aria-label is checked instead. All 7 assertions verified against raw SSR output.
• The five companion pages the nav links to (/team, /wiki, /gallery, /news, /faq). Once v5 took /, those links 404'd. They use the warm paper palette deliberately — that is not a mistake to unify.

Known gaps

• Feature lab demo pane. The source mounts a separate FeatureLab design component per kind via <dc-import> — a distinct 75KB file the task's file list did not scope in. Layout, FLIP, rail, copy and close are faithful; the pane shows the card's miniature enlarged.
• Gallery tiles have no artwork — the import ships no screenshots.

Verification

• tsc --noEmit exit 0 · eslint exit 0 · next build exit 0, all 5 new routes prerendered static
• Unit suite 59 files / 423 tests passing
• Every section walked in a real browser at multiple scroll positions, no console errors; all 9 public routes return 200

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features
  • Introduced a redesigned landing experience with interactive knowledge graphs, tutoring modes, feature demos, gallery, journal, FAQ, and beta signup.
  • Added public FAQ, Gallery, News, Team, and Wiki pages with responsive navigation and searchable or filterable content.
  • Added interactive demonstrations for quizzes, flashcards, grades, calendars, notes, study rooms, guides, and tutoring.
• Documentation
  • Improved server-rendered landing-page checks for key accessible content and beta messaging.
• Refactor
  • Retired the previous marketing sections and legacy landing-page presentation.

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ebab108d-0405-4ae1-8d00-108ba83a0144

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

📝 Walkthrough

Walkthrough

Replaced the landing page with a component-based v5 experience, added interactive feature labs and companion pages, introduced shared animation engines and content data, and updated SSR coverage. Removed the former marketing graph, surface components, and related tests.

Changes

Landing v5 experience

Layer / File(s)	Summary
Landing content and data contracts frontend/src/lib/landing/*	Added landing content, course graph data, drag clusters, color utilities, and companion-page datasets.
Animation and interaction engines frontend/src/lib/landing/engine/*, frontend/src/lib/landing/hero3d/*	Added graph rendering, canvas effects, layout measurement, marquee and FLIP behavior, planting, drag simulation, and WebGL hero support.
Landing composition frontend/src/app/(public)/page.tsx, frontend/src/components/landing-v5/*, frontend/src/components/landing/useLanding.ts	Replaced the previous landing implementation with v5 hero, graph, ingest, tutor, gallery, FAQ, journal, CTA, navigation, modal, and lifecycle components.
Interactive feature labs frontend/src/components/landing-v5/lab/*	Added interactive quiz, flashcard, guide, grade, calendar, notes, rooms, and tutor demos with shared fixture data and controls.
Companion pages frontend/src/components/companion/*, frontend/src/app/(public)/{about,team,wiki,faq,gallery,news}/*	Added shared companion navigation and public About, Team, Wiki, FAQ, Gallery, and News routes.
Styling and SSR validation frontend/src/app/globals.css, frontend/e2e/public-seo.spec.ts, frontend/eslint-suppressions.json, frontend/src/lib/api.ts	Added scoped landing and companion styles, responsive animations, newsletter API wiring, and SSR checks for landing-page copy. Removed obsolete ESLint suppressions.

Estimated code review effort: 5 (Critical) | ~120 minutes

Possibly related PRs

• SaplingLearn/Sapling#513: Replaced the related knowledge-graph landing implementation and its supporting components.
• SaplingLearn/Sapling#63: Uses the same beta/newsletter signup flow implemented through BetaModal.
• SaplingLearn/Sapling#286: Also modifies the public landing page and shared styling layer.

Suggested reviewers:andresl230

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 36.59% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly identifies the primary change: porting Sapling Landing v5 into the landing page.
Description check	✅ Passed	The description explains the purpose, major changes, known gaps, related issue context, and verification results in substantial detail.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/landing-v5-port

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[supabase]

This pull request has been ignored for the connected project ybgqdonkoqftwrmweuyv because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.

---

Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

[cloudflare-workers-and-pages]

Deploying with Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	frontend-staging	fc36068	Commit Preview URL Branch Preview URL	Aug 16 2026, 09:58 PM

[coderabbitai]

Actionable comments posted: 8

Note

Due to the large number of review comments, Critical, Major severity comments were prioritized as inline comments.

🟡 Minor comments (14)

frontend/src/components/landing-v5/lab/NotesDemo.tsx-57-80 (1)

57-80: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

extract and summarize timeouts are untracked.

saveT is cleared on unmount, but the 700 ms timeouts at line 60 and line 71 are not stored and not cleared. If the lab panel closes within that window, the callbacks still run and set state on an unmounted component. Hold both handles in refs and clear them in the existing unmount effect.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` around lines 57 - 80,
Update the extract and summarize timeout flows to store their setTimeout handles
in dedicated refs, and clear both refs in the existing unmount effect alongside
saveT. Ensure the callbacks still perform their current state updates when they
complete, while preventing them from running after the component unmounts.

frontend/src/components/landing-v5/lab/CardsDemo.tsx-46-53 (1)

46-53: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The global space handler blocks button activation.

The keydown listener calls e.preventDefault() for every space press on window. A focused button then cannot be activated with space, including "Study again" at line 90. Skip the flip and the preventDefault call when the event target is an interactive element.

♿ Proposed fix

 const onKey = (e: KeyboardEvent) => {
+ const el = e.target as HTMLElement | null;+ if (el?.closest('button, input, textarea, select, [contenteditable]')) return;
if (e.key === ' ') { e.preventDefault(); flip(); }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 46 - 53,
Update the keydown handler in the useEffect to detect when the event target is
an interactive element, such as a button or link, and skip both flip() and
preventDefault() for those targets. Preserve the existing global space-to-flip
and rate-key behavior for non-interactive targets.

frontend/src/components/landing-v5/lab/NotesDemo.tsx-63-63 (1)

63-63: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

The "no concepts" sentinel is counted as a linked concept.

When no matcher hits, concepts receives one placeholder entry. The footer at line 141 then renders "1 concepts linked to your MA 242 graph." The count is wrong and contradicts the placeholder. Keep concepts empty and track the empty result separately.

🔧 Proposed fix

+ const [ran, setRan] = useState(false);
@@
- setConcepts(found.length ? found : [{ name: 'No concepts found', tier: 'unexplored' }]);+ setConcepts(found);+ setRan(true);
setBusy(false);
@@
+ {ran && concepts.length === 0 && !busy && (+ <span style={{ fontSize: 12, color: '`#9AA5A0`' }}>No concepts found.</span>+ )}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx` at line 63, Update the
concept-loading logic around the setConcepts call to keep concepts empty when
found has no matches instead of inserting a “No concepts found” sentinel; track
the empty-result state separately and use it for the empty-state display while
ensuring the footer count reflects only actual linked concepts.

frontend/src/lib/landing/engine/dom.ts-49-73 (1)

49-73: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Do not cache a zero-sized canvas measurement.

cv() caches w/h from clientWidth/clientHeight on the first call. The cache is dropped only by invalidateCanvas, which measure() calls only when the viewport dimensions change (see frontend/src/lib/landing/engine/measure.ts lines 98-104). If the first cv() call happens while the canvas is not laid out yet, or while its section is hidden, the cache stores 0 × 0. Every later frame then draws into a 0-pixel backing store, and the canvas stays blank until the viewport itself changes.

Skip the cache write when the measured size is zero, so the next frame re-reads it.

🐛 Proposed fix

 if (!c) {
const w = canvas.clientWidth;
const h = canvas.clientHeight;
const dpr = Math.min(window.devicePixelRatio || 1, 1.5);
let ctx = rec.__ctx as CanvasRenderingContext2D | undefined;
if (!ctx) {
ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
rec.__ctx = ctx;
}
c = { ctx, w, h, dpr };
- rec.__cv = c;+ // An unlaid-out or hidden canvas measures 0; don't freeze that in the+ // cache, or the next frames draw into a 0-pixel backing store.+ if (w > 0 && h > 0) rec.__cv = c;
const pw = Math.round(w * dpr);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/dom.ts` around lines 49 - 73, Update cv so
zero-sized measurements are not stored in the CanvasCache: when clientWidth or
clientHeight is zero, avoid assigning the newly measured cache to rec.__cv while
preserving the current context and sizing behavior. Ensure subsequent calls
re-read dimensions until both measurements are nonzero, while retaining normal
caching for valid sizes.

frontend/src/components/landing-v5/Journal.tsx-96-101 (1)

96-101: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Each post card links back to its own section.

href="#newsletter" points at the section that contains the card. The card presents as a link to an article, and activating it does nothing. This PR adds a /news route. Point each card at the article, or at /news until per-post routes exist.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 96 - 101, Update
the post card anchor in the Journal component to navigate to the new /news route
instead of the containing `#newsletter` section, while preserving the existing
card styling and behavior.

frontend/src/lib/landing/engine/sim.ts-184-203 (1)

184-203: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Label binding depends on an SVG sibling order that the markup does not guarantee.engine/sim.ts locates a node's caption through ring.nextElementSibling and casts it to SVGTextElement, while DragField renders that <text> only when a label exists for the node. When a label is missing, the sim binds the following node's glow <circle> and writes x/y onto it every frame, and ly becomes NaN.

• frontend/src/lib/landing/engine/sim.ts#L184-L203: check nextElementSibling.tagName === 'text' before the cast, type SimNode.label as SVGTextElement | null, and skip the label writes at lines 377-378 when it is null.
• frontend/src/components/landing-v5/DragField.tsx#L60-L92: alternatively, or in addition, always emit a <text> element per node so the documented glow → ring → label order holds for every node.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 184 - 203, Prevent
incorrect label binding in sim.ts by verifying ring.nextElementSibling is a text
element before assigning it, type SimNode.label as SVGTextElement | null, and
skip label position updates when it is null; update DragField.tsx to always
render a text element per node so the expected glow, ring, label order is
maintained.

frontend/src/components/landing-v5/Faq.tsx-66-71 (1)

66-71: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

"Read the full FAQ" links to its own section.

href="#faq" targets the section that contains the link, so the control does nothing. This PR adds a /faq route. Point the link there.

🔗 Proposed fix

- <a href="`#faq`" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>+ <a href="/faq" style={{ color: '`#0C5638`', textDecoration: 'underline' }}>Read the full FAQ</a>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 66 - 71, Update the
“Read the full FAQ” anchor in the FAQ component to navigate to the newly added
/faq route instead of the local `#faq` section, preserving its existing styling
and text.

frontend/src/components/landing-v5/Journal.tsx-184-199 (1)

184-199: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Set type="email" and guard the current submit flow.

The Journal input is an email address, so use type="email" for mobile keyboard and browser validation. The current actions.subscribe, at frontend/src/components/landing/useLanding.ts:624, only checks email.includes('@') and sets local subscribed state. If this should be a stub, make that intent explicit; otherwise wire onSubscribe to a newsletter endpoint before showing “You’re on the tree”.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Journal.tsx` around lines 184 - 199,
Update the Journal email input in the landing component to use type="email" and
preserve the existing onSubscribe flow only as an explicit stub, or wire
onSubscribe to the newsletter endpoint and show the subscribed state only after
a successful submission. Locate the handler through actions.subscribe/useLanding
and ensure invalid emails cannot enter the success state.

frontend/src/components/landing-v5/Faq.tsx-79-116 (1)

79-116: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Closed answers stay in the accessibility tree, and the button has no aria-controls.

The collapsed panel uses maxHeight: 0, opacity: 0, and overflow: hidden. None of these remove the content from assistive technology, so a screen reader reads every answer even when the accordion is closed. The button also declares aria-expanded without naming the region it controls.

Add aria-controls with a stable id, and set aria-hidden on the panel while it is closed. aria-hidden does not disturb the max-height transition, because the content holds no focusable elements.

♿ Proposed fix

 <button
onClick={() => onToggle(open ? -1 : i)}
aria-expanded={open}
+ aria-controls={`faq-answer-${i}`}
style={{ width: '100%', background: 'none', border: 'none', cursor: 'pointer', padding: '22px 4px', display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 20, textAlign: 'left' }}
>

 <div
+ id={`faq-answer-${i}`}+ role="region"+ aria-hidden={!open}
style={{

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Faq.tsx` around lines 79 - 116, Update the
FAQ accordion around the toggle button and answer panel to give each panel a
stable unique id, reference it from the button via aria-controls, and set
aria-hidden based on the open state so closed answers are excluded from the
accessibility tree. Preserve the existing visual transition and aria-expanded
behavior.

frontend/src/components/landing-v5/Navbar.tsx-199-235 (1)

199-235: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

role="menu" is applied to navigation disclosures whose children are not menu items. Both new navigation panels declare role="menu", but their children are plain button elements and next/link anchors. The ARIA menu pattern permits only menuitem, menuitemradio, and menuitemcheckbox children, so screen readers report both groups incorrectly. Both panels are page navigation, not application menus, so the correct fix in each place is to remove the role rather than to add menuitem roles.

• frontend/src/components/landing-v5/Navbar.tsx#L199-L235: remove role="menu" from the compact panel, and remove aria-haspopup="menu" from the trigger at line 120. Keep aria-expanded.
• frontend/src/components/landing-v5/Closing.tsx#L154-L182: remove role="menu" from the jump panel, and remove aria-haspopup="menu" from the pill at line 188. The enclosing nav with aria-label="Page sections" already carries the correct semantics.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Navbar.tsx` around lines 199 - 235, The
navigation disclosures use menu semantics with ordinary links and buttons;
remove those menu roles and triggers’ menu-haspopup attributes. In
frontend/src/components/landing-v5/Navbar.tsx lines 199-235, remove role="menu"
from the compact panel and remove aria-haspopup="menu" from its trigger while
retaining aria-expanded. In frontend/src/components/landing-v5/Closing.tsx lines
154-182, remove role="menu" from the jump panel and remove aria-haspopup="menu"
from the pill trigger; keep the enclosing navigation semantics and existing
expansion state.

frontend/src/app/(public)/page.tsx-115-116 (1)

115-116: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Clear the deferred openGal timers on unmount.

actions.openGal schedules actions.enterExplore / actions.openGal 260 ms later from onQuiz and onLearn. If the page unmounts before those timers fire, openGal runs after cleanup and writes document.body.style.overflow = 'hidden' after the landing cleanup reset that overflow. Keep the timer refs in useLanding so cleanup can call clearTimeout for them.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/page.tsx around lines 115 - 116, Update useLanding
and the onQuiz/onLearn handlers to store each 260 ms openGal timeout in refs,
rather than discarding the timer IDs. In the landing cleanup, clear both
deferred timers before resetting document.body overflow, preventing
actions.openGal from running after unmount.

frontend/src/components/landing-v5/ActTutor.tsx-93-109 (1)

93-109: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Expose the selected tutor mode, and keep the hidden pills out of the tab order.

Two gaps in this control group:

1. The pills are a mode selector, but the selected state is carried only by background and color. Assistive technology cannot report which mode is active. Add aria-pressed={tutorMode === i}.
2. The container starts at opacity: 0 with pointerEvents: 'none', and the engine fades it in later. The buttons stay focusable while invisible, so a keyboard user can focus a control that is not visible. Mirror the visual state in the tab order.

Also add type="button", which the other sections in this PR set consistently.

♻️ Proposed fix for the pill group

- {CAPTIONS.map(([tag], i) => (- <button- key={tag}- onClick={() => onSetMode(i)}+ {CAPTIONS.map(([tag], i) => (+ <button+ key={tag}+ type="button"+ aria-pressed={tutorMode === i}+ onClick={() => onSetMode(i)}

The engine already writes opacity on the container. Have it also clear visibility or the inert attribute so the pills leave the tab order until the handover:

- <div data-tutor-pills="1" style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>+ <div data-tutor-pills="1" inert style={{ display: 'flex', gap: 8, marginTop: 8, opacity: 0, pointerEvents: 'none', transition: 'opacity 400ms ease' }}>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActTutor.tsx` around lines 93 - 109,
Update the tutor pill group in ActTutor’s CAPTIONS map to add type="button" and
aria-pressed={tutorMode === i} to each button. Keep the hidden container’s
buttons out of the tab order while the engine-controlled opacity is zero by
mirroring its hidden state with inert or an equivalent visibility-based
mechanism, and ensure the existing handover clears that state when the pills
become visible.

frontend/src/components/landing-v5/ActGraph.tsx-333-340 (1)

333-340: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Add an Escape key exit for explore mode.

Explore mode covers the act and closes the navbar, but useLanding only handles Escape for gallery and jump controls. If explore mode is active, call onExitExplore from the key handler so keyboard-only users can leave the mode safely.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/ActGraph.tsx` around lines 333 - 340,
Update the existing keyboard handler in useLanding to detect Escape while
explore mode is active and call onExitExplore. Preserve the current Escape
behavior for gallery and jump controls, and ensure the explore-mode exit path is
available to keyboard-only users.

frontend/src/lib/landing/hero3d/index.ts-175-189 (1)

175-189: 🩺 Stability & Availability | 🟡 Minor | ⚡ Quick win

Release the WebGL context in stop().

stop() already disposes three.js resources and cancels the render loop. WebGLRenderer.dispose() does not release the WebGL context, and this rig creates a new context on its canvas each mount. Add renderer.forceContextLoss() after renderer.dispose() so repeated navigation can reclaim the browser contexts sooner.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/hero3d/index.ts` around lines 175 - 189, Update the
returned stop() method to call renderer.forceContextLoss() immediately after
renderer.dispose(), ensuring the WebGL context is released during cleanup while
preserving the existing resource disposal and animation cancellation behavior.

🧹 Nitpick comments (14)

frontend/src/components/landing-v5/lab/LabShell.tsx (1)

51-84: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Segmented is unused; two demos duplicate it inline.

The comment states that the tutor and calendar demos use this control. They do not import it. CalendarDemo.tsx lines 61-76 and TutorDemo.tsx lines 65-80 each contain an inline copy of the same markup and style logic. Use Segmented in both demos, or delete it and correct the comment.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx` around lines 51 - 84,
Resolve the unused Segmented component by replacing the duplicated inline
segmented-control markup in CalendarDemo and TutorDemo with the shared Segmented
component, passing each demo’s options, current value, and change handler.
Preserve the existing labels, selection behavior, and styling, and keep the
component’s public API unchanged.

frontend/src/components/landing-v5/lab/QuizDemo.tsx (1)

33-35: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Difficulty badge changes while the same question is shown.

submit updates streak before it sets phase to review. qi does not change. The badge therefore flips from MEDIUM to HARD or EASY while the user still reads question 1 and its explanation. Derive the badge from the difficulty that applied when the question was served, for example from answers.length captured at question start.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 33 - 35,
Update the difficulty derivation in QuizDemo so the badge remains tied to the
difficulty assigned when the current question was served, rather than
recomputing from the mutable streak during review. Capture or derive the
question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.

frontend/src/components/landing-v5/lab/GradesDemo.tsx (1)

62-65: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Row percentage is unclamped while the weighted grade is clamped.

Line 25 clamps the score into [0, r.possible]. Line 64 uses the unclamped raw. If the user types 70 in a 50-point row, the row shows 140% while the category bar and the overall grade cap at 100%. Apply the same clamp in both places.

♻️ Proposed fix

 const raw = parseFloat(earned[i]);
- const pct = isNaN(raw) ? null : Math.round((raw / r.possible) * 100);+ const pct = isNaN(raw) ? null : Math.round((Math.max(0, Math.min(raw, r.possible)) / r.possible) * 100);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx` around lines 62 - 65,
Clamp the parsed score used in the row percentage calculation within the same
[0, r.possible] bounds already applied to the weighted grade. Update the
percentage logic in the GB_ROWS map callback, preserving the existing null
handling and color thresholds while ensuring values above or below the row
limits cannot produce percentages outside 0–100.

frontend/src/components/landing-v5/lab/labData.ts (1)

13-13: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Remove duplicated TIER from labData.ts.

labData.ts exports TIER, but the lab demos import LAB_TIER and render with labData.ts content. The four hex values and keys match LAB_TIER, so two copies of this swatch set can drift. Drop TIER from labData.ts and keep using LAB_TIER.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/labData.ts` at line 13, Remove the
exported TIER constant from labData.ts, since it duplicates the matching
LAB_TIER swatch set. Update any references in labData.ts to use LAB_TIER
instead, preserving the existing keys and color values.

frontend/src/lib/landing/engine/graph.ts (1)

122-127: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Replace the random-comparator shuffle with Fisher–Yates.

sort(() => Math.random() - 0.5) uses an inconsistent comparator. The resulting permutation is biased and depends on the engine's sort implementation, so many nodes keep positions close to their original index. That works against the documented intent of an organic reveal order.

♻️ Proposed fix

- // Shuffle the reveal order so the graph assembles organically.- const order = nodes.map((_, i) => i).sort(() => Math.random() - 0.5);+ // Shuffle the reveal order so the graph assembles organically.+ const order = nodes.map((_, i) => i);+ for (let i = order.length - 1; i > 0; i--) {+ const j = Math.floor(Math.random() * (i + 1));+ [order[i], order[j]] = [order[j], order[i]];+ }

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/graph.ts` around lines 122 - 127, Replace the
random-comparator sort in the reveal-order logic with an unbiased Fisher–Yates
shuffle of the index array. Keep the existing spawnAt and colorAt calculations
and node ordering behavior after shuffling unchanged.

frontend/src/app/(public)/wiki/page.tsx (1)

31-39: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Make lede optional so the privacy section does not render an empty paragraph.

The privacy section passes lede="". Section always renders the <p>, so the page emits an empty paragraph with 0 0 20px margins. That adds dead space and an empty node in the accessibility tree.

♻️ Proposed fix

-function Section({ id, title, lede, children }: { id: string; title: string; lede: string; children?: React.ReactNode }) {+function Section({ id, title, lede, children }: { id: string; title: string; lede?: string; children?: React.ReactNode }) {
return (
<section style={{ marginTop: 56, scrollMarginTop: 110 }} id={id}>
<SectionHeading>{title}</SectionHeading>
- <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ {lede ? (+ <p style={{ margin: '0 0 20px', fontFamily: SERIF, fontSize: 15, lineHeight: 1.65, color: '`#3f3b31`' }}>{lede}</p>+ ) : null}
{children}

Then drop lede="" at line 147.

Also applies to: 147-149

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/`(public)/wiki/page.tsx around lines 31 - 39, Make the lede
prop optional in Section and render the paragraph only when lede has content, so
the privacy section does not produce an empty element or spacing. Remove the
lede="" argument from the privacy Section usage while preserving existing lede
rendering for other sections.

frontend/src/lib/landing/engine/marquee.ts (1)

136-144: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick win

Avoid the per-frame layout read in update().

update() runs from the engine tick on every frame the gallery is on screen. Line 136 reads wrap.clientWidth on each of those frames, and line 156 writes track.style.transform. The write dirties style, so the next frame's read forces a style recalculation and layout. That contradicts the engine invariant documented in frontend/src/lib/landing/engine/index.ts lines 4-8, which states the tick never reads layout.

Observe the container width instead, and re-measure only when it changes.

♻️ Proposed approach

- // measure one card set only when the container width changed- if (!m.setW || m.measuredW !== wrap.clientWidth) {+ // measure one card set only when a ResizeObserver marked it stale+ if (!m.setW) {

Then in bind, mark the state stale from an observer and add its teardown to cleanups:

constro=newResizeObserver(()=>{m.setW=0;});if(wrap)ro.observe(wrap);cleanups.push(()=>ro.disconnect());

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/marquee.ts` around lines 136 - 144, Remove
the per-frame wrap.clientWidth read from update() and move width-change
detection to bind using a ResizeObserver on wrap. Have the observer mark m.setW
stale, register ro.disconnect in cleanups, and preserve the existing measurement
logic when update() sees stale state without reading layout every tick.

frontend/src/components/landing-v5/FeatureLab.tsx (1)

94-119: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Mark the active rail button for assistive technology.

on changes only the colors. Add aria-current="true" on the selected button so the active tool is conveyed without color.

♿ Proposed change

 data-rail={i}
type="button"
+ aria-current={on || undefined}
onClick={() => onPick(i)}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 94 - 119, Add
an aria-current="true" attribute to the selected rail button rendered in the
GAL.map callback, using the existing on condition so assistive technology
identifies the active tool without relying on color.

frontend/src/components/landing-v5/Gallery.tsx (1)

71-73: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

The wrapper duplicates the miniature's own container.

The <div> here sets height: 166, borderRadius: 13, overflow: hidden, the same background, and the same border. Every entry in GALLERY_MINIS opens with a <div> carrying that identical style set (see galleryMinis.tsx line 16). One of the two layers is redundant. Because the minis are generated, drop the wrapper here rather than editing the generated file.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 71 - 73, Remove
the redundant wrapper div around GALLERY_MINIS[i] in Gallery, rendering the
miniature directly while preserving its existing placement and aria-hidden
behavior. Do not modify the generated galleryMinis.tsx entries.

frontend/src/lib/landing/engine/flip.ts (1)

24-25: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

FlipState.ran is never read.

armFlip sets ran = false and flipClose resets it, but no code in this module or in frontend/src/components/landing/useLanding.ts reads it. The consumer tracks the same guard with its own flipRan ref (see useLanding.ts lines 158, 552, 574-575). Two guards for one invariant can drift. Either remove ran from FlipState or make flipOpen own the guard and delete flipRan from the hook.

Also applies to: 78-78

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/flip.ts` around lines 24 - 25, Remove the
unused FlipState.ran field and its assignments in armFlip and flipClose, since
useLanding already owns this guard through flipRan. Keep the existing
flipRan-based behavior unchanged and avoid maintaining duplicate state for the
same invariant.

frontend/src/lib/landing/engine/hero.ts (1)

99-136: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

Points behind the camera reach the link pass with a degenerate scale.

sc = FL / (FL + z) is computed for every node. Rotation mixes ox into z, and ox reaches about ±740 while oz reaches about ±340, so z can pass -1000. At z === -FL the divide produces Infinity, and below -FL it produces a negative scale.

The point pass guards this at line 139 with p.z > -FL. The link pass at lines 116-136 does not. A node with Infinity scale gives reach === Infinity, so the break at line 122 never fires for that row and the inner loop degrades to a full scan.

Filter the projection once, so both passes share the guard.

♻️ Proposed change

 const proj = nodes
.map((n) => {
...
})
+ // drop anything at or behind the projection plane: `sc` is not finite+ // there, which breaks both the link reach and the point radius+ .filter((p) => p.z > -FL)
.sort((a, b) => b.z - a.z);

The p.z > -FL test at line 139 then becomes redundant and can go.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/hero.ts` around lines 99 - 136, Filter the
projected nodes immediately after the `proj` mapping so only entries with `p.z >
-FL` remain before sorting and running the link pass. Reuse this filtered
collection for both link rendering and the later point-rendering pass, then
remove the now-redundant `p.z > -FL` guard in the point pass.

frontend/src/components/landing/useLanding.ts (1)

378-392: 🚀 Performance & Scalability | 🔵 Trivial | 💤 Low value

The reveal scan polls every 900ms for the page lifetime.

scan() re-queries [data-reveal] across the whole landing root twice per second, forever, to catch elements that mount later. A MutationObserver on root would react to the same additions without the standing timer. This is a nice-to-have; the current cost is one querySelectorAll per tick.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 378 - 392,
Replace the lifetime polling interval in the reveal setup around scan with a
MutationObserver watching root for added elements, invoking scan when matching
content mounts later. Keep the initial scan, existing seen/io behavior, and
cleanup, but disconnect the mutation observer instead of clearing an interval.

frontend/src/lib/landing/engine/sim.ts (1)

282-299: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low value

up ignores pointerId, and the window listeners are registered once per cluster.

Two small points in bindDrag:

• up does not compare e.pointerId with f.drag.id. A second pointer that lifts cancels the active drag. onMove does compare the id, so the handlers are inconsistent.
• onMove and up are added to window inside the per-cluster loop. With N clusters in one group, every window pointer event runs N identical handlers. Bind the window listeners once per group instead.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 282 - 299, Update
bindDrag so up ignores pointer events whose pointerId does not match f.drag.id,
matching onMove’s active-pointer validation. Move the window-level pointermove,
pointerup, and pointercancel listener registration out of the per-cluster
binding loop and register each once per group, while keeping the per-SVG
listeners on the individual cluster SVG.

frontend/src/components/landing-v5/Closing.tsx (1)

75-92: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Share the companion-page list, and make the footer icon decorative.

Two points:

1. FOOTER_LINKS repeats PAGES in Navbar.tsx (lines 26-33) with the same six label and href pairs. Both files are new in this PR, so the two lists will drift the first time a companion page is added or renamed. Export one list and import it in both places.
2. Line 91 sets alt="Sapling" on the icon, and the adjacent text already reads "Sapling · © 2026". A screen reader announces the name twice. Navbar.tsx line 100 already uses alt="" for the same icon beside the same wordmark.

♻️ Proposed fix

- <Image src="/sapling-icon.svg" alt="Sapling" width={20} height={20} />+ <Image src="/sapling-icon.svg" alt="" width={20} height={20} />

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Closing.tsx` around lines 75 - 92, Share
the companion-page link list currently duplicated as FOOTER_LINKS in SiteFooter
and PAGES in Navbar by exporting one canonical list and importing it in both
components, preserving all six label/href pairs. Update the footer Image in
SiteFooter to use an empty alt value so the adjacent Sapling text is announced
only once.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/app/globals.css`:
- Around line 1957-2005: Rename the camelCase keyframe declarations in the
affected stylesheet to kebab-case, including symbols such as s1Stem,
saplingBlob, introOrbit, popHold, and the additional reported ranges. Update
every corresponding animation and animation-name reference to the new kebab-case
identifiers, preserving all animation behavior.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 41-50: Update the modal container identified by panelRef in
FeatureLab to add role="dialog", aria-modal="true", and an accessible name. On
mount, move focus into the panel; while open, trap Tab navigation within it so
focus cannot reach the page behind the overlay. Capture and restore focus to the
triggering element stored in FlipState.el when the panel closes, while
preserving the existing Escape close behavior.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 62-85: Update Card so non-ghost cards are keyboard-focusable and
activatable, using the existing track click-delegation contract, while ghost
duplicates remain excluded from the tab order and accessibility tree. Add the
corresponding keyboard activation handling to the card or track using the
existing feature-lab target behavior, and correct the nearby doc comment to
match the implemented accessibility behavior. Add a visible
.ld-galcard:focus-visible style in globals.css.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 37-44: Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout
in the rate handler is stored in a useRef, cleared before scheduling each new
rating and during unmount, and remove the ineffective returned cleanup. Update
NotesDemo.tsx at lines 57-80 so the 700 ms extract and summarize timeouts use
refs and are cleared in the existing unmount effect alongside saveT.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx`:
- Around line 21-24: Update the RECENT entries’ pick values to exactly match an
existing exam option in the corresponding GUIDES course fixture, preserving
openRecent’s assignment and keeping the select value consistent with the guide
heading.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 104-124: Fix the quiz option accessibility semantics in the
q.options mapping: either make each button a radio with role="radio" and
aria-checked bound to isPicked while retaining the radiogroup, or remove the
radiogroup role and expose isPicked through aria-pressed. Preserve the existing
selection and reviewing behavior in the option onClick handler.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 213-224: Update the hero canvas useEffect around startHeroCanvas
to track a cancelled/unmounted flag. Set it during cleanup, check it after the
asynchronous hero module import resolves before starting the canvas, and stop
the returned controller when appropriate so no animation loop or resize listener
remains after unmount.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 423-430: Update the initialization and destroy flow around
ensureInit and destroy to retain each cluster element’s original parent before
moving it into the overlay. During destroy, restore every cluster to that
parent, clear the inline styles applied by ensureInit, then remove the overlay
and reset state so a later ensureInit can rebuild the field without disrupting
React-owned nodes.
---
Minor comments:
In `@frontend/src/app/`(public)/page.tsx:
- Around line 115-116: Update useLanding and the onQuiz/onLearn handlers to
store each 260 ms openGal timeout in refs, rather than discarding the timer IDs.
In the landing cleanup, clear both deferred timers before resetting
document.body overflow, preventing actions.openGal from running after unmount.
In `@frontend/src/components/landing-v5/ActGraph.tsx`:
- Around line 333-340: Update the existing keyboard handler in useLanding to
detect Escape while explore mode is active and call onExitExplore. Preserve the
current Escape behavior for gallery and jump controls, and ensure the
explore-mode exit path is available to keyboard-only users.
In `@frontend/src/components/landing-v5/ActTutor.tsx`:
- Around line 93-109: Update the tutor pill group in ActTutor’s CAPTIONS map to
add type="button" and aria-pressed={tutorMode === i} to each button. Keep the
hidden container’s buttons out of the tab order while the engine-controlled
opacity is zero by mirroring its hidden state with inert or an equivalent
visibility-based mechanism, and ensure the existing handover clears that state
when the pills become visible.
In `@frontend/src/components/landing-v5/Faq.tsx`:
- Around line 66-71: Update the “Read the full FAQ” anchor in the FAQ component
to navigate to the newly added /faq route instead of the local `#faq` section,
preserving its existing styling and text.
- Around line 79-116: Update the FAQ accordion around the toggle button and
answer panel to give each panel a stable unique id, reference it from the button
via aria-controls, and set aria-hidden based on the open state so closed answers
are excluded from the accessibility tree. Preserve the existing visual
transition and aria-expanded behavior.
In `@frontend/src/components/landing-v5/Journal.tsx`:
- Around line 96-101: Update the post card anchor in the Journal component to
navigate to the new /news route instead of the containing `#newsletter` section,
while preserving the existing card styling and behavior.
- Around line 184-199: Update the Journal email input in the landing component
to use type="email" and preserve the existing onSubscribe flow only as an
explicit stub, or wire onSubscribe to the newsletter endpoint and show the
subscribed state only after a successful submission. Locate the handler through
actions.subscribe/useLanding and ensure invalid emails cannot enter the success
state.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx`:
- Around line 46-53: Update the keydown handler in the useEffect to detect when
the event target is an interactive element, such as a button or link, and skip
both flip() and preventDefault() for those targets. Preserve the existing global
space-to-flip and rate-key behavior for non-interactive targets.
In `@frontend/src/components/landing-v5/lab/NotesDemo.tsx`:
- Around line 57-80: Update the extract and summarize timeout flows to store
their setTimeout handles in dedicated refs, and clear both refs in the existing
unmount effect alongside saveT. Ensure the callbacks still perform their current
state updates when they complete, while preventing them from running after the
component unmounts.
- Line 63: Update the concept-loading logic around the setConcepts call to keep
concepts empty when found has no matches instead of inserting a “No concepts
found” sentinel; track the empty-result state separately and use it for the
empty-state display while ensuring the footer count reflects only actual linked
concepts.
In `@frontend/src/components/landing-v5/Navbar.tsx`:
- Around line 199-235: The navigation disclosures use menu semantics with
ordinary links and buttons; remove those menu roles and triggers’ menu-haspopup
attributes. In frontend/src/components/landing-v5/Navbar.tsx lines 199-235,
remove role="menu" from the compact panel and remove aria-haspopup="menu" from
its trigger while retaining aria-expanded. In
frontend/src/components/landing-v5/Closing.tsx lines 154-182, remove role="menu"
from the jump panel and remove aria-haspopup="menu" from the pill trigger; keep
the enclosing navigation semantics and existing expansion state.
In `@frontend/src/lib/landing/engine/dom.ts`:
- Around line 49-73: Update cv so zero-sized measurements are not stored in the
CanvasCache: when clientWidth or clientHeight is zero, avoid assigning the newly
measured cache to rec.__cv while preserving the current context and sizing
behavior. Ensure subsequent calls re-read dimensions until both measurements are
nonzero, while retaining normal caching for valid sizes.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 184-203: Prevent incorrect label binding in sim.ts by verifying
ring.nextElementSibling is a text element before assigning it, type
SimNode.label as SVGTextElement | null, and skip label position updates when it
is null; update DragField.tsx to always render a text element per node so the
expected glow, ring, label order is maintained.
In `@frontend/src/lib/landing/hero3d/index.ts`:
- Around line 175-189: Update the returned stop() method to call
renderer.forceContextLoss() immediately after renderer.dispose(), ensuring the
WebGL context is released during cleanup while preserving the existing resource
disposal and animation cancellation behavior.
---
Nitpick comments:
In `@frontend/src/app/`(public)/wiki/page.tsx:
- Around line 31-39: Make the lede prop optional in Section and render the
paragraph only when lede has content, so the privacy section does not produce an
empty element or spacing. Remove the lede="" argument from the privacy Section
usage while preserving existing lede rendering for other sections.
In `@frontend/src/components/landing-v5/Closing.tsx`:
- Around line 75-92: Share the companion-page link list currently duplicated as
FOOTER_LINKS in SiteFooter and PAGES in Navbar by exporting one canonical list
and importing it in both components, preserving all six label/href pairs. Update
the footer Image in SiteFooter to use an empty alt value so the adjacent Sapling
text is announced only once.
In `@frontend/src/components/landing-v5/FeatureLab.tsx`:
- Around line 94-119: Add an aria-current="true" attribute to the selected rail
button rendered in the GAL.map callback, using the existing on condition so
assistive technology identifies the active tool without relying on color.
In `@frontend/src/components/landing-v5/Gallery.tsx`:
- Around line 71-73: Remove the redundant wrapper div around GALLERY_MINIS[i] in
Gallery, rendering the miniature directly while preserving its existing
placement and aria-hidden behavior. Do not modify the generated galleryMinis.tsx
entries.
In `@frontend/src/components/landing-v5/lab/GradesDemo.tsx`:
- Around line 62-65: Clamp the parsed score used in the row percentage
calculation within the same [0, r.possible] bounds already applied to the
weighted grade. Update the percentage logic in the GB_ROWS map callback,
preserving the existing null handling and color thresholds while ensuring values
above or below the row limits cannot produce percentages outside 0–100.
In `@frontend/src/components/landing-v5/lab/labData.ts`:
- Line 13: Remove the exported TIER constant from labData.ts, since it
duplicates the matching LAB_TIER swatch set. Update any references in labData.ts
to use LAB_TIER instead, preserving the existing keys and color values.
In `@frontend/src/components/landing-v5/lab/LabShell.tsx`:
- Around line 51-84: Resolve the unused Segmented component by replacing the
duplicated inline segmented-control markup in CalendarDemo and TutorDemo with
the shared Segmented component, passing each demo’s options, current value, and
change handler. Preserve the existing labels, selection behavior, and styling,
and keep the component’s public API unchanged.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx`:
- Around line 33-35: Update the difficulty derivation in QuizDemo so the badge
remains tied to the difficulty assigned when the current question was served,
rather than recomputing from the mutable streak during review. Capture or derive
the question-start difficulty using the existing answer/question state (such as
answers.length), and keep the displayed difficulty stable until qi advances.
In `@frontend/src/components/landing/useLanding.ts`:
- Around line 378-392: Replace the lifetime polling interval in the reveal setup
around scan with a MutationObserver watching root for added elements, invoking
scan when matching content mounts later. Keep the initial scan, existing seen/io
behavior, and cleanup, but disconnect the mutation observer instead of clearing
an interval.
In `@frontend/src/lib/landing/engine/flip.ts`:
- Around line 24-25: Remove the unused FlipState.ran field and its assignments
in armFlip and flipClose, since useLanding already owns this guard through
flipRan. Keep the existing flipRan-based behavior unchanged and avoid
maintaining duplicate state for the same invariant.
In `@frontend/src/lib/landing/engine/graph.ts`:
- Around line 122-127: Replace the random-comparator sort in the reveal-order
logic with an unbiased Fisher–Yates shuffle of the index array. Keep the
existing spawnAt and colorAt calculations and node ordering behavior after
shuffling unchanged.
In `@frontend/src/lib/landing/engine/hero.ts`:
- Around line 99-136: Filter the projected nodes immediately after the `proj`
mapping so only entries with `p.z > -FL` remain before sorting and running the
link pass. Reuse this filtered collection for both link rendering and the later
point-rendering pass, then remove the now-redundant `p.z > -FL` guard in the
point pass.
In `@frontend/src/lib/landing/engine/marquee.ts`:
- Around line 136-144: Remove the per-frame wrap.clientWidth read from update()
and move width-change detection to bind using a ResizeObserver on wrap. Have the
observer mark m.setW stale, register ro.disconnect in cleanups, and preserve the
existing measurement logic when update() sees stale state without reading layout
every tick.
In `@frontend/src/lib/landing/engine/sim.ts`:
- Around line 282-299: Update bindDrag so up ignores pointer events whose
pointerId does not match f.drag.id, matching onMove’s active-pointer validation.
Move the window-level pointermove, pointerup, and pointercancel listener
registration out of the per-cluster binding loop and register each once per
group, while keeping the per-SVG listeners on the individual cluster SVG.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 865084a7-2f4d-472c-accd-6f67530e2a35

📥 Commits

Reviewing files that changed from the base of the PR and between ec34bf1 and 741ec10.

⛔ Files ignored due to path filters (3)

• frontend/public/journal-ai-homework.png is excluded by !**/*.png
• frontend/public/journal-founding.png is excluded by !**/*.png
• frontend/public/kofi-symbol.png is excluded by !**/*.png

📒 Files selected for processing (75)

• frontend/e2e/landing-graph.spec.ts
• frontend/e2e/public-seo.spec.ts
• frontend/eslint-suppressions.json
• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/companion/primitives.tsx
• frontend/src/components/landing-v5/ActGraph.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/ActTutor.tsx
• frontend/src/components/landing-v5/Closing.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/Faq.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/components/landing-v5/Gallery.tsx
• frontend/src/components/landing-v5/Hero.tsx
• frontend/src/components/landing-v5/IntroOverlay.tsx
• frontend/src/components/landing-v5/Journal.tsx
• frontend/src/components/landing-v5/Navbar.tsx
• frontend/src/components/landing-v5/galleryMinis.tsx
• frontend/src/components/landing-v5/lab/CalendarDemo.tsx
• frontend/src/components/landing-v5/lab/CardsDemo.tsx
• frontend/src/components/landing-v5/lab/GradesDemo.tsx
• frontend/src/components/landing-v5/lab/GuideDemo.tsx
• frontend/src/components/landing-v5/lab/LabShell.tsx
• frontend/src/components/landing-v5/lab/NotesDemo.tsx
• frontend/src/components/landing-v5/lab/QuizDemo.tsx
• frontend/src/components/landing-v5/lab/RoomsDemo.tsx
• frontend/src/components/landing-v5/lab/TutorDemo.tsx
• frontend/src/components/landing-v5/lab/index.tsx
• frontend/src/components/landing-v5/lab/labData.ts
• frontend/src/components/landing-v5/navTheme.ts
• frontend/src/components/landing/useLanding.ts
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx
• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/lib/landing/color.ts
• frontend/src/lib/landing/companionContent.ts
• frontend/src/lib/landing/content.ts
• frontend/src/lib/landing/course.ts
• frontend/src/lib/landing/dragClusters.ts
• frontend/src/lib/landing/engine/ambient.ts
• frontend/src/lib/landing/engine/dom.ts
• frontend/src/lib/landing/engine/flip.ts
• frontend/src/lib/landing/engine/graph.ts
• frontend/src/lib/landing/engine/graphView.ts
• frontend/src/lib/landing/engine/hero.ts
• frontend/src/lib/landing/engine/index.ts
• frontend/src/lib/landing/engine/marquee.ts
• frontend/src/lib/landing/engine/measure.ts
• frontend/src/lib/landing/engine/plant.ts
• frontend/src/lib/landing/engine/sim.ts
• frontend/src/lib/landing/hero3d/cardTexture.ts
• frontend/src/lib/landing/hero3d/index.ts

💤 Files with no reviewable changes (20)

• frontend/src/components/marketing/surfaces/RoomsSurface.tsx
• frontend/src/components/marketing/FeatureBand.tsx
• frontend/src/components/marketing/FeatureBand.test.tsx
• frontend/src/components/marketing/graph/layout.test.ts
• frontend/src/components/marketing/surfaces/TutorSurface.tsx
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.tsx
• frontend/src/components/marketing/graph/courseGraphs.test.ts
• frontend/src/components/marketing/surfaces/NotesSurface.tsx
• frontend/src/components/marketing/SurfaceBento.tsx
• frontend/src/components/marketing/featureBands.tsx
• frontend/src/components/marketing/surfaces/GradebookSurface.tsx
• frontend/src/components/marketing/surfaces/UploadSurface.tsx
• frontend/src/components/marketing/surfaces/Surface.tsx
• frontend/src/components/marketing/graph/courseGraphs.ts
• frontend/e2e/landing-graph.spec.ts
• frontend/src/components/marketing/surfaces/QuizSurface.tsx
• frontend/src/components/marketing/graph/layout.ts
• frontend/src/components/marketing/graph/KnowledgeGraphDemo.test.tsx
• frontend/src/components/marketing/SurfaceBento.test.tsx
• frontend/src/components/marketing/surfaces/ReviewSurface.tsx

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

Use kebab-case keyframe names.

Stylelint reports every new camelCase keyframe identifier against keyframes-name-pattern. This leaves lint errors in the changed stylesheet. Rename the declarations to kebab case and update every matching animation or animation-name reference in the same change.

Also applies to: 2031-2033, 2082-2082, 2094-2096

🧰 Tools

🪛 Stylelint (17.14.0)

[error] 1957-1957: Expected keyframe name "s1Stem" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1958-1958: Expected keyframe name "s1LeafLo" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1964-1964: Expected keyframe name "s1LeafHi" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1970-1970: Expected keyframe name "s1Bud" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1971-1971: Expected keyframe name "s1Word" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1972-1972: Expected keyframe name "s1Rule" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1975-1975: Expected keyframe name "saplingBlob" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1976-1976: Expected keyframe name "introOrbit" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1977-1977: Expected keyframe name "floatIndicator" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1978-1978: Expected keyframe name "betaGlow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1979-1979: Expected keyframe name "nodeFloatA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1980-1980: Expected keyframe name "nodeFloatB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1983-1983: Expected keyframe name "popHold" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1984-1984: Expected keyframe name "chipSwapA" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1985-1985: Expected keyframe name "chipSwapB" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1986-1986: Expected keyframe name "flipLoop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1987-1987: Expected keyframe name "lineReveal" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1988-1988: Expected keyframe name "underSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1989-1989: Expected keyframe name "barGrow" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1990-1990: Expected keyframe name "coverRise" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1991-1991: Expected keyframe name "ringDraw" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1992-1992: Expected keyframe name "gaugeFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1993-1993: Expected keyframe name "answerTick" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1994-1994: Expected keyframe name "waveBar" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1995-1995: Expected keyframe name "gaugeMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1996-1996: Expected keyframe name "coverMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1997-1997: Expected keyframe name "cursorMini" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1998-1998: Expected keyframe name "cardFloat" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 1999-1999: Expected keyframe name "scanSweep" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2000-2000: Expected keyframe name "ocrBlink" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2001-2001: Expected keyframe name "panelFade" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2002-2002: Expected keyframe name "fillX" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2003-2003: Expected keyframe name "typingDot" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2004-2004: Expected keyframe name "ringPop" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

---

[error] 2005-2005: Expected keyframe name "cursorDrift" to be kebab-case (keyframes-name-pattern)

(keyframes-name-pattern)

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/app/globals.css` around lines 1957 - 2005, Rename the camelCase
keyframe declarations in the affected stylesheet to kebab-case, including
symbols such as s1Stem, saplingBlob, introOrbit, popHold, and the additional
reported ranges. Update every corresponding animation and animation-name
reference to the new kebab-case identifiers, preserving all animation behavior.

Source: Linters/SAST tools

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | 🏗️ Heavy lift

The overlay is a modal without dialog semantics or focus management.

The panel covers the viewport at zIndex: 80 and the caller locks body scroll. Three parts are missing:

• No role="dialog" and no aria-modal="true", so assistive technology does not announce a modal context.
• No accessible name on the container.
• No focus management. Focus stays on the gallery card behind the overlay, tabbing walks the page underneath, and closing does not return focus to the card that opened the panel.

Escape already closes the panel through useLanding.ts lines 272-276, so only the semantics and focus handling remain.

♿ Proposed direction

- <div style={{ position: 'fixed', inset: 0, zIndex: 80 }}>+ <div+ role="dialog"+ aria-modal="true"+ aria-label={`${g.kicker} demo`}+ style={{ position: 'fixed', inset: 0, zIndex: 80 }}+ >

Then move focus into the panel when it mounts, keep Tab inside it while it is open, and restore focus to the element captured by armFlip when it closes. frontend/src/lib/landing/engine/flip.ts already holds that element in FlipState.el.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/FeatureLab.tsx` around lines 41 - 50,
Update the modal container identified by panelRef in FeatureLab to add
role="dialog", aria-modal="true", and an accessible name. On mount, move focus
into the panel; while open, trap Tab navigation within it so focus cannot reach
the page behind the overlay. Capture and restore focus to the triggering element
stored in FlipState.el when the panel closes, while preserving the existing
Escape close behavior.

[coderabbitai]

📐 Maintainability & Code Quality | 🟠 Major | ⚡ Quick win

The gallery cards cannot be opened with a keyboard.

Opening the feature lab depends on the onClick delegation on the track div at lines 99-102. Card renders an <article> with no tabIndex, no role, and no key handler, and the track div has no key handler either. A keyboard user cannot reach or activate any card, so the feature lab is unreachable without a pointer. The doc comment at lines 14-15 states that the first copy is reachable by keyboard, which does not match the markup.

Make each non-ghost card an activatable control, keep the duplicate copies out of the tab order, and then correct the doc comment.

♿ Proposed fix

-function Card({ i, ghost }: { i: number; ghost: boolean }) {+function Card({ i, ghost, onOpen }: { i: number; ghost: boolean; onOpen: (i: number, el: HTMLElement | null) => void }) {
const c = CARDS[i];
return (
<article
data-tk={i}
aria-hidden={ghost || undefined}
+ role="button"+ tabIndex={ghost ? -1 : 0}+ aria-label={`Open ${c.kicker}`}+ onKeyDown={(e) => {+ if (e.key !== 'Enter' && e.key !== ' ') return;+ e.preventDefault();+ onOpen(i, e.currentTarget);+ }}
style={CARD}
className="ld-galcard"
>

- {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} />)}- {order.map((i) => <Card key={`b${i}`} i={i} ghost />)}+ {order.map((i) => <Card key={`a${i}`} i={i} ghost={false} onOpen={onOpen} />)}+ {order.map((i) => <Card key={`b${i}`} i={i} ghost onOpen={onOpen} />)}

Add a visible focus style for .ld-galcard:focus-visible in globals.css.

Also applies to: 96-107

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/Gallery.tsx` around lines 62 - 85, Update
Card so non-ghost cards are keyboard-focusable and activatable, using the
existing track click-delegation contract, while ghost duplicates remain excluded
from the tab order and accessibility tree. Add the corresponding keyboard
activation handling to the card or track using the existing feature-lab target
behavior, and correct the nearby doc comment to match the implemented
accessibility behavior. Add a visible .ld-galcard:focus-visible style in
globals.css.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

Handler timeouts are created without a ref, so they are never cancelled. Both demos schedule a state update from an event handler without storing the handle. The timeout cannot be cleared on unmount, and a second click cannot cancel a pending one. The other demos in this layer already hold each handle in a useRef and clear it in an unmount effect.

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44: store the 300 ms advance timeout in a ref, clear it before each new rating, and clear it on unmount; delete the returned cleanup, which React never calls.
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80: store the 700 ms extract and summarize timeouts in refs and clear them in the existing unmount effect beside saveT.

📍 Affects 2 files

• frontend/src/components/landing-v5/lab/CardsDemo.tsx#L37-L44 (this comment)
• frontend/src/components/landing-v5/lab/NotesDemo.tsx#L57-L80

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/CardsDemo.tsx` around lines 37 - 44,
Update CardsDemo.tsx at lines 37-44 so the 300 ms timeout in the rate handler is
stored in a useRef, cleared before scheduling each new rating and during
unmount, and remove the ineffective returned cleanup. Update NotesDemo.tsx at
lines 57-80 so the 700 ms extract and summarize timeouts use refs and are
cleared in the existing unmount effect alongside saveT.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

RECENT[].pick values are not options of the exam select.

openRecent at line 53 sets exam to r.pick. 'Midterm 1 · Sep 30' is not in GUIDES['MA 242'].exams, and 'Quiz 2 · Oct 03' is not in GUIDES['CS 201'].exams. The controlled select at line 76 then falls back to displaying its first option while the guide heading at line 104 prints exam. The control and the heading disagree, and the user cannot select the displayed exam again.

Use an exam that exists in the course fixture, or add the recent exam to the option list when it is selected.

🔧 Proposed fix using existing fixture values

 const RECENT = [
- { i: 0, exam: 'MA 242 · Midterm 1', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Midterm 1 · Sep 30' },- { i: 1, exam: 'CS 201 · Quiz 2', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Quiz 2 · Oct 03' },+ { i: 0, exam: 'MA 242 · Final', meta: 'GENERATED SEP 28', course: 'MA 242' as CourseKey, pick: 'Final · Dec 12' },+ { i: 1, exam: 'CS 201 · Midterm 1', meta: 'GENERATED OCT 03', course: 'CS 201' as CourseKey, pick: 'Midterm 1 · Oct 17' },
];

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	constRECENT=[
	{i: 0,exam: 'MA 242 · Midterm 1',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Midterm 1 · Sep 30'},
	{i: 1,exam: 'CS 201 · Quiz 2',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Quiz 2 · Oct 03'},
	];
	constRECENT=[
	{i: 0,exam: 'MA 242 · Final',meta: 'GENERATED SEP 28',course: 'MA 242'asCourseKey,pick: 'Final · Dec 12'},
	{i: 1,exam: 'CS 201 · Midterm 1',meta: 'GENERATED OCT 03',course: 'CS 201'asCourseKey,pick: 'Midterm 1 · Oct 17'},
	];

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/GuideDemo.tsx` around lines 21 - 24,
Update the RECENT entries’ pick values to exactly match an existing exam option
in the corresponding GUIDES course fixture, preserving openRecent’s assignment
and keeping the select value consistent with the guide heading.

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

role="radiogroup" has no radio children.

The container declares role="radiogroup", but each option is a plain <button>. A radiogroup requires children with role="radio" and aria-checked. Assistive technology cannot report which option is selected. Add the roles and state, or drop role="radiogroup" and expose selection with aria-pressed.

♿ Proposed fix

 <button
key={o.label}
type="button"
+ role="radio"+ aria-checked={isPicked}+ aria-disabled={reviewing}
onClick={() => { if (!reviewing) setPicked(o.label); }}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='#E3E0D5',bg='#FDFCF9',fg='#33443B',mark='',markCol='';
	if(reviewing&&correct){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';mark='CORRECT';markCol='#0C5638';}
	elseif(reviewing&&isPicked){bd='#b25855';bg='rgba(178,88,85,0.09)';fg='#9c4b48';mark='YOUR PICK';markCol='#9c4b48';}
	elseif(isPicked){bd='#0E9E5A';bg='#E6F2E8';fg='#0C5638';}
	return(
	<button
	key={o.label}
	type="button"
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '#0E9E5A' : '#9AA5A0'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}
	<divrole="radiogroup"style={{marginTop: 16,display: 'flex',flexDirection: 'column',gap: 8}}>
	{q.options.map((o)=>{
	constisPicked=o.label===picked;
	constcorrect='correct'ino&&o.correct;
	letbd='`#E3E0D5`',bg='`#FDFCF9`',fg='`#33443B`',mark='',markCol='';
	if(reviewing&&correct){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';mark='CORRECT';markCol='`#0C5638`';}
	elseif(reviewing&&isPicked){bd='`#b25855`';bg='rgba(178,88,85,0.09)';fg='`#9c4b48`';mark='YOUR PICK';markCol='`#9c4b48`';}
	elseif(isPicked){bd='`#0E9E5A`';bg='`#E6F2E8`';fg='`#0C5638`';}
	return(
	<button
	key={o.label}
	type="button"
	role="radio"
	aria-checked={isPicked}
	aria-disabled={reviewing}
	onClick={()=>{if(!reviewing)setPicked(o.label);}}
	style={{textAlign: 'left',display: 'flex',gap: 10,alignItems: 'flex-start',padding: '12px 14px',borderRadius: 10,fontFamily: "'DM Sans',sans-serif",fontSize: 14,transition: 'all 180ms',border: `1px solid ${bd}`,background: bg,color: fg,cursor: reviewing ? 'default' : 'pointer'}}
	>
	<spanstyle={{ ...MONO,fontSize: 12,color: isPicked||(reviewing&&correct) ? '`#0E9E5A`' : '`#9AA5A0`'}}>{o.label}.</span>
	<span>{o.text}</span>
	<spanstyle={{marginLeft: 'auto', ...MONO,fontSize: 11,letterSpacing: '0.14em',color: markCol}}>{mark}</span>
	</button>
	);
	})}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/lab/QuizDemo.tsx` around lines 104 - 124,
Fix the quiz option accessibility semantics in the q.options mapping: either
make each button a radio with role="radio" and aria-checked bound to isPicked
while retaining the radiogroup, or remove the radiogroup role and expose
isPicked through aria-pressed. Preserve the existing selection and reviewing
behavior in the option onClick handler.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

The hero canvas effect can start a loop that is never stopped.

import('@/lib/landing/engine/hero') resolves asynchronously. If the component unmounts before the promise resolves, the cleanup at line 222 runs while stopped is still null. The then callback then calls startHeroCanvas, which installs a requestAnimationFrame loop and a resize listener (see frontend/src/lib/landing/engine/hero.ts lines 83-87). Nothing cancels them afterwards, so the loop keeps drawing after navigation away from the landing page.

The WebGL effect at lines 227-244 already uses a cancelled flag. Apply the same pattern here.

🛠️ Proposed fix

 let stopped: { stop(): void } | null = null;
+ let cancelled = false;
// imported lazily so the module isn't pulled into the server bundle
import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas }) => {
+ if (cancelled) return;
stopped = startHeroCanvas(canvas, () => engine.mouse, () => engine.parallaxY);
});
- return () => stopped?.stop();+ return () => {+ cancelled = true;+ stopped?.stop();+ };

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	// imported lazily so the module isn't pulled into the server bundle
	import('@/lib/landing/engine/hero').then(({ startHeroCanvas })=>{
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>stopped?.stop();
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);
	useEffect(()=>{
	constcanvas=refs.heroCanvas.current;
	constengine=engineRef.current;
	if(!canvas||!engine)return;
	letstopped: {stop(): void}|null=null;
	letcancelled=false;
	// imported lazily so the module isn't pulled into the server bundle
	import('`@/lib/landing/engine/hero`').then(({ startHeroCanvas })=>{
	if(cancelled)return;
	stopped=startHeroCanvas(canvas,()=>engine.mouse,()=>engine.parallaxY);
	});
	return()=>{
	cancelled=true;
	stopped?.stop();
	};
	// eslint-disable-next-line react-hooks/exhaustive-deps
	},[]);

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing/useLanding.ts` around lines 213 - 224, Update
the hero canvas useEffect around startHeroCanvas to track a cancelled/unmounted
flag. Set it during cleanup, check it after the asynchronous hero module import
resolves before starting the canvas, and stop the returned controller when
appropriate so no animation loop or resize listener remains after unmount.

[coderabbitai]

🩺 Stability & Availability | 🟠 Major | 🏗️ Heavy lift

destroy() discards the re-homed clusters, so the field cannot be rebuilt.

ensureInit moves every cluster element out of its .drag-field and into the overlay (line 172), and it mutates the cluster's inline styles (lines 165-171). destroy() removes the shell through the queued cleanup, which deletes those cluster elements from the document. It does not put them back.

Two consequences:

1. A second ensureInit on the same DOM finds .drag-field elements with no [data-dragnode] children, returns false at line 232, and the field stays empty forever. This happens on any stop/start cycle, including the React StrictMode double-invoke of the engine effect in frontend/src/components/landing/useLanding.ts lines 162-210.
2. React still owns those cluster nodes, because DragField rendered them. React records the original parent for each child. Removing or reparenting the nodes outside React can make the later unmount removal fail.

Restore each cluster to its original parent and clear the inline styles that ensureInit set.

🛠️ Proposed fix: remember the original parent and restore it on destroy

 interface ClusterAnchor {
el: HTMLElement;
field: HTMLElement;
+ /** Where the cluster lived before it was re-homed into the overlay. */+ home: Node | null;+ before: Node | null;
/** The pinned act this field belongs to, if any — drives the scroll drift. */
sect: HTMLElement | null;
left: number;
top: number;
}

 anchors.push({
el: cl, field, sect,
+ home: cl.parentNode,+ before: cl.nextSibling,
left: b.left - fb.left,
top: b.top - fb.top,
});

 function destroy(): void {
+ // put the clusters back before the overlay goes away, otherwise React+ // still owns nodes that no longer exist and a later ensureInit finds+ // empty fields+ for (const a of anchors) {+ a.el.style.cssText = '';+ if (a.home) a.home.insertBefore(a.el, a.before);+ }
cleanups.forEach((fn) => fn());
cleanups.length = 0;
anchors.length = 0;
groups = null;
- if (overlay && overlay.parentElement) overlay.parentElement.removeChild(overlay);
overlay = null;
}

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/lib/landing/engine/sim.ts` around lines 423 - 430, Update the
initialization and destroy flow around ensureInit and destroy to retain each
cluster element’s original parent before moving it into the overlay. During
destroy, restore every cluster to that parent, clear the inline styles applied
by ensureInit, then remove the overlay and reset state so a later ensureInit can
rebuild the field without disrupting React-owned nodes.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/landing-v5/BetaModal.tsx`:
- Around line 52-70: Update the subscribed confirmation branch in BetaModal so
the rendered Close button receives focus after the form is replaced. Add a ref
to that button and focus it after the subscribed state commits, using the
component’s existing lifecycle pattern; preserve the current onClose behavior
and button styling.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: ee1ca146-7600-423b-98c7-56bcec09e4e1

📥 Commits

Reviewing files that changed from the base of the PR and between 741ec10 and e506827.

📒 Files selected for processing (13)

• frontend/src/app/(public)/faq/page.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/app/(public)/page.tsx
• frontend/src/app/(public)/team/page.tsx
• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/globals.css
• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/components/landing-v5/BetaModal.tsx
• frontend/src/components/landing-v5/DragField.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx
• frontend/src/lib/landing/content.ts

💤 Files with no reviewable changes (2)

• frontend/src/components/companion/CompanionShell.tsx
• frontend/src/components/landing-v5/FeatureLab.tsx

🚧 Files skipped from review as they are similar to previous changes (5)

• frontend/src/app/(public)/wiki/page.tsx
• frontend/src/app/(public)/news/page.tsx
• frontend/src/components/landing-v5/ActIngest.tsx
• frontend/src/app/(public)/gallery/page.tsx
• frontend/src/lib/landing/content.ts

[coderabbitai]

🎯 Functional Correctness | 🟠 Major | ⚡ Quick win

Restore modal focus after the subscribed state replaces the form.

When subscribed becomes true, this branch unmounts the focused email input while Dialog remains open. Dialog only applies its initial focus when open changes. Focus can then leave the dialog and bypass its Tab trap. Move focus to the Close button after the confirmation state renders.

Proposed fix

-import { useId, useRef } from 'react';+import { useEffect, useId, useRef } from 'react';
...
const inputRef = useRef<HTMLInputElement>(null);
+ const confirmationCloseRef = useRef<HTMLButtonElement>(null);
const headingId = useId();
const valid = email.includes('@');
++ useEffect(() => {+ if (open && subscribed) confirmationCloseRef.current?.focus();+ }, [open, subscribed]);
...
<button
+ ref={confirmationCloseRef}
onClick={onClose}

📝 Committable suggestion

‼️IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '#12201A',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '#0C5638'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '#61726A',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '#0C5638',color: '#fff',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>
	{subscribed ? (
	<divstyle={{textAlign: 'center',padding: '10px 4px 6px'}}>
	{/*carriesheadingIdtoo—itiswhat`aria-labelledby`pointsat
	oncetheform is replacedbythisstate*/}
	<h2id={headingId}style={{margin: 0,fontFamily: "'Playfair Display',serif",fontSize: 30,fontWeight: 600,color: '`#12201A`',lineHeight: 1.1}}>
	You&rsquo;reonthe<emstyle={{color: '`#0C5638`'}}>tree.</em>
	</h2>
	<pstyle={{margin: '10px 0 0',fontSize: 14,color: '`#61726A`',fontStyle: 'italic'}}>
	Seeyouintheinbox·TheTeam
	</p>
	<button
	ref={confirmationCloseRef}
	onClick={onClose}
	type="button"
	className="ld-btn-solid"
	style={{marginTop: 22,background: '`#0C5638`',color: '`#fff`',border: 'none',borderRadius: 6,padding: '13px 26px',fontFamily: "'DM Sans',sans-serif",fontWeight: 600,fontSize: 14,cursor: 'pointer',transition: 'filter 200ms'}}
	>
	Close
	</button>
	</div>

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@frontend/src/components/landing-v5/BetaModal.tsx` around lines 52 - 70,
Update the subscribed confirmation branch in BetaModal so the rendered Close
button receives focus after the form is replaced. Add a ref to that button and
focus it after the subscribed state commits, using the component’s existing
lifecycle pattern; preserve the current onClose behavior and button styling.