sidebar-l {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gutter, var(--space-s-l));
}

sidebar-l > :first-child {
  flex-basis: var(--sidebar-target-width, 20rem);
  flex-grow: 1;
}

sidebar-l > :last-child {
  flex-basis: 0;
  flex-grow: 999;
  min-inline-size: var(--sidebar-content-min-width, 50%);
}

/*
A flipped version where the sidebar is on the right
*/
sidebar-l[data-direction='rtl'] {
  flex-direction: row-reverse;
}