feat(isac): link skill chips to abilities

DESIGN.md

@@ -114,17 +114,16 @@ components:
 
 **Creative North Star: "The Strategic Operations Grid"**
 
-SHD.build behaves like a dependable intelligence network shared by active
-agents: precise, restrained, tactical, and structured around trustworthy data.
-The interface communicates through alignment, density, operational labels, and
-visible state rather than spectacle. Public surfaces can breathe and use larger
-editorial hierarchy, while ISAC compresses the same identity into an efficient
-control surface.
+SHD.build serves active agents as a dependable intelligence network: precise,
+restrained, tactical, and built around trustworthy data. Alignment, density,
+operational labels, and visible state carry the interface. Public surfaces use
+space and larger editorial hierarchy; ISAC uses the same identity in an
+efficient control surface.
 
-The world is technical without becoming sterile. Fine structural lines,
-tonally layered black and graphite surfaces, cropped game iconography, clipped
-silhouettes, and tactile state changes create its character. Theme language
-supports comprehension; it never becomes military cosplay.
+Fine structural lines, layered black and graphite surfaces, cropped game
+iconography, clipped silhouettes, and tactile state changes give the interface
+its technical character. Theme language supports comprehension and avoids
+military cosplay.
 
 **Key Characteristics:**
 
@@ -137,15 +136,15 @@ supports comprehension; it never becomes military cosplay.
 
 ## Colors
 
-The palette combines Operations Black, Terminal Graphite, Field Manual White,
-and rare Signal Orange with semantic system and item-quality signals.
+The palette uses Operations Black, Terminal Graphite, Field Manual White, rare
+Signal Orange, and semantic system and item-quality signals.
 
 ### Primary
 
 - **Signal Orange:** Primary actions, current navigation, focus, selected
   controls, important values, and SHD identity details.
-- **Signal Orange Hover:** Brighter confirmation that an orange action is
-  interactive, never a second decorative accent.
+- **Signal Orange Hover:** Confirms that an orange action accepts input; never
+  use it as a decorative accent.
 
 ### Secondary
 
@@ -173,11 +172,11 @@ and rare Signal Orange with semantic system and item-quality signals.
 - **Telemetry Muted / Telemetry Dim:** Secondary labels and low-priority
   operational metadata.
 
-**The Orange Discipline Rule.** Signal Orange identifies action and emphasis;
-it does not cover large decorative areas or compete with semantic state colors.
+**The Orange Discipline Rule.** Use Signal Orange for action and emphasis. Keep
+it out of large decorative areas and away from semantic state colors.
 
-**The Redundant Meaning Rule.** Color always travels with text, position, shape,
-or an icon. No status or quality can depend on hue alone.
+**The Redundant Meaning Rule.** Pair color with text, position, shape, or an
+icon. A status or quality cannot depend on hue alone.
 
 ## Typography
 
@@ -187,11 +186,10 @@ sans-serif fallbacks)
 sans-serif fallbacks)  
 **Editorial Font:** Source Serif 4 (with Georgia and serif fallbacks)
 
-**Character:** Barlow gives the system voice a squared, compact, engineered
-rhythm while remaining highly readable in dense interfaces. Source Serif 4 is
-reserved for human-readable explanations, guide-like prose, and selected
-descriptive passages so operational data and editorial knowledge remain
-visibly distinct.
+**Character:** Barlow gives the system a squared, compact, engineered voice
+that remains readable in dense interfaces. Reserve Source Serif 4 for
+explanations, guide-like prose, and selected descriptive passages. Keep
+operational data distinct from editorial knowledge.
 
 ### Hierarchy
 
@@ -208,20 +206,19 @@ visibly distinct.
 - **Label** (900, 0.625rem, 0.1em tracking): Uppercase telemetry, field labels,
   statuses, metadata, and compact actions.
 
-**The Two-Voice Rule.** Sans-serif operates the system; serif explains it.
-Never use monospace merely to make an interface look technical.
+**The Two-Voice Rule.** Sans-serif operates the system; serif explains it. Do
+not use monospace to make an interface look technical.
 
 **The Telemetry Restraint Rule.** Uppercase tracked labels are short navigational
 or state-bearing signals, not paragraph typography.
 
 ## Layout
 
-The system is an aligned grid of operational regions rather than a collection
-of floating cards. Public pages use centered containers up to 1640px with
-responsive outer padding. ISAC uses a compact command header, sticky 210px
-module rail, and a flexible registry workspace. Builder and account surfaces
-use deliberate workbench columns that collapse into a task-appropriate mobile
-sequence.
+The system uses an aligned grid of operational regions. Public pages use
+centered containers up to 1640px with responsive outer padding. ISAC uses a
+compact command header, sticky 210px module rail, and flexible registry
+workspace. Builder and account surfaces use workbench columns that collapse
+into a task-appropriate mobile sequence.
 
 Spacing follows a tight 5/8/12/20px rhythm with 24px as the standard panel
 inset. Related controls stay close; modules and major sections receive clearer
@@ -235,8 +232,8 @@ touch-oriented stacks or controlled horizontal registries. Interactive mobile
 targets are at least 44px where space permits.
 
 Large displays use the shared display-scale progression: 1.15 at 2200px, 1.3 at
-2800px, and 1.5 at 3400px. This preserves readable density rather than simply
-expanding empty space.
+2800px, and 1.5 at 3400px. The scale preserves readable density and avoids
+empty space.
 
 **The Connected Grid Rule.** Use borders, shared edges, and aligned tracks to
 show relationships. Do not wrap every subsection in another card.
@@ -248,9 +245,9 @@ workbenches prioritize scanability and efficient repeated actions.
 
 SHD.build uses structural layering. Depth comes from tonal surface changes,
 fine borders, clipped corners, inset active rails, and controlled overlays.
-Resting cards and panels do not float. Shadows are reserved for temporary
-surfaces that must detach from the document—menus, dialogs, toasts, and routed
-fault consoles—and use a clear downward offset with a soft black blur.
+Resting cards and panels do not float. Use shadows for temporary surfaces that
+detach from the document: menus, dialogs, toasts, and routed fault consoles.
+Give each a clear downward offset and soft black blur.
 
 ### Shadow Vocabulary
 
@@ -273,21 +270,21 @@ dialogs, and navigation elements use square engineered geometry with one-pixel
 structural borders. Select hero visuals and status consoles may use clipped
 polygon corners when the silhouette reinforces an operational artifact.
 
-Circular geometry is identity-specific: agent avatars, the SHD mark, compact
-online indicators, and true radial or orbital data graphics. Pills are not a
-general control shape.
+Circular geometry identifies agent avatars, the SHD mark, compact online
+indicators, and radial or orbital data graphics. Do not use pills as a general
+control shape.
 
 **The Engineered Edge Rule.** Square is the default and rounding must have
 semantic justification.
 
 **The Identity Circle Rule.** Circular crops belong to people, the SHD emblem,
-and genuinely radial information—not arbitrary controls.
+and radial information, not arbitrary controls.
 
 ## Components
 
-Components feel tactile and technical: a press produces immediate physical
-feedback, a request exposes pending text and disables repeat activation, and
-focus is unmistakable without becoming ornamental.
+Components feel tactile and technical. A press produces physical feedback; a
+request exposes pending text and blocks repeat activation; focus remains clear
+without ornament.
 
 ### Buttons