everything-gemini 1.2.0 → 1.8.0

package/docs/index.html

@@ -10,14 +10,14 @@
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://salmandev.github.io/everything-gemini/">
   <meta property="og:title" content="Everything Gemini — Agent Harness for Google Antigravity">
-  <meta property="og:description" content="30 Progressive Disclosure Skills, 6 Scoped Subagents, and Deterministic Safety Gates for Gemini 3.8 & Google Antigravity.">
+  <meta property="og:description" content="44 Progressive Disclosure Skills, 9 Scoped Subagents, and 7 Lifecycle Safety Gates for Gemini 3.8 & Google Antigravity.">
   <meta property="og:image" content="https://raw.githubusercontent.com/salmandev/everything-gemini/main/assets/banner.jpg">
 
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://salmandev.github.io/everything-gemini/">
   <meta name="twitter:title" content="Everything Gemini — Agent Harness for Google Antigravity">
-  <meta name="twitter:description" content="30 Progressive Disclosure Skills, 6 Scoped Subagents, and Deterministic Safety Gates for Gemini 3.8 & Google Antigravity.">
+  <meta name="twitter:description" content="48 Progressive Disclosure Skills, 10 Scoped Subagents, and 7 Lifecycle Safety Gates for Gemini 3.8 & Google Antigravity.">
   <meta name="twitter:image" content="https://raw.githubusercontent.com/salmandev/everything-gemini/main/assets/banner.jpg">
 
   <link rel="preconnect" href="https://fonts.googleapis.com">
@@ -294,6 +294,7 @@
       display: flex;
       flex-direction: column;
       justify-content: space-between;
