:root {
  --measure: 60ch;
}

.with-sidebar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--size-1);
}

.with-sidebar > :first-child {
  flex-grow: 1;
}

.with-sidebar > :last-child {
  flex-basis: 0;
  flex-grow: 999;
  min-inline-size: 50%;
  padding: var(--size-2);
  margin-block-start: 1em;
}

.cluster {
  display: flex;
  flex-wrap: wrap;
  gap: var(--size-3, 1rem);
  justify-content: flex-start;
  align-items: center;
}

.stack {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.stack > * {
  margin-block: 0;
} 

.stack > * + * {
  margin-block-start: var(--size-1, 1.5rem);
}

.center {
  box-sizing: content-box;
  margin-inline: auto;
  max-inline-size: var(--measure);
}

.with-icon {
  display: inline-flex;
  vertical-align: baseline;
  line-height: 1;
}

.with-icon .icon {
  margin-inline-end: var(--size-1)
}