Storyline: split the chapter page, dock the notes at the bottom

The chapter page now fills the viewport as two horizontal panes: the
chapter scrolls in the top ~2/3, the notes sit in a fixed dock in the
bottom ~1/3, always visible while you read. Drag the divider to change
the ratio, click the "Chapter notes" header to collapse the dock to a
bar; both the height and the collapsed state persist in localStorage.

- base.html.twig: add a {% block body_class %} hook on <body>.
- chapter.html.twig sets body class "storyline-chapter-page"; the split
  layout CSS is scoped to it and falls back to normal stacked flow under
  768px wide or 560px tall.
- app.js publishes the navbar height as --app-nav-h so the split can size
  itself to viewport-minus-navbar even when the navbar wraps.
- new chapter_notes Stimulus controller: drag-resize + collapse + persist.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

assets/app.js

@@ -145,3 +145,16 @@ document.addEventListener('shown.bs.collapse', (e) => rememberStatblock(e.target
 document.addEventListener('hidden.bs.collapse', (e) => rememberStatblock(e.target, false));
 document.addEventListener('DOMContentLoaded', restoreStatblocks);
 document.addEventListener('turbo:load', restoreStatblocks);
+
+// --- Publish the navbar height as --app-nav-h -------------------------
+// The storyline chapter page sizes its split view to the viewport minus the
+// navbar; the navbar grows when it wraps, so measure it rather than guess.
+function publishNavHeight() {
+    const nav = document.querySelector('.navbar');
+    const h = nav ? Math.round(nav.getBoundingClientRect().height) : 56;
+    document.documentElement.style.setProperty('--app-nav-h', `${h}px`);
+}
+
+document.addEventListener('DOMContentLoaded', publishNavHeight);
+document.addEventListener('turbo:load', publishNavHeight);
+window.addEventListener('resize', publishNavHeight);