feat(cli): Invert quota language to 'percent used' (#20100)

Co-authored-by: jacob314 <jacob314@gmail.com>

packages/cli/src/ui/components/QuotaDisplay.test.tsx

@@ -5,10 +5,20 @@
  */
 
 import { render } from '../../test-utils/render.js';
-import { describe, it, expect } from 'vitest';
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
 import { QuotaDisplay } from './QuotaDisplay.js';
 
 describe('QuotaDisplay', () => {
+  beforeEach(() => {
+    vi.stubEnv('TZ', 'America/Los_Angeles');
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date('2026-03-02T20:29:00.000Z'));
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+    vi.unstubAllEnvs();
+  });
   it('should not render when remaining is undefined', async () => {
     const { lastFrame, waitUntilReady, unmount } = render(
       <QuotaDisplay remaining={undefined} limit={100} />,
@@ -36,7 +46,7 @@ describe('QuotaDisplay', () => {
     unmount();
   });
 
-  it('should not render when usage > 20%', async () => {
+  it('should not render when usage < 80%', async () => {
     const { lastFrame, waitUntilReady, unmount } = render(
       <QuotaDisplay remaining={85} limit={100} />,
     );
@@ -45,7 +55,7 @@ describe('QuotaDisplay', () => {
     unmount();
   });
 
-  it('should render yellow when usage < 20%', async () => {
+  it('should render warning when used >= 80%', async () => {
     const { lastFrame, waitUntilReady, unmount } = render(
       <QuotaDisplay remaining={15} limit={100} />,
     );
@@ -54,7 +64,7 @@ describe('QuotaDisplay', () => {
     unmount();
   });
 
-  it('should render red when usage < 5%', async () => {
+  it('should render critical when used >= 95%', async () => {
     const { lastFrame, waitUntilReady, unmount } = render(
       <QuotaDisplay remaining={4} limit={100} />,
     );