feat(story): sticky nav title + floating back-to-top pill

Nav title: absolutely centered in the site-header, fades in via
IntersectionObserver when .story-hero__content scrolls above the fold.
Hidden on mobile (< 640px) where there is no room.

Back-to-top: fixed bottom-right pill, appears after 80% of the hero
viewport is scrolled past, smooth-scrolls to top on click.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Vgmzx8VTTTmCskSpQtsLTr

themes/intotheeast/templates/story.html.twig

@@ -2,6 +2,7 @@
 
 {% block nav %}
 <a class="story-escape" href="{{ page.parent().url }}" onclick="if(history.length > 1){ history.back(); return false; }">← Back</a>
+<span class="story-nav-title" id="story-nav-title" aria-hidden="true">{{ page.title }}</span>
 {% endblock %}
 
 {% block content %}
@@ -50,6 +51,8 @@
     </footer>
 </div>
 
+<button class="story-totop" id="story-totop" aria-label="Back to top">↑ Top</button>
+
 <script src="https://cdn.jsdelivr.net/npm/scrollama@3/build/scrollama.min.js"></script>
 <script>
 /* ── Hero scroll effect ──────────────────────────────────── */
@@ -85,6 +88,34 @@
     update();
 })();
 
+/* ── Story title in nav (fades in when hero title leaves viewport) ─────── */
+(function () {
+    var navTitle    = document.getElementById('story-nav-title');
+    var heroContent = document.querySelector('.story-hero__content');
+    if (!navTitle || !heroContent) return;
+    new IntersectionObserver(function (entries) {
+        navTitle.classList.toggle('is-visible', !entries[0].isIntersecting);
+    }, { threshold: 0 }).observe(heroContent);
+})();
+
+/* ── Back to top button ─────────────────────────────────── */
+(function () {
+    var btn       = document.getElementById('story-totop');
+    if (!btn) return;
+    var threshold = window.innerHeight * 0.8;
+    var shown     = false;
+    btn.addEventListener('click', function () {
+        window.scrollTo({ top: 0, behavior: 'smooth' });
+    });
+    window.addEventListener('scroll', function () {
+        var shouldShow = window.scrollY > threshold;
+        if (shouldShow !== shown) {
+            shown = shouldShow;
+            btn.classList.toggle('is-visible', shown);
+        }
+    }, { passive: true });
+})();
+
 /* ── ChapterBreak scroll-reveal ─────────────────────────── */
 (function () {
     var reduced = window.matchMedia('(prefers-reduced-motion: reduce)').matches;