/* Onboarding: empty-canvas call to action and dismissible tips (51-onboarding.js). Colours come from app.css tokens. */
.empty .empty-add { margin: 14px auto 0; pointer-events: auto; min-height: 44px; }
.hints { pointer-events: auto; align-items: center; max-width: calc(100% - 28px); }
.hints[hidden] { display: none; }
.hints-list { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.hints-list li { padding: 3px 9px; border-radius: 999px; background: var(--surface); border: 1px solid var(--border); }
.hints-dismiss { min-height: 44px; min-width: 44px; padding: 0 10px; font-size: 12px; }
@media (prefers-reduced-motion: no-preference) {
  .empty-add { transition: transform .12s ease; }
  .empty-add:active { transform: scale(.97); }
}