Remove the header's hidden scroll region: section pills become a fixed grid on mobile

The section nav (Plan/Bean/Machine/Log/After) was an overflow-x:auto
strip with hidden scrollbars — undiscoverable on touch. It now wraps on
desktop and renders as a fixed five-column grid of equal pills at
≤720px (labels shortened to fit 320px), and the actions row lets the
autosave chip shrink/ellipsize so nothing can force horizontal overflow.

Co-Authored-By: Claude Fable 5 <[email protected]>

public/index.html

@@ -65,8 +65,8 @@
           <nav class="section-nav" id="section-nav" aria-label="Plan sections">
             <a href="#sec-coffee">Plan</a>
             <a href="#sec-bean">Bean</a>
-            <a href="#sec-machine">Machine plan</a>
-            <a href="#sec-roastlog">Roast log</a>
+            <a href="#sec-machine">Machine</a>
+            <a href="#sec-roastlog">Log</a>
             <a href="#sec-after">After</a>
           </nav>