feat(phase-4): WS2 + WS3 — Developer Portal (Next.js 14) and CLI tool (sentryagent)

WS2: Developer Portal (portal/)
- Standalone Next.js 14 + Tailwind CSS app — independent deployment
- Home page: hero, feature grid, CTA to /get-started
- /pricing: free tier limits table (10 agents, 1k calls/day) + paid tier CTA
- /sdks: all 4 SDKs (Node.js, Python, Go, Java) with install + code examples
- /api-explorer: Swagger UI from NEXT_PUBLIC_API_URL/openapi.json, persistAuthorization
- /get-started: 4-step wizard (setup → register agent → credentials → SDK snippet)
- Shared Nav component with active-link highlighting
- Build: 8/8 static pages, zero TypeScript errors

WS3: CLI Tool (cli/ — npm package: sentryagent)
- configure, register-agent, list-agents, issue-token, rotate-credentials, tail-audit-log
- Auto OAuth2 token fetch + 30s-buffer cache via client_credentials flow
- chalk-formatted table output, confirmation prompts, bounded audit log dedup
- bash + zsh shell completion scripts
- README with installation, all commands, and completion setup
- Build: tsc clean, node dist/index.js --help verified

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

portal/app/page.tsx

@@ -0,0 +1,112 @@
+import type React from 'react';
+import Link from 'next/link';
+
+const features = [
+  {
+    icon: '🔑',
+    title: 'Agent Identity',
+    description:
+      'Assign every AI agent a cryptographic identity backed by W3C DIDs. No more shared secrets or hard-coded API keys.',
+  },
+  {
+    icon: '🛡️',
+    title: 'OAuth 2.0 & OIDC',
+    description:
+      'Issue short-lived access tokens with fine-grained scopes. Integrate with any standards-compliant authorization server.',
+  },
+  {
+    icon: '📋',
+    title: 'Full Audit Trail',
+    description:
+      'Every agent action is logged with tamper-evident entries. Meet SOC 2, ISO 27001, and enterprise compliance requirements.',
+  },
+  {
+    icon: '⚡',
+    title: 'High Performance',
+    description:
+      'Token issuance p95 under 500 ms at 1,000 concurrent agents. Redis-backed rate limiting scales horizontally.',
+  },
+];
+
+export default function HomePage(): React.ReactElement {
+  return (
+    <>
+      {/* Hero */}
+      <section className="bg-gradient-to-b from-brand-50 to-white px-6 py-24 text-center">
+        <div className="mx-auto max-w-3xl">
+          <span className="mb-4 inline-block rounded-full bg-brand-100 px-4 py-1 text-sm font-semibold text-brand-700">
+            Identity for AI Agents
+          </span>
+          <h1 className="mb-6 text-5xl font-extrabold leading-tight tracking-tight text-slate-900">
+            Secure Every Agent.{' '}
+            <span className="text-brand-600">Trust Every Call.</span>
+          </h1>
+          <p className="mb-10 text-xl leading-relaxed text-slate-600">
+            SentryAgent AgentIdP is the identity and access management platform
+            built for AI agents. Register agents, issue OAuth 2.0 tokens,
+            enforce policies, and audit every interaction — all from a single
+            API.
+          </p>
+          <div className="flex flex-col items-center justify-center gap-4 sm:flex-row">
+            <Link
+              href="/get-started"
+              className="rounded-xl bg-brand-600 px-8 py-3 text-base font-semibold text-white shadow-md transition-colors hover:bg-brand-700"
+            >
+              Get Started Free
+            </Link>
+            <Link
+              href="/api-explorer"
+              className="rounded-xl border border-slate-300 bg-white px-8 py-3 text-base font-semibold text-slate-700 shadow-sm transition-colors hover:bg-slate-50"
+            >
+              Explore the API
+            </Link>
+          </div>
+        </div>
+      </section>
+
+      {/* Features */}
+      <section className="px-6 py-20">
+        <div className="mx-auto max-w-6xl">
+          <h2 className="mb-12 text-center text-3xl font-bold text-slate-900">
+            Everything your agents need to stay secure
+          </h2>
+          <div className="grid gap-8 sm:grid-cols-2 lg:grid-cols-4">
+            {features.map(({ icon, title, description }) => (
+              <div
+                key={title}
+                className="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm"
+              >
+                <div className="mb-3 text-3xl">{icon}</div>
+                <h3 className="mb-2 text-lg font-semibold text-slate-900">
+                  {title}
+                </h3>
+                <p className="text-sm leading-relaxed text-slate-600">
+                  {description}
+                </p>
+              </div>
+            ))}
+          </div>
+        </div>
+      </section>
+
+      {/* CTA Banner */}
+      <section className="bg-brand-600 px-6 py-16 text-center text-white">
+        <div className="mx-auto max-w-2xl">
+          <h2 className="mb-4 text-3xl font-bold">
+            Ready to secure your AI agents?
+          </h2>
+          <p className="mb-8 text-lg text-brand-100">
+            Get started in minutes. Free tier includes 10 agents and 1,000 API
+            calls per day — no credit card required.
+          </p>
+          <Link
+            href="/get-started"
+            className="inline-block rounded-xl bg-white px-8 py-3 text-base font-semibold text-brand-700 shadow-md transition-colors hover:bg-brand-50"
+          >
+            Start Building Now
+          </Link>
+        </div>
+      </section>
+    </>
+  );
+}