@layer utilities {
/* Single-purpose utility classes. Win over components by virtue of layer order
   (utilities > components). u- prefix flags them as utilities at a glance. */

.u-hidden       { display: none; }

.u-text-center  { text-align: center; }
.u-text-right   { text-align: right; }
.u-text-muted   { color: var(--color-gray-500); }
.u-text-sm      { font-size: var(--text-label-sm); }

.u-mt-0 { margin-top: 0; }
.u-mt-2 { margin-top: var(--space-2); }
.u-mt-4 { margin-top: var(--space-4); }
.u-mt-6 { margin-top: var(--space-6); }

.u-w-full { width: 100%; }

.u-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;
}
}
