/*
  UI spacing patch

  Tailwind's `space-y-*` utilities work by applying `margin-top` to direct children.
  React Router's <Link> renders an <a> which is `display: inline` by default,
  and inline elements don't apply vertical margins, so stacked "card" links can
  end up visually stuck together.

  This rule makes links behave like block items when they are direct children of
  a vertical `space-y-*` stack.
*/

.space-y-1 > a,
.space-y-1\.5 > a,
.space-y-2 > a,
.space-y-2\.5 > a,
.space-y-3 > a,
.space-y-4 > a,
.space-y-5 > a,
.space-y-6 > a {
  display: block;
  width: 100%;
}