fix: stop skill name overflowing/overlapping the description (#88)

The Skills accordion rendered .skill-name with white-space:nowrap +
min-width:140px inside a non-wrapping flex <summary>. The flex algorithm
shrinks the name box toward 140px while nowrap keeps the text full width, so
the name's ink overflows its box and paints over .skill-desc. Confirmed on
multiple live fleet sites (Blender- and Plaid-Developer-Tools), desktop and
mobile, expanded state.

CSS-only fix (Skills section only):
- .skill-name: drop white-space:nowrap + min-width:140px; flex:0 1 12rem +
  min-width:0 -> an honest, wrapping column.
- .skill-desc: flex:1 1 auto + min-width:0 + overflow-wrap:anywhere (wraps
  long code tokens instead of overflowing).
- summary: align-items flex-start; nudge the disclosure triangle to the first line.
- <=620px: flex-wrap so the description stacks full-width under the name.

Verified by local build + headless screenshots across Blender, Plaid, and
Docker (expanded + collapsed, desktop 1280 + mobile 390): overlap gone,
short-name rows unaffected, collapse and the Rules table unchanged. No
build_site.py / data-schema / DOM / non-Skills changes. Resolves the
confirmed rendering-defect subset of #86 (facelift scope remains open).

Bumps VERSION 1.17.0 -> 1.17.1 and regenerates docs/index.html (the version
footer) per the repo's release-hygiene gates.

Signed-off-by: fOuttaMyPaint <154358121+TMHSDigital@users.noreply.github.com>
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>

Author: TMHSDigital

VERSION

@@ -1 +1 @@
-1.17.0
+1.17.1

docs/index.html

@@ -345,7 +345,7 @@ <h3>Scaffold Generator</h3>
       </div>
       <div class="footer-divider"></div>
       <div class="footer-meta">
-        <span id="footerVersion">v1.17.0</span>
+        <span id="footerVersion">v1.17.1</span>
         <span>&middot;</span>
         <span>CC-BY-NC-ND-4.0</span>
         <span>&middot;</span>

site-template/template.html.j2

@@ -205,13 +205,21 @@
 
     /* SKILL DETAIL ROWS */
     details.skill-row { border-bottom: 1px solid rgba(48,54,61,0.5); }
-    details.skill-row > summary { display: flex; align-items: center; gap: 0.75rem; padding: 0.625rem 0.75rem; cursor: pointer; list-style: none; transition: background 0.15s; }
+    details.skill-row > summary { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.625rem 0.75rem; cursor: pointer; list-style: none; transition: background 0.15s; }
     details.skill-row > summary::-webkit-details-marker { display: none; }
-    details.skill-row > summary::before { content: ''; display: inline-block; width: 0; height: 0; border-left: 5px solid var(--accent-light); border-top: 4px solid transparent; border-bottom: 4px solid transparent; transition: transform 0.2s; flex-shrink: 0; }
+    details.skill-row > summary::before { content: ''; display: inline-block; width: 0; height: 0; margin-top: 0.4rem; border-left: 5px solid var(--accent-light); border-top: 4px solid transparent; border-bottom: 4px solid transparent; transition: transform 0.2s; flex-shrink: 0; }
     details.skill-row[open] > summary::before { transform: rotate(90deg); }
     details.skill-row > summary:hover { background: var(--bg3); }
-    .skill-name { font-weight: 500; color: var(--text); white-space: nowrap; min-width: 140px; }
-    .skill-desc { color: var(--text-dim); font-size: 0.875rem; }
+    .skill-name { font-weight: 500; color: var(--text); flex: 0 1 12rem; min-width: 0; }
+    .skill-desc { color: var(--text-dim); font-size: 0.875rem; flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
+    /* Narrow screens: stack name above description (the two-column flex row leaves the name
+       too cramped). flex-wrap + a full-width basis on .skill-desc drops it to its own line
+       under the triangle+name; indent it to align under the name. */
+    @media (max-width: 620px) {
+      details.skill-row > summary { flex-wrap: wrap; }
+      .skill-name { flex: 1 1 0; }
+      .skill-desc { flex: 1 0 100%; margin-left: 1.1rem; }
+    }
     .skill-detail { padding: 0.5rem 0.75rem 1rem 1.75rem; }
     .skill-detail-group { margin-bottom: 0.75rem; }
     .skill-detail-group strong { display: block; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-dim); margin-bottom: 0.35rem; }