+      cursor: pointer;
     }
     .card:hover {
       background: var(--bg-card-hover);
@@ -315,6 +316,7 @@
     .tag-agent { background: rgba(156, 39, 176, 0.2); color: #d05ce3; }
     .tag-backend { background: rgba(66, 133, 244, 0.18); color: #8ab4f8; }
     .tag-devops { background: rgba(0, 230, 118, 0.15); color: var(--accent-emerald); }
+    .tag-hook { background: rgba(255, 171, 0, 0.18); color: #ffab00; }
 
     .card h3 {
       font-size: 1.15rem;
@@ -328,14 +330,46 @@
       line-height: 1.5;
       margin-bottom: 16px;
     }
-    .card-footer {
+    .card-actions {
       display: flex;
-      justify-content: space-between;
       align-items: center;
+      justify-content: space-between;
+      gap: 10px;
+      margin-top: 14px;
       padding-top: 14px;
-      border-top: 1px solid rgba(255, 255, 255, 0.05);
-      font-size: 0.8rem;
+      border-top: 1px solid rgba(255, 255, 255, 0.08);
+      flex-wrap: wrap;
+    }
+    .card-btn-view {
+      font-size: 0.78rem;
+      font-weight: 600;
+      color: var(--accent-cyan);
+      text-decoration: none;
+      display: inline-flex;
+      align-items: center;
+      gap: 4px;
+      transition: color 0.2s ease;
+    }
+    .card-btn-view:hover {
+      color: #fff;
+      text-decoration: underline;
+    }
+    .card-btn-copy {
+      background: rgba(255, 255, 255, 0.06);
+      border: 1px solid rgba(255, 255, 255, 0.12);
       color: var(--text-muted);
+      font-size: 0.75rem;
+      font-weight: 600;
+      padding: 5px 12px;
+      border-radius: 6px;
+      cursor: pointer;
+      margin-left: auto;
+      transition: all 0.2s ease;
+    }
+    .card-btn-copy:hover {
+      background: rgba(255, 255, 255, 0.15);
+      color: var(--text-main);
+      border-color: rgba(255, 255, 255, 0.3);
     }
 
     /* Footer */
@@ -351,9 +385,149 @@
       text-decoration: none;
     }
 
+    /* Profile Tabs */
+    .profile-tabs {
+      display: inline-flex;
+      background: rgba(16, 20, 31, 0.9);
+      border: 1px solid var(--border-color);
+      border-radius: 999px;
+      padding: 4px;
+      margin-bottom: 20px;
+      gap: 4px;
+      flex-wrap: wrap;
+      justify-content: center;
+    }
+    .profile-tab {
+      background: transparent;
+      border: none;
+      color: var(--text-muted);
+      padding: 6px 16px;
+      border-radius: 999px;
+      font-size: 0.82rem;
+      font-weight: 600;
+      cursor: pointer;
+      transition: all 0.2s ease;
+    }
+    .profile-tab:hover {
+      color: var(--text-main);
+    }
+    .profile-tab.active {
+      background: var(--accent-cyan);
+      color: #080a10;
+      box-shadow: 0 0 14px rgba(0, 229, 255, 0.4);
+    }
+
+    /* Modal Backdrop & Dialog */
+    .modal-backdrop {
+      position: fixed;
+      inset: 0;
+      background: rgba(4, 7, 13, 0.82);
+      backdrop-filter: blur(8px);
+      -webkit-backdrop-filter: blur(8px);
+      display: none;
+      align-items: center;
+      justify-content: center;
+      z-index: 1000;
+      padding: 20px;
+    }
+    .modal-backdrop.open {
+      display: flex;
+    }
+    .modal-dialog {
+      background: #0f1423;
+      border: 1px solid var(--border-glow);
+      border-radius: 18px;
+      max-width: 600px;
+      width: 100%;
+      padding: 32px;
+      box-shadow: 0 24px 60px rgba(0, 0, 0, 0.8), 0 0 35px rgba(0, 229, 255, 0.15);
+      position: relative;
+      animation: modalFadeIn 0.22s cubic-bezier(0.16, 1, 0.3, 1);
+    }
+    @keyframes modalFadeIn {
+      from { opacity: 0; transform: scale(0.95) translateY(10px); }
+      to { opacity: 1; transform: scale(1) translateY(0); }
+    }
+    .modal-close {
+      position: absolute;
+      top: 20px;
+      right: 20px;
+      background: rgba(255, 255, 255, 0.08);
+      border: 1px solid rgba(255, 255, 255, 0.12);
+      color: var(--text-muted);
+      width: 32px;
+      height: 32px;
+      border-radius: 50%;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 1.1rem;
+      transition: all 0.2s ease;
+    }
+    .modal-close:hover {
+      background: rgba(255, 255, 255, 0.2);
+      color: #fff;
+    }
+    .modal-header {
+      margin-bottom: 16px;
+    }
+    .modal-header h2 {
+      font-size: 1.4rem;
+      font-weight: 700;
+      font-family: var(--font-mono);
+      margin-top: 10px;
+    }
+    .modal-desc {
+      font-size: 0.96rem;
+      line-height: 1.6;
+      color: var(--text-muted);
+      margin-bottom: 24px;
+    }
+    .modal-cmd-box {
+      background: rgba(0, 0, 0, 0.45);
+      border: 1px solid rgba(255, 255, 255, 0.1);
+      border-radius: 10px;
+      padding: 12px 16px;
+      font-family: var(--font-mono);
+      font-size: 0.88rem;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 12px;
+      margin-bottom: 24px;
+    }
+    .modal-cmd-text {
+      color: var(--accent-cyan);
+      overflow-x: auto;
+      white-space: nowrap;
+    }
+    .modal-actions {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 14px;
+      border-top: 1px solid rgba(255, 255, 255, 0.08);
+      padding-top: 20px;
+      flex-wrap: wrap;
+    }
+    .modal-btn-view {
+      color: var(--accent-cyan);
+      font-weight: 600;
+      text-decoration: none;
+      font-size: 0.9rem;
+      display: inline-flex;
+      align-items: center;
+      gap: 6px;
+    }
+    .modal-btn-view:hover {
+      text-decoration: underline;
+    }
+
     @media (max-width: 768px) {
       .hero h1 { font-size: 2.4rem; }
       .catalog-grid { grid-template-columns: 1fr; }
+      .nav-links { gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
     }
   </style>
 </head>
@@ -364,11 +538,14 @@
     <div class="container nav-inner">
       <a href="#" class="brand">
         🪐 Everything Gemini
-        <span class="brand-badge">v1.2.0</span>
+        <span class="brand-badge">v1.8.0</span>
       </a>
       <div class="nav-links">
         <a href="https://github.com/salmandev/everything-gemini" class="nav-link">GitHub</a>
         <a href="https://www.npmjs.com/package/everything-gemini" class="nav-link">NPM</a>
+        <a href="https://github.com/salmandev/everything-gemini/blob/main/CONTRIBUTING.md" class="nav-link" style="color: var(--accent-emerald); font-weight: 600;">✨ Contribute</a>
+        <a href="https://twitter.com/intent/tweet?text=%F0%9F%AA%90%20Everything%20Gemini%20v1.8.0%20is%20live%21%20The%20open-source%20multi-agent%20harness%20for%20Google%20Antigravity%20%26%20Gemini%203.8%20with%2052%20progressive%20skills%2C%2011%20subagents%2C%20and%207%20safety%20gates.%0A%0A%F0%9F%91%89%20https%3A%2F%2Fsalmandev.github.io%2Feverything-gemini%2F" target="_blank" class="nav-link" style="color: var(--accent-cyan); font-weight: 600;">🐦 Share on X</a>
+        <a href="https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fsalmandev.github.io%2Feverything-gemini%2F" target="_blank" class="nav-link" style="color: #00a0dc; font-weight: 600;">💼 Share on LinkedIn</a>
         <a href="https://github.com/salmandev/everything-gemini" target="_blank" class="btn-github">
           ⭐ Star on GitHub
         </a>
@@ -387,6 +564,21 @@
         Battle-tested progressive disclosure skills, scoped subagent fleets, and deterministic lifecycle security gates engineered for Google Antigravity.
       </p>
 
+      <!-- Profile Tabs -->
+      <div class="profile-tabs">
+        <button class="profile-tab active" onclick="setInstallProfile('developer', event)">Developer</button>
+        <button class="profile-tab" onclick="setInstallProfile('core', event)">Core</button>
+        <button class="profile-tab" onclick="setInstallProfile('full', event)">Full Power</button>
+        <button class="profile-tab" onclick="setInstallProfile('bundle', event)">Offline Bundle</button>
+        <button class="profile-tab" onclick="setInstallProfile('global', event)">Global (~/.gemini)</button>
+        <button class="profile-tab" onclick="setInstallProfile('status', event)">Status Check</button>
+        <button class="profile-tab" onclick="setInstallProfile('update', event)">Update Ecosystem</button>
+        <button class="profile-tab" onclick="setInstallProfile('dryrun', event)">Dry Run Preview</button>
+        <button class="profile-tab" onclick="setInstallProfile('json', event)">JSON Export</button>
+        <button class="profile-tab" onclick="setInstallProfile('doctor', event)">Doctor</button>
+        <button class="profile-tab" onclick="setInstallProfile('action', event)">GitHub Action</button>
+      </div>
+
       <!-- Install box -->
       <div class="install-box">
         <div class="install-cmd">
@@ -399,33 +591,34 @@
       <!-- Metrics -->
       <div class="metrics">
         <div class="metric-card">
-          <div class="metric-value">30+</div>
+          <div class="metric-value">52</div>
           <div class="metric-label">Progressive Skills</div>
         </div>
         <div class="metric-card">
-          <div class="metric-value">6</div>
+          <div class="metric-value">11</div>
           <div class="metric-label">Scoped Subagents</div>
         </div>
         <div class="metric-card">
-          <div class="metric-value">&gt;85%</div>
-          <div class="metric-label">Token Overhead Saved</div>
+          <div class="metric-value">7</div>
+          <div class="metric-label">Lifecycle Hooks</div>
         </div>
         <div class="metric-card">
           <div class="metric-value">2M</div>
-          <div class="metric-label">Context Caching Ready</div>
+          <div class="metric-label">Prefix Cache Tokens</div>
         </div>
       </div>
     </section>
 
     <!-- Filters & Search -->
     <section class="filter-section">
-      <input type="text" id="search-input" class="search-bar" placeholder="🔍 Search skills, subagents, or hooks (e.g. multimodal, supabase, tdd, cloudflare)...">
+      <input type="text" id="search-input" class="search-bar" placeholder="🔍 Search skills, subagents, or hooks (e.g. multimodal, supabase, tdd, cloudflare, shield, lint)...">
       <div class="filter-pills">
-        <button class="filter-btn active" onclick="filterCategory('all')">All Components</button>
-        <button class="filter-btn" onclick="filterCategory('frontier')">Frontier & Vision</button>
-        <button class="filter-btn" onclick="filterCategory('subagent')">Scoped Subagents</button>
-        <button class="filter-btn" onclick="filterCategory('backend')">Backend & Cloud</button>
-        <button class="filter-btn" onclick="filterCategory('devops')">DevOps & Safety</button>
+        <button class="filter-btn active" onclick="filterCategory('all', event)">All Components</button>
+        <button class="filter-btn" onclick="filterCategory('frontier', event)">Frontier & Vision</button>
+        <button class="filter-btn" onclick="filterCategory('subagent', event)">Scoped Subagents</button>
+        <button class="filter-btn" onclick="filterCategory('backend', event)">Backend & Cloud</button>
+        <button class="filter-btn" onclick="filterCategory('devops', event)">DevOps & Quality</button>
+        <button class="filter-btn" onclick="filterCategory('hook', event)">Lifecycle Hooks</button>
       </div>
     </section>
 
@@ -439,49 +632,115 @@
     <div class="container">
       <p>Built with 💙 for Google Antigravity & Gemini developers worldwide.</p>
       <p style="margin-top: 8px;">
-        Licensed under <a href="https://github.com/salmandev/everything-gemini/blob/main/LICENSE">Apache 2.0</a> • Inspired by <a href="https://github.com/affaan-m/everything-claude-code">ECC</a>
+        Licensed under <a href="https://github.com/salmandev/everything-gemini/blob/main/LICENSE">Apache 2.0</a> • Inspired by <a href="https://github.com/affaan-m/everything-claude-code">ECC</a> • <a href="https://star-history.com/#salmandev/everything-gemini&Date" target="_blank">Star History ↗</a>
       </p>
     </div>
   </footer>
 
+  <!-- Quick-View Modal -->
+  <div id="quick-view-modal" class="modal-backdrop" onclick="closeModalOnBackdrop(event)">
+    <div class="modal-dialog">
+      <button class="modal-close" onclick="closeModal()">✕</button>
+      <div class="modal-header">
+        <span id="modal-tag" class="card-tag tag-frontier"></span>
+        <h2 id="modal-title"></h2>
+      </div>
+      <p id="modal-desc" class="modal-desc"></p>
+      
+      <div style="font-size: 0.8rem; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 8px;">1-Click Install Command</div>
+      <div class="modal-cmd-box">
+        <div class="modal-cmd-text" id="modal-cmd"></div>
+        <button class="card-btn-copy" id="modal-copy-btn" onclick="copyModalCmd()">Copy CLI</button>
+      </div>
+
+      <div class="modal-actions">
+        <span style="font-size: 0.82rem; color: var(--text-muted);">Google Antigravity & Gemini 3.8</span>
+        <a id="modal-github-link" href="#" target="_blank" class="modal-btn-view">View Complete Source on GitHub ↗</a>
+      </div>
+    </div>
+  </div>
+
   <script>
     const items = [
-      { name: "gemini-multimodal", type: "frontier", cat: "frontier", desc: "Native visual reasoning over UI mockups, converting wireframes to frontend code, diagram-to-Mermaid extraction, and visual regression QA." },
-      { name: "context-caching", type: "frontier", cat: "frontier", desc: "1M-2M token context optimization with deterministic static prefix caching, skeleton ingestion, and ~75% cost savings." },
-      { name: "gemini-grounding", type: "frontier", cat: "frontier", desc: "Live Google Search grounding to eliminate hallucinations, verify real-time APIs, and retrieve breaking documentation." },
-      { name: "rag-architect", type: "frontier", cat: "frontier", desc: "Retrieval-augmented generation pipelines, semantic AST chunking, hybrid keyword-vector search, and Gemini re-ranking." },
-      { name: "gemini-function-calling", type: "frontier", cat: "frontier", desc: "Production function declarations, structured JSON output schemas (Pydantic), parallel tool execution, and error recovery." },
+      // Frontier & Vision Skills (10)
+      { name: "gemini-multimodal", type: "skill", cat: "frontier", desc: "Native visual reasoning over UI mockups, converting wireframes to frontend code, diagram-to-Mermaid extraction, and visual regression QA." },
+      { name: "context-caching", type: "skill", cat: "frontier", desc: "1M-2M token context optimization with deterministic static prefix caching, skeleton ingestion, and ~75% cost savings." },
+      { name: "gemini-grounding", type: "skill", cat: "frontier", desc: "Live Google Search grounding to eliminate hallucinations, verify real-time APIs, and retrieve breaking documentation." },
+      { name: "rag-architect", type: "skill", cat: "frontier", desc: "Retrieval-augmented generation pipelines, semantic AST chunking, hybrid keyword-vector search, and Gemini re-ranking." },
+      { name: "gemini-function-calling", type: "skill", cat: "frontier", desc: "Production function declarations, structured JSON output schemas (Pydantic), parallel tool execution, and error recovery." },
       { name: "ai-first-engineering", type: "skill", cat: "frontier", desc: "Decomposing ambiguous specs into verifiable milestones, executable acceptance criteria (BDD), and blast-radius containment." },
+      { name: "agent-evals", type: "skill", cat: "frontier", desc: "Automated evaluation pipelines, LLM-as-a-judge rubrics, golden test datasets, and prompt regression testing." },
+      { name: "browser-qa-tester", type: "skill", cat: "frontier", desc: "Automated browser end-to-end testing with native WebP recording into artifacts for visual validation." },
+      { name: "continuous-learning", type: "skill", cat: "frontier", desc: "Adaptive Learned Instincts and Knowledge Item memory capturing developer corrections across sessions." },
+      { name: "repo-onboarding", type: "skill", cat: "frontier", desc: "Rapid codebase indexing, directory mapping, pattern extraction, and permanent Knowledge Item generation." },
+
+      // Scoped Subagents & Orchestration (13)
       { name: "subagent-handoff", type: "skill", cat: "subagent", desc: "Delegation protocol for multi-agent workflows with scoped context isolation and deterministic structured report synthesis." },
+      { name: "architecture-designer", type: "skill", cat: "subagent", desc: "Comprehensive system design architectures, Mermaid diagrams, API contracts, and Architecture Decision Records (ADRs)." },
+      { name: "langgraph-orchestrator", type: "skill", cat: "subagent", desc: "Stateful multi-agent systems, cyclic graphs, persistent checkpoints, human-in-the-loop pauses, and streaming orchestration." },
+      { name: "antigravity-sdk-orchestrator", type: "skill", cat: "subagent", desc: "Programmatic multi-agent pipelines with the official google-antigravity Python SDK and token streaming." },
       { name: "agents/planner", type: "subagent", cat: "subagent", desc: "Strategic architect that breaks complex tasks into phased roadmaps with dependency mapping and risk radius assessment." },
       { name: "agents/code-reviewer", type: "subagent", cat: "subagent", desc: "Uncompromising reviewer enforcing minimal diffs, zero regression, strict typing, and defensive edge-case handling." },
       { name: "agents/browser-qa", type: "subagent", cat: "subagent", desc: "Autonomous UI tester driving browser_subagent with automatic WebP recording and DOM assertions into artifacts." },
       { name: "agents/build-repair", type: "subagent", cat: "subagent", desc: "Automated triage specialist isolating compiler errors and failing unit tests with surgical minimal fixes." },
       { name: "agents/security-auditor", type: "subagent", cat: "subagent", desc: "Adversarial security specialist scanning for credential leakage, injection risks, and dependency CVEs." },
       { name: "agents/architect", type: "subagent", cat: "subagent", desc: "Systems designer authoring C4 Mermaid diagrams, formal API contracts, and Architecture Decision Records (ADRs)." },
-      { name: "github-ops", type: "skill", cat: "devops", desc: "End-to-end GitHub PR generation, automated diff review, semantic release drafting, and issue triage with gh CLI & GitHub MCP." },
+      { name: "agents/database-migrator", type: "subagent", cat: "subagent", desc: "Dedicated database schema evolution specialist designing zero-downtime expand/contract SQL migrations and rollback safety." },
+      { name: "agents/performance-tuner", type: "subagent", cat: "subagent", desc: "Systems performance specialist diagnosing flamegraphs, memory leaks, slow database query plans, and N+1 waterfalls." },
+      { name: "agents/documentation-writer", type: "subagent", cat: "subagent", desc: "Specialist authoring developer docs, API references, ADRs, changelogs, and verifying clickable file:// links." },
+      { name: "agents/release-engineer", type: "subagent", cat: "subagent", desc: "Release gatekeeper managing Semantic Versioning, automated changelogs, build checksums, git tagging, and canary rollouts." },
+      { name: "agents/incident-responder", type: "subagent", cat: "subagent", desc: "SRE incident commander triaging alerts, correlating OTel spans, containing blast radius, and generating blameless postmortems." },
+
+      // Backend & Cloud Skills (27)
+      { name: "vllm-inference", type: "skill", cat: "backend", desc: "High-throughput LLM inference, PagedAttention KV cache, continuous batching, tensor parallelism, and OpenAI-compatible API serving." },
+      { name: "debezium-cdc", type: "skill", cat: "backend", desc: "Change Data Capture (CDC) streaming with Debezium, PostgreSQL WAL replication, Kafka Connect, and transactional outbox patterns." },
+      { name: "cilium-ebpf-networking", type: "skill", cat: "backend", desc: "Cloud-native eBPF networking, Kubernetes CNI replacement, transparent mTLS, L7 CiliumNetworkPolicies, and Hubble observability." },
+      { name: "litellm-proxy-gateway", type: "skill", cat: "backend", desc: "Enterprise LLM proxy gateway, multi-provider routing (Gemini, Claude, OpenAI), budget controls, virtual keys, and fallback cascades." },
+      { name: "open-telemetry-tracing", type: "skill", cat: "backend", desc: "Distributed tracing, OTLP exporters, W3C traceparent propagation, custom span attributes, and metric correlations." },
+      { name: "argo-workflows", type: "skill", cat: "backend", desc: "Kubernetes-native DAG workflows, artifact passing, container steps, retry strategies, and CronWorkflows." },
+      { name: "dbt-transformation", type: "skill", cat: "backend", desc: "Modular SQL transformations, Jinja macros, semantic layer models, automated schema tests, and documentation generation." },
+      { name: "apache-kafka-streams", type: "skill", cat: "backend", desc: "Exactly-once event streaming, stateful window aggregations, consumer group rebalancing, and Schema Registry serialization." },
+      { name: "grpc-connect-rpc", type: "skill", cat: "backend", desc: "Lightweight, browser-compatible gRPC and Protocol Buffers with Connect-ES / Connect-Go and HTTP/2-3 streaming." },
+      { name: "duckdb-local-olap", type: "skill", cat: "backend", desc: "In-process embedded SQL analytics, direct S3/Parquet querying, and zero-copy Apache Arrow integration." },
+      { name: "nats-jetstream", type: "skill", cat: "backend", desc: "Ultra-low latency event streaming, message deduplication, durable pull consumer groups, and KV stores." },
+      { name: "axum-web-service", type: "skill", cat: "backend", desc: "Production Rust web APIs using Axum, Tokio async runtime, Tower middlewares, and SQLx connection pools." },
+      { name: "clickhouse-analytics", type: "skill", cat: "backend", desc: "High-throughput OLAP schemas, MergeTree engines, Kafka streaming ingestion, and vector similarity search." },
+      { name: "temporal-workflows", type: "skill", cat: "backend", desc: "Durable workflow orchestration, resilient async activities, saga compensations, and child workflows." },
+      { name: "trpc-react-query", type: "skill", cat: "backend", desc: "End-to-end type safety with tRPC v11 routers, TanStack Query v5 cache management, and optimistic UI mutations." },
+      { name: "wasm-rust-optimizer", type: "skill", cat: "backend", desc: "High-performance WebAssembly compilation from Rust using wasm-pack, zero-copy memory buffers, and SIMD." },
       { name: "supabase-architect", type: "skill", cat: "backend", desc: "Row Level Security (RLS) policies, pgvector embeddings for semantic AI search, and performant Supabase Edge Functions." },
+      { name: "fastapi-production", type: "skill", cat: "backend", desc: "Production async FastAPI architecture, Pydantic v2 schemas, lifespan handlers, JWT auth, and Kubernetes health probes." },
+      { name: "redis-cache-patterns", type: "skill", cat: "backend", desc: "Enterprise Redis caching (cache-aside, jitter), distributed locking with atomic Lua, sliding-window rate limiting, and streams." },
+      { name: "svelte-kit-architect", type: "skill", cat: "backend", desc: "Modern SvelteKit applications using Svelte 5 runes ($state, $derived, $effect), SSR/prerendering, and progressive form actions." },
       { name: "cloudflare-workers", type: "skill", cat: "backend", desc: "Serverless edge functions, Wrangler v3 configuration, Cloudflare D1 SQL, and KV low-latency storage." },
       { name: "database-architect", type: "skill", cat: "backend", desc: "Relational and document schema modeling, zero-downtime expand/contract migrations, and concurrent indexing." },
       { name: "api-craftsman", type: "skill", cat: "backend", desc: "Production-grade REST APIs, OpenAPI 3.1 specifications, gRPC protobuf schemas, and RFC 7807 error envelopes." },
       { name: "fullstack-nextjs", type: "skill", cat: "backend", desc: "Next.js App Router, React Server Components (RSC), hydration error diagnosis, and Server Actions." },
       { name: "stripe-integration", type: "skill", cat: "backend", desc: "Cryptographic webhook signature verification, idempotent checkouts, and customer billing portal sessions." },
+      { name: "graphql-architect", type: "skill", cat: "backend", desc: "Schema-first GraphQL APIs, DataLoader N+1 query batching, and Relay cursor-based pagination." },
+      { name: "responsive-design", type: "skill", cat: "backend", desc: "Fluid typography, mobile-first flex/grid layouts, media queries, and cross-browser accessibility." },
+
+      // DevOps & Quality Skills (11)
+      { name: "playwright-visual-regression", type: "skill", cat: "devops", desc: "Automated visual regression testing, pixelmatch snapshot diffing, cross-browser viewport matrices, and Docker baseline stability." },
+      { name: "turborepo-monorepo", type: "skill", cat: "devops", desc: "High-performance monorepo build caching, task pipelines, package boundaries, and Docker pruning." },
+      { name: "github-ops", type: "skill", cat: "devops", desc: "End-to-end GitHub PR generation, automated diff review, semantic release drafting, and issue triage with gh CLI & GitHub MCP." },
+      { name: "docker-compose-orchestrator", type: "skill", cat: "devops", desc: "Multi-container local environments, database services (Postgres, pgvector, Redis), and healthcheck wiring." },
       { name: "kubernetes-operator", type: "skill", cat: "devops", desc: "Declarative production Kubernetes manifests, HPA autoscaling, zero-downtime rolling updates, and health probes." },
       { name: "devops-pipeline", type: "skill", cat: "devops", desc: "Multi-stage Dockerfiles, GitHub Actions CI/CD workflows, and container infrastructure automation." },
-      { name: "gemini-shield", type: "hook", cat: "devops", desc: "Deterministic PreToolUse lifecycle gate blocking catastrophic commands (rm -rf, DROP TABLE, git push --force)." },
       { name: "security-audit", type: "skill", cat: "devops", desc: "OWASP Top 10 security audits, secret leakage detection, and dependency vulnerability scans." },
       { name: "tdd-workflow", type: "skill", cat: "devops", desc: "Strict Test-Driven Development (Red-Green-Refactor) loop ensuring tests exist before code is written." },
       { name: "root-cause-debugger", type: "skill", cat: "devops", desc: "Systematic regression diagnosis using binary search (git bisect), log traces, and minimal reproduction harnesses." },
-      { name: "browser-qa-tester", type: "skill", cat: "frontier", desc: "Automated browser end-to-end testing with native WebP recording for visual validation." },
-      { name: "agent-evals", type: "skill", cat: "frontier", desc: "Automated evaluation pipelines, LLM-as-a-judge rubrics, golden test datasets, and prompt regression testing." },
       { name: "git-craftsman", type: "skill", cat: "devops", desc: "Conventional atomic commits, interactive rebasing, clean branch lifecycles, and git hygiene." },
-      { name: "docker-compose-orchestrator", type: "skill", cat: "devops", desc: "Multi-container local environments, database services (Postgres, pgvector, Redis), and healthcheck wiring." },
-      { name: "graphql-architect", type: "skill", cat: "backend", desc: "Schema-first GraphQL APIs, DataLoader N+1 query batching, and Relay cursor-based pagination." },
       { name: "performance-profiler", type: "skill", cat: "devops", desc: "Application latency profiling, CPU/memory leak diagnosis, and slow query optimization." },
-      { name: "continuous-learning", type: "skill", cat: "frontier", desc: "Adaptive Learned Instincts and Knowledge Item memory capturing developer corrections across sessions." },
-      { name: "repo-onboarding", type: "skill", cat: "frontier", desc: "Rapid codebase indexing, directory mapping, pattern extraction, and Knowledge Item generation." },
-      { name: "antigravity-sdk-orchestrator", type: "skill", cat: "subagent", desc: "Programmatic multi-agent pipelines with the official google-antigravity Python SDK and token streaming." },
-      { name: "responsive-design", type: "skill", cat: "backend", desc: "Fluid typography, mobile-first flex/grid layouts, media queries, and cross-browser accessibility." }
+
+      // Lifecycle Safety Hooks (7)
+      { name: "gemini-shield", type: "hook", cat: "hook", desc: "Deterministic PreToolUse lifecycle gate blocking catastrophic commands (rm -rf, DROP TABLE, git push --force)." },
+      { name: "safety-shield", type: "hook", cat: "hook", desc: "PreToolUse shell execution firewall that inspects CLI commands against safety rules before execution." },
+      { name: "secret-scrubber", type: "hook", cat: "hook", desc: "PreToolUse security gate intercepting file write operations to block hardcoded API keys and private secrets." },
+      { name: "auto-lint-formatter", type: "hook", cat: "hook", desc: "PostToolUse automated formatting with project linters (prettier, black, ruff, gofmt) immediately after file edits." },
+      { name: "goal-verifier", type: "hook", cat: "hook", desc: "Stop hook intercepting agent exit, validating whether test suites pass or objectives are fulfilled before stopping." },
+      { name: "ephemeral-context", type: "hook", cat: "hook", desc: "PreInvocation hook dynamically injecting repo context, alerts, and instructions into model reasoning turns." },
+      { name: "learned-instincts", type: "hook", cat: "hook", desc: "Session learning hook that records developer corrections and feedback into persistent instincts." }
     ];
 
     let currentCat = 'all';
@@ -491,6 +750,7 @@
       if (cat === 'frontier') return 'tag-frontier';
       if (cat === 'subagent') return 'tag-agent';
       if (cat === 'backend') return 'tag-backend';
+      if (cat === 'hook') return 'tag-hook';
       return 'tag-devops';
     }
 
@@ -511,27 +771,128 @@
       }
 
       filtered.forEach(item => {
+        let githubUrl = "https://github.com/salmandev/everything-gemini";
+        let addCmd = `everything-gemini add skill ${item.name}`;
+
+        if (item.type === 'subagent' || item.name.startsWith('agents/')) {
+          const agentClean = item.name.replace('agents/', '');
+          githubUrl = `https://github.com/salmandev/everything-gemini/blob/main/agents/${agentClean}.md`;
+          addCmd = `everything-gemini add agent ${agentClean}`;
+        } else if (item.name === 'antigravity-sdk-orchestrator') {
+          githubUrl = `https://github.com/salmandev/everything-gemini/blob/main/plugins/python-ai/skills/antigravity-sdk-orchestrator/SKILL.md`;
+          addCmd = `everything-gemini add skill antigravity-sdk-orchestrator`;
+        } else if (item.name === 'responsive-design') {
+          githubUrl = `https://github.com/salmandev/everything-gemini/blob/main/plugins/web-fullstack/skills/responsive-design/SKILL.md`;
+          addCmd = `everything-gemini add skill responsive-design`;
+        } else if (item.type === 'hook') {
+          githubUrl = `https://github.com/salmandev/everything-gemini/blob/main/hooks/${item.name}/hooks.json`;
+          addCmd = `everything-gemini add hook ${item.name}`;
+        } else {
+          githubUrl = `https://github.com/salmandev/everything-gemini/blob/main/skills/${item.name}/SKILL.md`;
+          addCmd = `everything-gemini add skill ${item.name}`;
+        }
+
+        let tagLabel = '⚡ Skill';
+        if (item.type === 'subagent' || item.name.startsWith('agents/')) tagLabel = '🤖 Subagent';
+        else if (item.cat === 'frontier') tagLabel = '🪐 Frontier';
+        else if (item.cat === 'backend') tagLabel = '☁️ Backend';
+        else if (item.type === 'hook') tagLabel = '🛡️ Hook';
+        else if (item.cat === 'devops') tagLabel = '🛠️ DevOps';
+
         const card = document.createElement('div');
         card.className = 'card';
+        card.onclick = (e) => {
+          if (!e.target.closest('.card-actions')) {
+            openModal(item, tagLabel, githubUrl, addCmd);
+          }
+        };
         card.innerHTML = `
           <div>
-            <span class="card-tag ${getTagClass(item.cat)}">${item.cat.toUpperCase()}</span>
+            <span class="card-tag ${getTagClass(item.cat)}">${tagLabel}</span>
             <h3>${item.name}</h3>
             <p>${item.desc}</p>
           </div>
-          <div class="card-footer">
-            <span>Google Antigravity</span>
-            <span style="color: var(--accent-cyan);">Ready ⚡</span>
+          <div class="card-actions">
+            <a href="${githubUrl}" target="_blank" class="card-btn-view" onclick="event.stopPropagation()">View Spec ↗</a>
+            <button class="card-btn-copy" onclick="event.stopPropagation(); copyCardCmd('${addCmd}', this)">Copy Add CLI</button>
           </div>
         `;
         container.appendChild(card);
       });
     }
 
-    function filterCategory(cat) {
+    function openModal(item, tagLabel, githubUrl, addCmd) {
+      document.getElementById('modal-tag').className = 'card-tag ' + getTagClass(item.cat);
+      document.getElementById('modal-tag').innerText = tagLabel;
+      document.getElementById('modal-title').innerText = item.name;
+      document.getElementById('modal-desc').innerText = item.desc;
+      document.getElementById('modal-cmd').innerText = addCmd;
+      document.getElementById('modal-github-link').href = githubUrl;
+      const copyBtn = document.getElementById('modal-copy-btn');
+      copyBtn.innerText = 'Copy CLI';
+      copyBtn.style.color = '';
+      copyBtn.style.borderColor = '';
+      document.getElementById('quick-view-modal').classList.add('open');
+      document.body.style.overflow = 'hidden';
+    }
+
+    function closeModal() {
+      document.getElementById('quick-view-modal').classList.remove('open');
+      document.body.style.overflow = '';
+    }
+
+    function closeModalOnBackdrop(e) {
+      if (e.target.id === 'quick-view-modal') {
+        closeModal();
+      }
+    }
+
+    document.addEventListener('keydown', (e) => {
+      if (e.key === 'Escape') closeModal();
+    });
+
+    function copyModalCmd() {
+      const text = document.getElementById('modal-cmd').innerText;
+      const btn = document.getElementById('modal-copy-btn');
+      copyCardCmd(text, btn);
+    }
+
+    function setInstallProfile(profile, ev) {
+      document.querySelectorAll('.profile-tab').forEach(t => t.classList.remove('active'));
+      if (ev && ev.target) ev.target.classList.add('active');
+      const cmdEl = document.getElementById('cmd-text');
+      if (profile === 'developer') cmdEl.innerText = 'npx everything-gemini install --profile developer';
+      else if (profile === 'core') cmdEl.innerText = 'npx everything-gemini install --profile core';
+      else if (profile === 'full') cmdEl.innerText = 'npx everything-gemini install --profile full';
+      else if (profile === 'bundle') cmdEl.innerText = 'npx everything-gemini bundle';
+      else if (profile === 'global') cmdEl.innerText = 'npx everything-gemini install --global';
+      else if (profile === 'status') cmdEl.innerText = 'npx everything-gemini status';
+      else if (profile === 'update') cmdEl.innerText = 'npx everything-gemini update';
+      else if (profile === 'dryrun') cmdEl.innerText = 'npx everything-gemini install --profile developer --dry-run';
+      else if (profile === 'json') cmdEl.innerText = 'npx everything-gemini status --json';
+      else if (profile === 'doctor') cmdEl.innerText = 'npx everything-gemini doctor';
+      else if (profile === 'action') cmdEl.innerText = '- uses: salmandev/everything-gemini@v1';
+    }
+
+    function copyCardCmd(cmd, btn) {
+      navigator.clipboard.writeText(cmd);
+      const original = btn.innerText;
+      btn.innerText = 'Copied! ✔';
+      btn.style.color = '#00e676';
+      btn.style.borderColor = '#00e676';
+      setTimeout(() => {
+        btn.innerText = original;
+        btn.style.color = '';
+        btn.style.borderColor = '';
+      }, 1500);
+    }
+
+    function filterCategory(cat, ev) {
       currentCat = cat;
       document.querySelectorAll('.filter-btn').forEach(btn => btn.classList.remove('active'));
-      event.target.classList.add('active');
+      if (ev && ev.target) {
+        ev.target.classList.add('active');
+      }
       renderCards();
     }