@utility h-item-xs {
  /* 24px minimum touch size for text line */
  height: 24px;
}
@utility h-item-sm {
  /* 28px save space for most used size */
  height: 28px;
}
@utility h-item-md {
  /* 34px most used size */
  height: 34px;
}
@utility h-item-lg {
  /* 44px maximum touch size without waste */
  height: 44px;
}
@utility h-item-xl {
  height: calc(var(--spacing) * 16);
}
@utility h-item-2xl {
  height: calc(var(--spacing) * 16);
}
@utility h-inline-xs {
  height: calc(var(--text-xs--line-height) * var(--text-xs));
}
@utility h-inline-sm {
  height: calc(var(--text-sm--line-height) * var(--text-sm));
}
@utility h-inline-md {
  height: calc(var(--text-md--line-height) * var(--text-md));
}
@utility h-inline-lg {
  height: calc(var(--text-lg--line-height) * var(--text-lg));
}
@utility h-inline-xl {
  height: calc(var(--text-xl--line-height) * var(--text-xl));
}
@utility h-inline-2xl {
  height: calc(var(--text-2xl--line-height) * var(--text-2xl));
}