/* ============================================
   UTILITY CLASSES
   ============================================ */

/* Visibility */
.hidden { display: none !important; }

/* Spacing */
.flush { margin: 0; }

/* Text */
.txt--subtle { color: var(--ink-75); }

/* User Avatar */
.user-avatar { border-radius: var(--radius-full); object-fit: cover; }
.user-avatar--nav { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; position: relative; transition: all 0.2s ease; font-size: 9px; flex-shrink: 0; }
.user-avatar--nav::before { content: ''; position: absolute; inset: 0; border-radius: var(--radius-full); padding: 2px; background: var(--gradient-brand); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; transition: all 0.2s ease; }
.user-avatar--nav .user-avatar__initials { color: transparent; background: var(--gradient-brand); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.nav__me { display: flex; align-items: center; }
.nav__link--me { display: inline-flex; align-items: center; justify-content: center; }
.nav__link--me--active .user-avatar--nav::after { content: ''; position: absolute; bottom: -6px; left: 50%; transform: translateX(-50%); width: 16px; height: 2px; background: var(--gradient-brand); border-radius: 1px; }

/* Sheet (system pages) */
.sheet { background: var(--surface); border: 1px solid var(--ink-10); border-radius: var(--radius-md); }
.sheet--inset { padding: var(--space-lg); }

/* Data Table (system pages) */
.data-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.data-table thead th { text-align: left; font-size: var(--text-sm); font-weight: 600; color: var(--ink-60); padding: var(--space-sm) var(--space-md) var(--space-sm) 0; border-bottom: 1px solid var(--border-light); white-space: nowrap; }
.data-table thead th:last-child { width: 80px; }
.data-table tbody td { padding: var(--space-md) var(--space-md) var(--space-md) 0; border-bottom: 1px solid var(--border-light); font-size: var(--text-sm); vertical-align: middle; }
.data-table tbody tr:last-child td { border-bottom: none; }
.data-table__actions { display: flex; gap: var(--space-xs); justify-content: flex-end; }
.data-table__link { color: var(--primary); text-decoration: none; }
.data-table__link:hover { text-decoration: underline; }
.data-table__agents { max-width: 280px; word-wrap: break-word; }