/* Divider: a rule across the column with a word in its middle ("or") */
.divider {
  align-items: center;
  color: var(--color-muted);
  display: flex;
  font-size: var(--step--1);
  font-weight: var(--weight-semibold);
  gap: var(--space-xs);

  &::before,
  &::after {
    background: var(--color-subtle);
    block-size: var(--border-width);
    content: "";
    flex: 1;
  }
}