/* Semantic illustrations: source text carries the meaning; artwork stays decorative. */
.explain-art{display:block;width:100%;max-width:280px;height:auto;aspect-ratio:7/4;object-fit:contain;margin:0 auto 12px;flex-shrink:0}
.workflow-story .workflow-scene.explain-art{width:100%;max-width:300px;height:160px;object-fit:contain;margin:0 auto 12px}
.project-metric-card .explain-metric{max-width:200px;height:105px;margin-bottom:14px}
.explain-chain{margin:20px 0;padding:20px;border:1px solid #dce4f2;border-radius:14px;background:#f8faff;max-width:100%;min-width:0}
.explain-chain>figcaption{font-size:14px;font-weight:700;line-height:1.9;color:#253b73;margin-bottom:16px}
.explain-chain>ol{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:20px;list-style:none!important;margin:0!important;padding:0!important}
.explain-chain>ol>li{min-width:0;margin:0!important;padding:0;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;border:0;background:none;overflow-wrap:anywhere}
.explain-chain>ol>li .explain-art{height:100px;margin-bottom:6px;max-width:185px}
.explain-chain>ol>li>p{font-size:13px;line-height:1.9;margin:6px 0 0!important;color:#344968}
.explain-index{font-size:12px;font-weight:700;display:grid;place-items:center;background:#e8efff;color:#315ac1;border-radius:50%;width:24px;height:24px}
.explain-chain>ol>li:not(:last-child)::after{content:'←';position:absolute;inset-inline-end:-17px;top:50px;color:#7b92bc;font-size:19px}
.explain-note{font-size:13px;line-height:1.9;border-top:1px solid #dce4f2;margin:16px 0 0;padding-top:12px;color:#52617a}
.explain-handoff{background:#f6fbfa;border-color:#d8eae5}
.explain-source-text{display:none}
.explain-boundary{display:grid;grid-template-columns:110px 1fr;align-items:center;gap:16px;margin:16px 0;background:#fffaf2;border:1px solid #ecdfc5;border-radius:12px;padding:12px 16px}
.explain-boundary .explain-art{margin:0;height:80px}
.explain-boundary figcaption{font-size:13px;font-weight:700;line-height:1.9;color:#765b28}
.meaningful-flow.explain-product-flow{gap:18px;margin-block:24px;align-items:stretch}
.meaningful-flow.explain-product-flow>li{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:14px 16px;border:1px solid #dce4f2;border-radius:14px;background:#f8faff;gap:8px}
.meaningful-flow.explain-product-flow>li>.explain-art{width:100%;height:120px;margin:0 auto 4px}
.meaningful-flow.explain-product-flow>li>span{position:static;align-self:flex-start}
.meaningful-flow.explain-product-flow>li>p{margin:0;font-weight:600;font-size:14px;line-height:1.9}
.opportunity-grid>article>.explain-opportunity{height:110px;max-width:210px;margin-bottom:16px}
.explain-guide-card>.explain-guide{height:120px;max-width:210px;margin:0 auto 18px}
.handoff-node>.explain-role{height:100px;margin:0 auto 10px}
.explain-task-map{display:grid;grid-template-columns:130px 1fr;gap:0 20px;align-items:center;border:1px solid #dce4f2;border-radius:14px;background:#f8faff;padding:12px 18px;margin:20px 0}
.explain-task-map>.explain-art{grid-row:1/3;height:90px;width:130px;margin:0}
.explain-task-map>figcaption{font-size:14px;font-weight:600;line-height:2;color:#253b73}
.explain-task-map>p{font-size:12px;line-height:1.9;color:#52617a;margin:4px 0 0}
@media(max-width:700px){
 .project-metric-card .explain-metric{height:90px}
 .explain-chain{padding:16px}
 .explain-chain>ol{grid-template-columns:1fr;gap:26px}
 .explain-chain>ol>li{display:grid;grid-template-columns:86px 1fr;gap:2px 12px;align-items:center;text-align:start}
 .explain-chain>ol>li>.explain-art{grid-column:1;grid-row:1/3;width:86px;height:74px;margin:0}
 .explain-chain>ol>li>.explain-index{grid-column:2}
 .explain-chain>ol>li>p{grid-column:2}
 .explain-chain>ol>li:not(:last-child)::after{content:'↓';inset-inline-end:auto;inset-inline-start:35px;top:auto;bottom:-26px}
 .meaningful-flow.explain-product-flow{grid-template-columns:1fr}
 .meaningful-flow.explain-product-flow>li>.explain-art{height:110px}
 .explain-task-map{grid-template-columns:80px 1fr;padding:12px;gap:0 12px}
 .explain-task-map>.explain-art{width:80px;height:65px}
 .explain-task-map>figcaption{font-size:13px}
 .explain-task-map>p{grid-column:1/-1;margin-top:8px}
 .explain-boundary{grid-template-columns:85px 1fr;gap:10px;padding:10px}
 .workflow-story .workflow-scene.explain-art{height:140px}
}
@media print{.explain-chain,.explain-task-map,.explain-boundary{break-inside:avoid;box-shadow:none}.explain-art{max-height:90px}.workflow-story .workflow-scene.explain-art{height:90px}}
.flow>div>.explain-lab-step{height:95px;max-width:175px;margin:0 auto 12px}
.extension-list>li>.explain-extension{float:inline-end;width:110px;height:75px;margin:0 14px 8px 0}
.extension-list>li::after{content:'';display:block;clear:both}
@media(max-width:600px){.extension-list>li>.explain-extension{float:none;margin:0 auto 10px;width:150px;height:90px}.flow>div>.explain-lab-step{height:90px}}
.explain-boundary{grid-template-columns:150px 1fr;padding:16px}
.explain-boundary>.explain-art{width:150px;height:105px}
.explain-boundary figcaption>strong{display:block;font-size:12px;color:#886a35;margin-bottom:6px}
.explain-boundary figcaption>p{font-size:14px;line-height:2;color:#344968;margin:0;font-weight:400}
@media(max-width:600px){.explain-boundary{grid-template-columns:1fr}.explain-boundary>.explain-art{margin:0 auto;height:95px}.explain-boundary figcaption>p{font-size:13px}}