/* =========================================================
   Atomic utilities — one rule per class.
   Loaded after app.css; specificity stays single-class so
   any scoped component CSS (which gets a [b-xxx] attribute
   selector) still wins for component-specific overrides.
   ========================================================= */

/* --- color ----------------------------------------------- */
.u-bone     { color: var(--bone); }
.u-bone-dim { color: var(--bone-dim); }
.u-signal   { color: var(--signal); }
.u-accent   { color: var(--accent, var(--signal)); }

/* --- font family ----------------------------------------- */
.u-mono    { font-family: var(--font-mono); }
.u-display { font-family: var(--font-display); }
.u-body    { font-family: var(--font-body); }

/* --- font weight ----------------------------------------- */
.u-w-700 { font-weight: 700; }
.u-w-800 { font-weight: 800; }

/* --- letter-spacing -------------------------------------- */
.u-track-wide  { letter-spacing: 0.22em; }   /* eyebrow / mono labels */
.u-track-mid   { letter-spacing: 0.12em; }   /* mono buttons / back link */
.u-track-tight { letter-spacing: -0.02em; }  /* display titles */

/* --- text-transform / size ------------------------------- */
.u-upper   { text-transform: uppercase; }
.u-text-xs { font-size: 0.78rem; }