refactor(agents-server-ui): use usage.ratio in the breakdown header [review #4596]

The popover header recomputed `min(1, usedTokens/contextWindow)` locally —
exactly what `computeContextUsage` already stored as `usage.ratio` (and what the
trigger gauge uses). Use it directly so the two can't drift.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: kevin-dp

packages/agents-server-ui/src/components/ContextUsageDetails.tsx

@@ -26,17 +26,12 @@ export function ContextUsageDetails({
   segments,
   modelId,
 }: ContextUsageDetailsProps): React.ReactElement {
-  const usedRatio =
-    usage.contextWindow > 0
-      ? Math.min(1, usage.usedTokens / usage.contextWindow)
-      : 0
-
   return (
     <div className={styles.panel}>
       <div className={styles.header}>
         <span className={styles.title}>Context usage</span>
         <span className={styles.headline}>
-          {formatContextUsagePercent(usedRatio)}
+          {formatContextUsagePercent(usage.ratio)}
         </span>
       </div>
       <div className={styles.subhead}>