article#content{--target-color: #d7e1ff;--source-color: #e2ffd1;--endpoint-color: #f2d1ff;padding-bottom:8rem}article#content p{line-height:1.4;max-width:80ch}article#content p code{font-weight:bold}article#content p.long,article#content p.date-attribution{max-width:unset}article#content code{font-size:1rem}article#content pre{box-shadow:none;scrollbar-color:unset}article#content pre{background:rgba(0,0,0,0);font-weight:bold}article#content code,article#content span,article#content em{background-color:var(--local-color, white);color:#333}article#content code.target,article#content span.target,article#content em.target{font-weight:bold;--local-color: var(--target-color)}article#content code.source,article#content span.source,article#content em.source{font-weight:bold;--local-color: var(--source-color)}article#content code.endpoint,article#content span.endpoint,article#content em.endpoint{font-weight:bold;--local-color: var(--endpoint-color)}article#content div.diagram{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;align-items:center}article#content div.diagram figure.arrow{margin:0;padding:0;--arrow-shadow-color: #ccc;font-weight:bold;font-size:3rem;text-shadow:.2rem .2rem var(--arrow-shadow-color)}article#content div.diagram figure.arrow.endpoint{--arrow-shadow-color: var(--endpoint-color) }article#content div.diagram figure.arrow.source{--arrow-shadow-color: var(--source-color);align-self:baseline}article#content div.diagram figure.arrow.target{--arrow-shadow-color: var(--target-color) }article#content div.diagram:has(figure figcaption) figure{margin-top:40px}article#content div.diagram figure.webmention{margin:0;padding:0;max-width:33vw;border:1.5rem solid var(--local-color, #ccc);background:var(--local-color, #ccc);display:grid;justify-content:center;align-items:center;gap:1rem;position:relative}article#content div.diagram figure.webmention img{width:100%;height:auto;display:block;mix-blend-mode:multiply}article#content div.diagram figure.webmention.target{--local-color: var(--target-color)}article#content div.diagram figure.webmention.target figcaption{top:-40px;left:-40px;position:absolute;transform:rotate(-5deg);font-family:monospace;font-size:1.2rem;color:#000;background:var(--endpoint-color);border-radius:.4rem;max-width:40vw}article#content div.diagram figure.webmention.source{--local-color: var(--source-color)}article#content div.diagram figure.webmention.source figcaption{text-wrap:balance;top:20px;left:-40px;position:absolute;font-size:1.2rem;color:#000;background:#fff;border-radius:.4rem;max-width:40vw;padding:1rem;border:.3rem solid #666}article#content div.diagram figure.webmention.endpoint{--local-color: var(--endpoint-color)}article#content hr{margin:2rem 0;border:0;border-top:1px solid #ccc}