function transportsFigure(host) {
ensureStyles();
var parts = [];
parts.push('STDIO (SUBPROCESS)');
parts.push('client process');
parts.push('server (child process)');
parts.push('stdin');
parts.push('stdout');
parts.push('stderr');
parts.push('STREAMABLE HTTP (POST /mcp)');
parts.push('client (any HTTP peer)');
parts.push('server (validate + dispatch)');
parts.push('POST /mcp');
parts.push('response');
parts.push('!');
parts.push('mismatch: 400 + -32020');
parts.push('protocol semantics are identical on every transport; only the binding differs');
parts.push('stdio has no header layer: version and capabilities travel only in _meta');
parts.push('HTTP mirrors method, name, and x-mcp-header params; a mismatch is 400 + -32020');
var shell = document.createElement('div');
shell.className = 'mf-shell';
shell.innerHTML = [
'
Transports and Headers the same message, two bindings
',
'
',
'',
'
',
'
stdio carries every message inline over stdin and stdout, with logs on a separate stderr line and no header layer at all. Streamable HTTP mirrors the method, the tool or resource name, and any x-mcp-header argument into headers so a gateway can route without parsing the body, but the body stays the source of truth: a header that disagrees with it is rejected with HTTP 400 and a HeaderMismatch (-32020) error before the tool ever runs.