
.bm figure.bs-flow{display:block;max-width:940px;margin:24px 0;padding:18px;background:#f0ece2}
.bm .bs-flow figcaption{max-width:none;margin-top:18px}
.bs-route{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:0;padding:0;list-style:none}
.bs-route li{position:relative;padding:12px 10px;border:1px solid #bdb39e;background:#fffaf1;font-size:.85rem;line-height:1.5}
.bs-route li:not(:last-child)::after{content:"→";position:absolute;left:calc(100% + 4px);top:calc(50% - .7em);font-size:20px;color:#456660}
.bs-route b,.bs-route span{display:block}
.bs-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:22px 0}
.bm .bs-examples article{padding:16px;border:1px solid #d8d2c5;background:#fffaf1}
.bm .bs-examples h3{margin:0 0 14px;font-size:1.2rem;line-height:1.3}
.bs-examples dl{margin:0;font-size:.9rem;line-height:1.6}
.bs-examples dt{font-weight:600;margin-top:12px}
.bs-examples dd{margin:3px 0 0}
@media(max-width:650px){
 .bs-route,.bs-examples{grid-template-columns:1fr}
 .bs-route{gap:24px}
 .bs-route li:not(:last-child)::after{content:"↓";left:calc(50% - .4em);top:100%}
 .bm figure.bs-flow{padding:14px}
 .bs-examples dl{display:grid;grid-template-columns:65px minmax(0,1fr);gap:8px}
 .bs-examples dt,.bs-examples dd{margin:0}
}
