Align sidebar to header logo, bump sidebar font, rework detail title

Three tightening passes based on visual feedback.

- Sidebar alignment. The skills layout now uses the same horizontal
  padding clamp as the site header, so the sidebar column's left edge
  sits under the brand logo above. Sidebar items drop their 10px left
  padding and sit flush with the column edge; the 2px active-item
  accent lives in a -2px margin so it hangs in the layout gutter
  without pushing text right. Drop the max-width constraint so the
  docs shell extends wall-to-wall on wide screens like a real docs site.

- Sidebar font. The command list was 0.8125rem which read too small
  next to the sidebar group titles. Bump to 0.875rem and tighten the
  vertical rhythm (4px vs 3px padding, group title margin-bottom 6px).

- Skill detail title. The title was set in mono at ~3rem and the
  tagline in italic display, which inverted the visual weight (the
  tagline felt heavier than the title). Rework to match the landing
  page's .spread-command-name palette styling:
    - Title: display serif, clamp(3rem, 5.5vw, 5rem), line-height 0.95
    - Leading '/' split into <span class="skill-detail-title-slash">
      and colored with --color-accent at weight 300 so it reads as a
      quiet prefix glyph
    - Tagline: body sans at 1-1.125rem, no italics, max-width 60ch

scripts/build-sub-pages.js

@@ -87,7 +87,7 @@ ${refBody}
 <article class="skill-detail">
   <header class="skill-detail-header">
     <p class="skill-detail-eyebrow"><a href="/skills">Skills</a> / ${escapeHtml(categoryLabel)}</p>
-    <h1 class="skill-detail-title">/${escapeHtml(skill.id)}</h1>
+    <h1 class="skill-detail-title"><span class="skill-detail-title-slash">/</span>${escapeHtml(skill.id)}</h1>
     <p class="skill-detail-tagline">${escapeHtml(tagline)}</p>
     ${metaStrip}
   </header>