@layer components{.twentyone-icon{display:flex;align-items:center;justify-content:center;flex:0 0 auto}.twentyone-icon svg,.twentyone-icon img{aspect-ratio:1;fill:inherit;flex:0 0 auto;height:1em;object-fit:contain;width:1em;transition:var(--twentyone--element--transition)}.has--icon.icon--top-start{flex-direction:column;align-items:start;text-align:start}.has--icon.icon--top{flex-direction:column;align-items:center;text-align:center}.has--icon.icon--top-end{flex-direction:column;align-items:end;text-align:end}.has--icon.icon--right-start{flex-direction:row-reverse;align-items:start}.has--icon.icon--right{flex-direction:row-reverse;align-items:center}.has--icon.icon--right-end{flex-direction:row-reverse;align-items:end}.has--icon.icon--bottom-end{flex-direction:column-reverse;align-items:end;text-align:end}.has--icon.icon--bottom{flex-direction:column-reverse;align-items:center;text-align:center}.has--icon.icon--bottom-start{flex-direction:column-reverse;align-items:start;text-align:start}.has--icon.icon--left-end{flex-direction:row;align-items:end}.has--icon.icon--left{flex-direction:row;align-items:center}.has--icon.icon--left-start{flex-direction:row;align-items:start}}