Token or usage indicator is shown near the input

When an application enforces per-user message quotas or subscription-tier rate limits but shows no indicator, users experience silent, opaque walls — a request goes out, nothing comes back, and there is no signal explaining why. This erodes trust and generates support tickets that cost real time. The iso-25010:2011 performance-efficiency dimension treats predictability as a quality attribute: users cannot manage their own consumption if the system conceals it. Cost-efficiency also degrades on the operator side when users retry aggressively against an invisible limit, amplifying API spend without delivering additional value.

Return remaining quota from your API route and render it near the input in src/components/chat/ChatInput.tsx. Only render the indicator when a limit is actually enforced — do not show it for unlimited tiers.

{usageLimit && (
  <span className={cn(
    "text-xs",
    remaining < 5 ? "text-destructive" : "text-muted-foreground"
  )}>
    {remaining} / {usageLimit} messages remaining
  </span>
)}

Emit X-RateLimit-Remaining (or equivalent) as a response header in app/api/chat/route.ts so the client can read it without parsing the full response body.