feat(structure): compact archive + tag pages + hero/featured, and fix site search

Found a real bug while verifying the nav search: /pagefind/pagefind.js is an ES
module that defines no window.Pagefind, but Search.astro loaded it with a classic
<script src> and read window.Pagefind — so every query answered "Search is
unavailable." (confirmed live before the fix). Now a dynamic import; the specifier
must be a variable or Rollup resolves it at build time and the build fails.

Measured before/after in a real browser:

- archive /posts/ + /zh/posts/: 18,220px -> 3,788px (71 rows at 44px, grouped by
  year) with a client-side filter (title/tags/description text, category chips,
  14 tag chips, zero requests). Tested: "nginx" -> 6 rows, chip devops -> 28.
- tag pages for tags with >= 3 posts. Measured 235 distinct tags (an earlier brief
  claimed 74), 156 used exactly once — pages only where a topic exists: 40 tags ->
  80 pages, build 165 -> 245 pages. Pills link only when a page exists.
- homepage + ZH homepage: hero (288px) with the real scale claim, three CTAs, a
  fixed Featured 4 (scale -> automation -> observability -> a delivered result),
  Latest 10 -> 6. ZH hero had linked "关于我" to the English /about/.
- long code blocks collapse above 420px with an Expand button + gradient, copy
  button still copies the whole block (verified on the 1010px block).
- search is visible ("⌕ Search /" pill, "/" plus the existing Ctrl/Cmd+K) and the
  zero-result screen offers topic chips instead of a dead end.

Docs: project-state B3 entry, ops-runbook Pagefind gotcha.

src/layouts/BaseLayout.astro

@@ -180,7 +180,9 @@ const nav = isZh
         <a href={isZh ? '/zh/categories/' : '/categories/'}>{nav.categories}</a>
         <a href={isZh ? '/zh/about/' : '/about/'}>{nav.about}</a>
         <a href="/rss.xml" title={nav.rss}>{nav.rss}</a>
-        <button class="search-toggle" id="search-toggle" aria-label={isZh ? '搜索' : 'Search'}>⌕</button>
+        <button class="search-toggle" id="search-toggle" aria-label={isZh ? '搜索' : 'Search'}>
+          ⌕ <span class="search-hint">{isZh ? '搜索' : 'Search'}</span><kbd class="search-key">/</kbd>
+        </button>
         <a class="lang-switch" href={resolvedSwitchHref} aria-label={isZh ? 'Switch to English' : '切换到中文'}>{switchLabel}</a>
         <button class="theme-toggle" id="theme-toggle" aria-label="Toggle theme">◐</button>
       </nav>
@@ -230,6 +232,31 @@ const nav = isZh
           });
         });
         wrap.appendChild(b);
+
+        // Long code blocks: collapse anything taller than ~22 lines so the prose keeps
+        // flowing, with an explicit expand control (and the copy button still copies the
+        // FULL block, because the text is only hidden by CSS).
+        if (pre.scrollHeight > 420) {
+          wrap.classList.add('is-collapsed');
+          const ex = document.createElement('button');
+          ex.className = 'code-expand';
+          ex.textContent = `Expand (${Math.round(pre.scrollHeight / 22)} lines) ↓`;
+          ex.addEventListener('click', () => {
+            wrap.classList.remove('is-collapsed');
+            ex.remove();
+          });
+          wrap.appendChild(ex);
+        }
+      });
+
+      // "/" opens search (Ctrl/Cmd+K is bound in Search.astro) — kept off inputs.
+      document.addEventListener('keydown', (e) => {
+        const t = e.target as HTMLElement | null;
+        if (e.key === '/' && !e.ctrlKey && !e.metaKey &&
+            !(t && (t.tagName === 'INPUT' || t.tagName === 'TEXTAREA' || t.isContentEditable))) {
+          e.preventDefault();
+          document.getElementById('search-toggle')?.click();
+        }
       });
     </script>
   </body>