/* Utility classes — .u-* prefix */

.u-text-muted {
  color: var(--color-text-muted);
  font-size: 0.825rem;
}

.u-text-center { text-align: center; }
.u-text-uppercase { text-transform: uppercase; }
.u-text-muted-opacity { opacity: 0.6; }

.u-mt-sm { margin-top: 0.5rem; }
.u-mt-md { margin-top: 1rem; }
.u-mt-lg { margin-top: 1.5rem; }
.u-mb-sm { margin-bottom: 0.5rem; }
.u-mb-md { margin-bottom: 1rem; }
.u-mb-lg { margin-bottom: 1.5rem; }
.u-separate { padding-bottom: 2rem; }
.u-mr-md { margin-right: 1rem; }
.u-mx-auto { margin-left: auto; margin-right: auto; }

.u-max-width-sm { max-width: 480px; }
.u-float-left { float: left; }
.u-clearfix::after { content: ""; display: table; clear: both; }

.u-avatar {
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: block;
}

.u-pointer { cursor: pointer; }
.u-grid-gutter-lg { --grid-gutter: 3rem; }

/* Dev-only utilities */
.u-demo-area {
  background: var(--color-contrast, #f9fafb);
  border: 1px dashed var(--color-border);
}