/* Five local-only explanatory figures. No script, remote assets or animation. */
.shcj-article-v2 .shcj-diagram{margin:24px 0;padding:20px;border:1px solid var(--ui-line);border-radius:var(--ui-small-radius);background:var(--ui-tint);color:var(--ui-ink);font-size:16px;line-height:1.65}
.shcj-article-v2 .shcj-diagram figcaption{font-size:18px;font-weight:700;color:var(--ui-ink);text-align:left;margin:0 0 10px}
.shcj-article-v2 .shcj-diagram-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.shcj-article-v2 .shcj-diagram-card{min-width:0;padding:16px;border:1px solid var(--ui-line);border-radius:12px;background:white}
.shcj-article-v2 .shcj-diagram-card>strong{display:block;color:var(--ui-blue)}
.shcj-article-v2 .shcj-diagram p{margin:6px 0 0;font-size:16px;line-height:1.65}
.shcj-article-v2 .shcj-diagram svg{display:block;max-width:100%;width:240px;height:auto;margin:6px auto;fill:none;stroke:var(--ui-blue);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.shcj-article-v2 .shcj-diagram svg .filled{fill:#dceeff}
.shcj-article-v2 .shcj-diagram svg text{fill:var(--ui-ink);stroke:none;font:16px sans-serif}
.shcj-article-v2 .shcj-diagram .shcj-diagram-note{padding:8px 0 0;border-top:1px solid var(--ui-line);margin-top:10px}
.shcj-article-v2 .shcj-diagram-flow{display:grid;justify-items:center;gap:2px;margin-top:10px}
.shcj-article-v2 .shcj-diagram-flow span:not([aria-hidden]){padding:6px 12px;background:var(--ui-tint);border:1px solid var(--ui-line);border-radius:8px}
.shcj-article-v2 .shcj-diagram .shcj-diagram-term{font-size:22px;font-weight:700}
.shcj-article-v2 .shcj-diagram-roles{margin-top:10px;padding:12px;background:white;border:1px solid var(--ui-line);border-radius:12px}
.shcj-article-v2 .shcj-diagram dl{margin:8px 0 0}
.shcj-article-v2 .shcj-diagram dl>div{padding:5px 0;border-top:1px solid var(--ui-line)}
.shcj-article-v2 .shcj-diagram dt{font-weight:700}
.shcj-article-v2 .shcj-diagram dd{margin:4px 0 0}
@media(max-width:720px){.shcj-article-v2 .shcj-diagram{padding:12px}.shcj-article-v2 .shcj-diagram-grid{grid-template-columns:minmax(0,1fr)}.shcj-article-v2 .shcj-diagram-card{padding:10px 12px}}

.shcj-article-v2 .shcj-diagram>svg{width:360px;max-width:100%;margin:16px auto}
.shcj-article-v2 .shcj-diagram>svg text{font-size:20px}.shcj-article-v2 .shcj-diagram>svg text.note{font-size:18px}
.shcj-article-v2 .shcj-diagram>svg .box{fill:#eef7ff}.shcj-article-v2 .shcj-diagram>svg .label{font-weight:700}
