/* ==========================================================================
   SYNAPSE — Utilities (last layer, may override components)
   Deliberately small: reach for a component or layout primitive first.
   ========================================================================== */

/* Text */
.t-display { font-family: var(--font-display); }
.t-mono { font-family: var(--font-mono); }
.t-micro { font-size: var(--fs-micro); }
.t-xs { font-size: var(--fs-xs); }
.t-sm { font-size: var(--fs-sm); }
.t-md { font-size: var(--fs-md); }
.t-lg { font-size: var(--fs-lg); }
.t-xl { font-size: var(--fs-xl); }
.t-2xl { font-size: var(--fs-2xl); }
.t-3xl { font-size: var(--fs-3xl); }

.t-muted { color: var(--text-muted); }
.t-faint { color: var(--text-faint); }
.t-primary { color: var(--primary); }
.t-secondary { color: var(--secondary); }
.t-accent { color: var(--accent); }
.t-danger { color: var(--danger); }
.t-success { color: var(--success); }
.t-base { color: var(--text); }

.t-medium { font-weight: var(--weight-medium); }
.t-semibold { font-weight: var(--weight-semibold); }
.t-bold { font-weight: var(--weight-bold); }

.t-caps { text-transform: uppercase; letter-spacing: var(--tracking-caps); }
.t-center { text-align: center; }
.t-start { text-align: start; }
.t-end { text-align: end; }
.t-nowrap { white-space: nowrap; }
.t-balance { text-wrap: balance; }
.t-tabular { font-variant-numeric: tabular-nums; }

.measure { max-width: var(--measure); }
.measure-tight { max-width: var(--measure-tight); }
.measure-wide { max-width: var(--measure-wide); }
.measure-none { max-width: none; }

.clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Spacing */
.mt-0 { margin-block-start: 0; }
.mt-2 { margin-block-start: var(--s-2); }
.mt-3 { margin-block-start: var(--s-3); }
.mt-4 { margin-block-start: var(--s-4); }
.mt-6 { margin-block-start: var(--s-6); }
.mt-8 { margin-block-start: var(--s-8); }
.mt-10 { margin-block-start: var(--s-10); }
.mt-12 { margin-block-start: var(--s-12); }
.mt-16 { margin-block-start: var(--s-16); }
.mb-0 { margin-block-end: 0; }
.mb-4 { margin-block-end: var(--s-4); }
.mb-6 { margin-block-end: var(--s-6); }
.mb-8 { margin-block-end: var(--s-8); }
.mb-12 { margin-block-end: var(--s-12); }
.mi-auto { margin-inline: auto; }
.p-0 { padding: 0; }
.p-4 { padding: var(--s-4); }
.p-6 { padding: var(--s-6); }
.p-8 { padding: var(--s-8); }

/* Display & flex helpers */
.block { display: block; }
.inline-block { display: inline-block; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.grid-d { display: grid; }
.hidden { display: none; }
.contents { display: contents; }
.flex-col { flex-direction: column; }
.items-start { align-items: flex-start; }
.items-center { align-items: center; }
.items-end { align-items: flex-end; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.justify-end { justify-content: flex-end; }
.flex-1 { flex: 1 1 0; }
.flex-none { flex: none; }
.wrap { flex-wrap: wrap; }
.gap-1 { gap: var(--s-1); }
.gap-2 { gap: var(--s-2); }
.gap-3 { gap: var(--s-3); }
.gap-4 { gap: var(--s-4); }
.gap-6 { gap: var(--s-6); }
.gap-8 { gap: var(--s-8); }
.gap-10 { gap: var(--s-10); }
.self-start { align-self: start; }
.self-end { align-self: end; }
.order-first { order: -1; }
.order-last { order: 9; }

/* Sizing */
.w-full { width: 100%; }
.h-full { height: 100%; }
.max-w-none { max-width: none; }
.fit { width: fit-content; }

/* Position */
.relative { position: relative; }
.absolute { position: absolute; }
.inset-0 { inset: 0; }
.z-1 { z-index: 1; }
.z-2 { z-index: 2; }
.overflow-hidden { overflow: hidden; }
.isolate { isolation: isolate; }

/* Surface */
.bg-panel { background: var(--bg-panel); }
.bg-inset { background: var(--bg-inset); }
.bg-raised { background: var(--bg-raised); }
.bg-none { background: none; }
.border-a { border: 1px solid var(--border); }
.border-t { border-block-start: 1px solid var(--border); }
.border-b { border-block-end: 1px solid var(--border); }
.border-s { border-inline-start: 1px solid var(--border); }
.border-hairline { border-color: var(--border-faint); }
.r-sm { border-radius: var(--r-sm); }
.r-md { border-radius: var(--r-md); }
.r-lg { border-radius: var(--r-lg); }
.r-xl { border-radius: var(--r-xl); }
.r-2xl { border-radius: var(--r-2xl); }
.r-pill { border-radius: var(--r-pill); }
.shadow-md { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }
.shadow-xl { box-shadow: var(--shadow-xl); }
.glow { box-shadow: var(--glow-primary); }
.glow-violet { box-shadow: var(--glow-secondary); }

/* List reset */
.list-none { list-style: none; padding: 0; }
.list-none > li { margin: 0; }

/* Responsive visibility */
@media (max-width: 900px) { .hide-md { display: none !important; } }
@media (min-width: 901px) { .show-md { display: none !important; } }
@media (max-width: 620px) { .hide-sm { display: none !important; } }