Add profile info card below selector on function detail page

[mayagore]

Summary

The function detail page now has a profile selector with 5 default profiles (Nano, Mini, Standard, Giga, Giga Max). Currently the dropdown shows the label and a short description. A small info card below the selector showing more detail about the selected profile would help users choose the right one.

What to do

Add a card below the profile <select> dropdown on the function detail page that displays details about the currently selected profile:

• Profile name and description (already available in DEFAULT_PROFILES from lib/profiles.ts)
• Visual indicator of relative cost/power (e.g., a simple bar or label like "Budget", "Balanced", "Premium")

Files to modify

• objectiveai-web/app/functions/[...slug]/page.tsx — add info card below profile selector (around line 865)
• objectiveai-web/lib/profiles.ts — optionally add a tier or costLabel field to the profile definitions

Reference

• Profile constant: objectiveai-web/lib/profiles.ts (DEFAULT_PROFILES array)
• Design tokens: objectiveai-web/app/globals.css (var(--border), var(--page-bg), var(--text-muted))

Acceptance criteria

• Info card updates when a different profile is selected
• Matches the existing visual style (card with border, rounded corners)
• Responsive — works on mobile and desktop
• No new dependencies

Setup

npm install
npm run dev --workspace=objectiveai-web