diff --git a/docs/hub/index.html b/docs/hub/index.html
index 589f656b7..31de1d8e0 100644
--- a/docs/hub/index.html
+++ b/docs/hub/index.html
@@ -82,22 +82,112 @@
.agent-skill-btn {
display: inline-flex;
align-items: center;
- gap: 0.5rem;
- padding: 0.75rem 1.5rem;
+ gap: 0.4rem;
+ padding: 0.45rem 1rem;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border: none;
- border-radius: 8px;
+ border-radius: 6px;
color: white;
text-decoration: none;
- font-size: 1rem;
+ font-size: 0.85rem;
font-weight: 600;
- transition: transform 0.15s, box-shadow 0.15s;
- box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
+ transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
+ box-shadow: 0 2px 8px rgba(102, 126, 234, 0.25);
}
.agent-skill-btn:hover {
- transform: translateY(-2px);
- box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
+ transform: translateY(-1px);
+ box-shadow: 0 4px 12px rgba(102, 126, 234, 0.35);
+ }
+
+ /* ── Empower Card ── */
+ .empower-card {
+ max-width: 600px;
+ margin: 1.75rem auto 1.5rem;
+ background: var(--surface);
+ border: 1px solid var(--border);
+ border-radius: 12px;
+ padding: 1.5rem 1.75rem;
+ position: relative;
+ overflow: hidden;
+ }
+
+ .empower-card::before {
+ content: '';
+ position: absolute;
+ top: 0; left: 0; right: 0;
+ height: 3px;
+ background: linear-gradient(90deg, #667eea, #764ba2, #f093fb);
+ }
+
+ .empower-card h3 {
+ font-size: 1rem;
+ font-weight: 700;
+ margin-bottom: 0.85rem;
+ color: var(--text);
+ }
+
+ .empower-card h3 span {
+ color: var(--accent);
+ }
+
+ .install-row {
+ display: flex;
+ align-items: center;
+ gap: 0.5rem;
+ background: #0d1117;
+ border: 1px solid var(--border);
+ border-radius: 6px;
+ padding: 0.45rem 0.75rem;
+ margin-bottom: 0.5rem;
+ transition: border-color 0.15s;
+ }
+
+ .install-row:hover {
+ border-color: #30405a;
+ }
+
+ .install-row .platform-label {
+ font-size: 0.7rem;
+ font-weight: 600;
+ text-transform: uppercase;
+ letter-spacing: 0.04em;
+ color: var(--text-muted);
+ background: var(--tag-bg);
+ padding: 0.15rem 0.45rem;
+ border-radius: 4px;
+ flex-shrink: 0;
+ }
+
+ .install-row code {
+ font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
+ font-size: 0.8rem;
+ color: var(--accent);
+ flex: 1;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ .empower-prompt {
+ margin-top: 0.85rem;
+ padding: 0.65rem 0.85rem;
+ background: rgba(102, 126, 234, 0.06);
+ border: 1px dashed rgba(102, 126, 234, 0.25);
+ border-radius: 8px;
+ font-size: 0.82rem;
+ color: var(--text-muted);
+ line-height: 1.5;
+ }
+
+ .empower-prompt strong {
+ color: var(--text);
+ font-weight: 600;
+ }
+
+ .empower-prompt em {
+ color: var(--accent);
+ font-style: italic;
}
.cta {
@@ -379,27 +469,28 @@