.flow{display:flex;align-items:stretch;gap:12px}.flow>[data-diagram-role="card"]{flex:1}.arrow{display:grid;place-items:center;min-width:20px}.compare{grid-template-columns:repeat(2,minmax(0,1fr))}.layers{display:grid}.layers>[data-diagram-role="card"]{grid-template-columns:30px minmax(0,1fr);align-items:start}.step{justify-content:center}@media(min-width:721px) and (max-width:1100px){.flow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.flow>.arrow{display:none}}@media(max-width:720px){.flow,.compare{display:grid;grid-template-columns:1fr}}