/* Utilities: a deliberately small set. Prefer component classes; reach for these
   only for one-off spacing or alignment. Keep the list short. */
.u-visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.u-text-center {
    text-align: center;
}

.u-text-right {
    text-align: right;
}

.u-muted {
    color: var(--app-muted);
}

.u-small {
    font-size: var(--app-text-sm);
}

.u-mono {
    font-family: var(--app-font-mono);
    font-variant-numeric: tabular-nums;
}

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

.u-flex {
    display: flex;
}

.u-items-center {
    align-items: center;
}

.u-gap-2 {
    gap: var(--app-space-2);
}

.u-gap-4 {
    gap: var(--app-space-4);
}

.u-grow {
    flex: 1;
}

.u-nowrap {
    white-space: nowrap;
}

@media (max-width: 799.98px) {
    .u-hide-mobile {
        display: none !important;
    }
}

@media (min-width: 800px) {
    .u-hide-desktop {
        display: none !important;
    }
}