Platform breakdown on Pulse, cost display on sessions

components/SessionCard.tsx

@@ -8,13 +8,14 @@ import type { Session } from "@/lib/types";
 export function SessionCard({ session }: { session: Session }) {
   const tokens = session.input_tokens + session.output_tokens;
   const title = session.title || "Untitled session";
+  const cost = session.estimated_cost_usd;
 
   return (
     <Link href={`/history/${session.id}`}>
       <div className="flex items-center gap-3 py-3 px-1 border-b border-white/[0.04] active:bg-white/[0.02] transition-colors">
         <div className="flex-1 min-w-0">
           <div className="text-[14px] text-[var(--text-1)] truncate">{title}</div>
-          <div className="flex items-center gap-2 mt-0.5">
+          <div className="flex items-center gap-2 mt-0.5 flex-wrap">
             <span className={`badge ${platformBadgeClass(session.source)}`}>
               {session.source}
             </span>
@@ -26,6 +27,11 @@ export function SessionCard({ session }: { session: Session }) {
                 {formatTokens(tokens)}
               </span>
             )}
+            {cost != null && cost > 0 && (
+              <span className="text-[11px]" style={{ color: "var(--text-3)" }}>
+                ${cost.toFixed(2)}
+              </span>
+            )}
             <span className="text-[11px] ml-auto" style={{ color: "var(--text-3)" }}>
               {timeAgo(session.started_at)}
             </span>