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

.l-sidebar > .l-sidebar__side {
  flex-basis: var(--sidebar-width, 24ch);
  flex-grow: 1;
}

.l-sidebar > .l-sidebar__content {
  flex-basis: 0;
  flex-grow: 999;
  min-inline-size: 60%;
}

.l-sidebar--width-narrow {
  --sidebar-width: 22ch;
}

.l-sidebar--width-standard {
  --sidebar-width: 32ch;
}

.l-sidebar--space-small {
  --sidebar-space: var(--s-3);
}

.l-sidebar--space-large {
  --sidebar-space: var(--s-4) var(--s-5);
}