/* ══════════════════════════════════════════════════════════
   EMPTY STATE
   ══════════════════════════════════════════════════════════ */
.empty-state {
  text-align: center;
  padding: var(--sp-12) var(--sp-5);
  color: var(--hint);
}
.empty-state .empty-icon { font-size: 48px; margin-bottom: var(--sp-4); }
.empty-state p { font-size: var(--fs-sm); line-height: var(--lh-relaxed); }

/* ══════════════════════════════════════════════════════════
   UTILITY
   ══════════════════════════════════════════════════════════ */
.flex { display: flex; }
.flex-col { flex-direction: column; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.flex-1 { flex: 1; }
.hidden { display: none !important; }
.divider { height: 1px; background: var(--border); margin: var(--sp-4) 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}