export default function StatusPill({ children, tone = 'cyan' }) { const styles = { cyan: 'border-violet-400/30 bg-violet-400/10 text-violet-300', amber: 'border-amber-400/30 bg-amber-400/10 text-amber-300', green: 'border-emerald-400/30 bg-emerald-400/10 text-emerald-300', red: 'border-red-400/30 bg-red-400/10 text-red-300', slate: 'border-slate-600 bg-slate-800 text-slate-300' }; return <span className={`inline-flex rounded-full border px-2.5 py-1 text-xs font-semibold ${styles[tone]}`}>{children}</span> }