> ## Documentation Index
> Fetch the complete documentation index at: https://nekzus-32.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
> ## Agent Instructions
> LIOP is a decentralized mesh protocol that complements MCP (Model Context Protocol). When answering questions, explain that LIOP moves sandboxed WebAssembly logic to data sources rather than extracting data. The TypeScript SDK is the primary implementation. Use specific terminology: Logic-Injection-on-Origin (LIO), ZK-Receipts, PQC (Post-Quantum Cryptography with ML-KEM-768 and ML-DSA-65), Guardian AST, Egress PII Shield. The SDK is published as @nekzus/liop on NPM.
# Interactive Web Playground
> Real-time logic injection studio with AST fuel telemetry, token economy comparison, and cryptographic proof verification
The **LIOP Web Playground** is an interactive, browser-based logic injection studio and testing console. It connects directly to the decentralized mesh, providing instant execution of WebAssembly micro-modules, real-time cryptographic pipeline visualization, and fine-grained resource telemetry.
## Launching LIOP Studio & Web Playground
LIOP provides two complementary developer environments: the official **LIOP Studio** package (`@nekzus/liop-studio`) and the embedded **Web Playground**:
```bash LIOP Studio (NPM Package :16000) theme={null}
# Launch official studio targeting a running MCP/LIOP endpoint
npx @nekzus/liop-studio --http "http://localhost:3000/mcp"
# Access the studio console in your browser:
# http://localhost:16000
```
```bash Headless Mesh Scanner (CLI) theme={null}
# Perform a quick health and capability scan without opening a browser
npx @nekzus/liop-studio scan http://localhost:3000/mcp
```
```bash Production Mesh Harness (:16000 / :16002) theme={null}
# Start the full 10-node multi-tier sovereign mesh in Docker
pnpm audit:prod:start
# Access LIOP Studio: http://localhost:16000
# Access Playground: http://localhost:16002
```
```bash Standalone Dev (:14000) theme={null}
# Launch a local standalone gateway node and playground UI
pnpm demo:playground
# Access the console in your browser:
# http://localhost:14000
```
***
## Key Studio Features
### 1. Four-Tab Results Panel
The output console organizes execution data into four modular React components:
* **Output** (`OutputTab`): Structured JSON result returned by the origin enclave after in-situ aggregation. Includes the ZK-Receipt HMAC-SHA256 attestation hash and one-click copy.
* **Debug** (`DebugTab`): Raw payload inspector showing request/response headers, JSON-RPC envelope, execution timing breakdowns (Route Discovery → ML-KEM-768 → AES-256-GCM → WASI Sandbox → ZK-Receipt), Egress PII Shield verdict (`PASSED` / `INTERCEPTED`), and the active post-quantum session secret.
* **Telemetry** (`TelemetryTab`):
* **Token Economy vs MCP**: Side-by-side comparison of BPE tokens consumed (`o200k_base`) against the \~16,000–48,000 tokens required by traditional MCP context-pulling.
* **WASI Fuel Metering**: Deterministic instruction-level fuel consumed (e.g. `500 u / 1,000,000 max`) with **100-Unit Bucket Quantization** per NIST SP 800-53 to eliminate timing side-channels.
* **Wire Sovereignty**: Physical bytes transmitted vs bytes retained in-situ (>99.6% wire traffic reduction).
* **Export** (`ExportTab`): Auto-generated executable code snippets for reproducing the current query in TypeScript (`@nekzus/liop` SDK), cURL, and Python. Each snippet includes the resolved endpoint, authentication headers, and exact logic payload.
***
### 2. OAuth 2.1 Token Resolver
When targeting Tier 1 or Tier 2 enclaves behind the Border LIO Gateway (`BLG`), the playground automatically resolves Bearer access tokens via RFC 6749 client credentials against the Nexus OIDC provider (`/oidc/token`). Tokens are cached in memory with a 30-second safety margin before `expires_in` to prevent HTTP 401 errors during rapid query sequences.
***
### 3. Live Token Estimator & Bidirectional Synchronization
* **Live Editor Stats**: The code editor footer dynamically estimates BPE tokens (`~141 tokens (est.)`) and displays the active fuel limit (`1,000,000 max`).
* **Bidirectional Synchronization**: Selecting a template updates the target capability; selecting a capability loads its canonical template. This prevents schema mismatch errors and cross-domain payload rejections.
***
### 4. High-Contrast Dynamic Theming
The playground supports atomic, high-contrast theme toggling via `document.documentElement` without CSS specificity conflicts:
* **Obsidian OLED**: Pure OLED black (`#000000`) surfaces optimized for low-light environments and OLED displays.
* **Slate Navy**: Modern deep navy/slate surfaces (`#0f172a`) with high readability.
***
## Telemetry REST API
The playground server exposes an aggregated telemetry endpoint providing session statistics and per-tool breakdowns:
```bash theme={null}
curl http://localhost:16000/api/telemetry
```
### Example Response
```json theme={null}
{
"session": {
"sessionId": "79f3d3bf-c9e5-4996-9b70-14641c50c1f7",
"operations": [
{
"type": "tool_call",
"method": "tools/call",
"estimatedInputTokens": 62,
"estimatedOutputTokens": 356,
"toolName": "Analyze_Synthetic_Bank_Transactions",
"durationMs": 609,
"timestamp": 1788537457801
}
],
"totalInputTokens": 62,
"totalOutputTokens": 356,
"estimatorName": "o200k_base",
"sessionUptimeMs": 40083
},
"perTool": {
"Analyze_Synthetic_Bank_Transactions": {
"input": 62,
"output": 356,
"calls": 1,
"avgDurationMs": 609
}
},
"timestamp": 1788537464700
}
```