.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.rounded-small { border-radius: var(--radius-small); }
.rounded-medium { border-radius: var(--radius-medium); }
.rounded-large { border-radius: var(--radius-large); }

.shadow-small { box-shadow: var(--shadow-small); }
.shadow-medium { box-shadow: var(--shadow-medium); }
.shadow-large { box-shadow: var(--shadow-large); }

.aspect-image {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-large);
}

.focusable:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}