Summary

Rebuilds the student section sign-in page (sections#show, /sections/:code)
with design-system components. The page was server-rendered HAML (raw
name/secret-picture tiles driven by jQuery, a word-login text field, a
pair-programming checkbox, and a .btn-primary login button); it's now a React
component (SectionSignIn) built from DSCO components.

What changed

• SectionSignIn.jsx (new) — MUI Typography (welcome + instructions),
  DSCO TextField (word login), DSCO Checkbox (pair-programming), MUI Button
  (login). The name/secret-picture selection tiles have no DSCO equivalent,
  so they're custom <button>s styled with semantic tokens (neutral
  default/hover, --background-brand-teal-light selected).
• sections/show.js — the entry now mounts the React component (was jQuery);
  mount deferred to DOMContentLoaded (the entry script precedes the mount div).
• sections/show.html.haml — replaced the form markup with a mount point +
  a <script> carrying the data; kept the student-privacy footnote
  server-rendered (markdown + link).
• application.scss — removed the now-dead #signinsection block.

Interactive flow + submission preserved

React state replicates the legacy flow: pick a name → reveal the secret
picture grid / word field and show the (disabled) login; pick a secret → enable
login and show the pairing checkbox; picking a different name resets the secret.
The form is still a native POST to /sections/:code/log_in with the Rails
CSRF token (hidden user_id / secret_picture_id / secret_words /
show_pairing_dialog), so server-side authentication is unchanged.
clientState.reset() still runs on submit. Translated copy, student +
secret-picture data (picture URLs via image_path), CSRF token, and submit path
are passed from the view.

Links

• Jira: RE-107

Testing story

• Lint: ./tools/hooks/pre-commit clean; yarn build succeeds (reuses the
  sections/show entry).
• Manual (browser, default codeai + codeai-next pink-audit brands): drove
  the full flow on a picture-login section — name select reveals the 22-picture
  grid with the login disabled and user_id set; picture select enables login
  (brand-purple in prod, pink under audit), sets secret_picture_id, and shows
  the pairing checkbox; the form is a native POST /sections/:code/log_in with
  the CSRF token. No console/page errors. Tiles resolve through DSCO tokens
  (neutral in prod, pink under audit; selected = brand-teal-light).

Notes for reviewers

• The word-login path (secret_words TextField) and the pairing checkbox
  are wired but I only had a picture-login section locally — worth a QA pass on a
  word-login section and on actually completing a sign-in.
• Selection tiles are custom (no DSCO selectable-tile/chip component exists);
  they use semantic tokens per the rebrand fallback rule.
• Scoped out: site header/footer.