@layer components {
  .empty-state {
    padding: var(--space-6) var(--space-4);
    text-align: center;
    color: var(--ink-3);
  }
  .empty-state .icon {
    width: 2rem;
    height: 2rem;
    margin: 0 auto var(--space-3);
    color: var(--ink-4);
  }
  .empty-state__title {
    margin-bottom: var(--space-1);
    font-family: var(--font-serif);
    font-size: var(--text-lg);
    color: var(--ink-2);
  }
}