diff --git a/apps/web/src/components/ChatView.tsx b/apps/web/src/components/ChatView.tsx
index 70880971291..4574d92b918 100644
--- a/apps/web/src/components/ChatView.tsx
+++ b/apps/web/src/components/ChatView.tsx
@@ -9645,6 +9645,23 @@ export default function ChatView(props: ChatViewProps) {
                                 ? openUsageLimits
                                 : undefined
                             }
+                            // The meter reads the selected instance's own
+                            // snapshot; the panel also merges hub-reported accounts.
+                            usageLimits={
+                              usageLimitsOffered ? activeProviderStatus?.usageLimits : undefined
+                            }
+                            usageLimitsProviderLabel={
+                              activeProviderStatus?.displayName?.trim() ||
+                              (activeProviderStatus ? String(activeProviderStatus.driver) : "")
+                            }
+                            // Unlike the slash command, the meter is a button:
+                            // it opens the panel outright, so a draft carrying
+                            // attachments or contexts is no reason to refuse.
+                            onOpenUsageLimits={
+                              usageLimitsOffered && usageLimitsKey !== null
+                                ? openUsageLimits
+                                : undefined
+                            }
                             environmentUnavailable={activeEnvironmentUnavailableState}
                             activePendingApproval={activePendingApproval}
                             pendingApprovals={pendingApprovals}
diff --git a/apps/web/src/components/chat/ChatComposer.tsx b/apps/web/src/components/chat/ChatComposer.tsx
index f7d3ac540cc..d8bd9b8021f 100644
--- a/apps/web/src/components/chat/ChatComposer.tsx
+++ b/apps/web/src/components/chat/ChatComposer.tsx
@@ -29,6 +29,7 @@ import type {
   RuntimeMode,
   ScopedThreadRef,
   ServerProvider,
+  ServerProviderUsageLimits,
   ThreadId,
   SnapShotSource,
 } from "@t3tools/contracts";
@@ -48,7 +49,7 @@ import {
 } from "@t3tools/client-runtime/text-paste";
 import { serializeComposerFileLink } from "@t3tools/shared/composerTrigger";
 import { createModelSelection, normalizeModelSlug } from "@t3tools/shared/model";
-import { USAGE_LIMITS_COMMAND } from "@t3tools/shared/usageLimits";
+import { USAGE_LIMITS_COMMAND, usageLimitsMeterWindow } from "@t3tools/shared/usageLimits";
 import {
   Fragment,
   memo,
@@ -185,6 +186,7 @@ import {
   COMPOSER_FOOTER_WIDE_ACTIONS_COMPACT_BREAKPOINT_PX,
   getRestingComposerImagePreviewCounts,
   resolveRestingComposerControlsLayout,
+  resolveRestingHiddenBlockIds,
   shouldAnimateComposerRestingTransition,
   shouldUseCompactComposerPrimaryActions,
   shouldUseCompactComposerFooter,
@@ -922,6 +924,7 @@ function ComposerCommandMenuLayer(props: { anchor: HTMLElement | null; children:
 import { Button } from "../ui/button";
 import { Select, SelectItem, SelectPopup, SelectValue } from "../ui/select";
 import { Tooltip, TooltipPopup, TooltipTrigger } from "../ui/tooltip";
+import { UsageLimitsMeter } from "./UsageLimitsMeter";
 import { toastManager } from "../ui/toast";
 import {
   FileIcon,
@@ -985,10 +988,12 @@ const extendReplacementRangeForTrailingSpace = (
   return text[rangeEnd] === " " ? rangeEnd + 1 : rangeEnd;
 };
 
-function useRestingComposerControlsLayout(host: HTMLDivElement | null) {
+function useRestingComposerControlsLayout(host: HTMLDivElement | null, menulessTrailingCount = 0) {
   const controlsRef = useRef<HTMLDivElement>(null);
   const hostRef = useRef(host);
   hostRef.current = host;
+  const menulessTrailingCountRef = useRef(menulessTrailingCount);
+  menulessTrailingCountRef.current = menulessTrailingCount;
   const [layout, setLayout] = useState({ hiddenCount: 0, visible: true });
 
   const measure = useCallback(() => {
@@ -1005,6 +1010,7 @@ function useRestingComposerControlsLayout(host: HTMLDivElement | null) {
     setLayout((current) => {
       const next = resolveRestingComposerControlsLayout({
         ...measurement,
+        menulessTrailingCount: menulessTrailingCountRef.current,
         hostWidth,
         previous: current,
       });
@@ -1310,6 +1316,11 @@ export interface ChatComposerProps {
   bannerItems: readonly ComposerBannerStackItem[];
   /** Picking /usage-limits from the menu is the action itself; the draft keeps nothing of it. */
   onUsageLimitsCommand?: (() => void) | undefined;
+  /** Subscription usage for the selected provider, for the opt-in footer meter. */
+  usageLimits?: ServerProviderUsageLimits | undefined;
+  usageLimitsProviderLabel: string;
+  /** Opens the same panel /usage-limits does; undefined when there is nothing to show. */
+  onOpenUsageLimits?: (() => void) | undefined;
   environmentUnavailable: {
     readonly label: string;
     readonly connection: EnvironmentConnectionPresentation;
@@ -2587,11 +2598,16 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps)
     isComposerOwned: true,
   } satisfies Parameters<typeof renderProviderTraitsPicker>[0];
   const providerTraitsPicker = renderProviderTraitsPicker(providerTraitsPickerInput);
+  // The block only exists when there is a reading to draw, so an unsupported
+  // provider leaves no separator hanging in the footer. It is also the one
+  // trailing block with no overflow menu entry, which the layout needs to know.
+  const showUsageLimitsMeter =
+    settings.usageLimitsMeterEnabled && usageLimitsMeterWindow(props.usageLimits) !== null;
   const {
     controlsRef: restingComposerControlsRef,
     hiddenBlockCount: restingControlsHiddenBlockCount,
     controlsVisible: restingControlsVisible,
-  } = useRestingComposerControlsLayout(restingControlsHost);
+  } = useRestingComposerControlsLayout(restingControlsHost, showUsageLimitsMeter ? 1 : 0);
   const pendingPrimaryAction = useMemo(
     () =>
       activePendingProgress
@@ -4838,10 +4854,19 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps)
 
   const restingHiddenBlockCount = composerControlsInStrip ? restingControlsHiddenBlockCount : 0;
   const composerControlsCompact = !composerControlsInStrip && isComposerFooterCompact;
+  // Which blocks the footer would render, in order. The wrapper that takes a
+  // block out of flow, the block's own `hidden` prop, and the overflow menu
+  // all read the one hidden list, so they cannot disagree.
+  const restingBlockIds = [
+    ...(providerTraitsPicker ? ["traits"] : []),
+    "mode",
+    ...(showUsageLimitsMeter ? ["usage-limits"] : []),
+  ];
+  const hiddenIds = resolveRestingHiddenBlockIds(restingBlockIds, restingHiddenBlockCount);
   const restingProviderTraitsPicker = renderProviderTraitsPicker({
     ...providerTraitsPickerInput,
     size: "xs",
-    hidden: composerControlsHidden || restingHiddenBlockCount > 1,
+    hidden: composerControlsHidden || hiddenIds.includes("traits"),
   });
   const restingBlockDefs = [
     ...(providerTraitsPicker
@@ -4865,16 +4890,36 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps)
           interactionMode={interactionMode}
           runtimeMode={runtimeMode}
           size={composerControlsInStrip ? "xs" : "sm"}
-          hidden={composerControlsHidden || restingHiddenBlockCount > 0}
+          hidden={composerControlsHidden || hiddenIds.includes("mode")}
           onToggleInteractionMode={toggleInteractionMode}
           onRuntimeModeChange={handleRuntimeModeChange}
         />
       ),
     },
+    // Trailing, so the least load-bearing control is the first into overflow.
+    // It has no menu entry there: the meter is a glance, not an action.
+    ...(showUsageLimitsMeter
+      ? [
+          {
+            id: "usage-limits",
+            content: (
+              <>
+                <ComposerControlSeparator size={composerControlsInStrip ? "xs" : "sm"} />
+                <UsageLimitsMeter
+                  limits={props.usageLimits}
+                  providerLabel={props.usageLimitsProviderLabel}
+                  size={composerControlsInStrip ? "xs" : "sm"}
+                  onOpen={props.onOpenUsageLimits}
+                />
+              </>
+            ),
+          },
+        ]
+      : []),
   ];
-  const hiddenRestingBlockIds = restingBlockDefs
-    .slice(restingBlockDefs.length - restingHiddenBlockCount)
-    .map((def) => def.id);
+  // The meter has no menu entry: it is a glance, not an action. Hiding only
+  // the meter must not raise an overflow trigger holding nothing new.
+  const overflowIds = hiddenIds.filter((id) => id !== "usage-limits");
   const composerControls = showProviderUnavailable ? (
     <Button
       type="button"
@@ -4958,11 +5003,11 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps)
         />
       ) : (
         <>
-          {restingBlockDefs.map((def, index) => {
+          {restingBlockDefs.map((def) => {
             if (!composerControlsInStrip) {
               return <Fragment key={def.id}>{def.content}</Fragment>;
             }
-            const hidden = index >= restingBlockDefs.length - restingHiddenBlockCount;
+            const hidden = hiddenIds.includes(def.id);
             return (
               <div
                 key={def.id}
@@ -4981,23 +5026,21 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps)
           {composerControlsInStrip ? (
             <div
               data-resting-controls-overflow
-              aria-hidden={hiddenRestingBlockIds.length === 0 || undefined}
-              inert={hiddenRestingBlockIds.length === 0 || undefined}
+              aria-hidden={overflowIds.length === 0 || undefined}
+              inert={overflowIds.length === 0 || undefined}
               className={cn(
                 "min-w-0 shrink-0",
-                hiddenRestingBlockIds.length === 0 && "pointer-events-none invisible absolute",
+                overflowIds.length === 0 && "pointer-events-none invisible absolute",
               )}
             >
               <CompactComposerControlsMenu
                 interactionMode={interactionMode}
                 runtimeMode={runtimeMode}
                 size="xs"
-                hidden={composerControlsHidden || hiddenRestingBlockIds.length === 0}
-                showInteractionModeToggle={
-                  planModeUiEnabled && hiddenRestingBlockIds.includes("mode")
-                }
+                hidden={composerControlsHidden || overflowIds.length === 0}
+                showInteractionModeToggle={planModeUiEnabled && overflowIds.includes("mode")}
                 traitsMenuContent={
-                  hiddenRestingBlockIds.includes("traits") ? providerTraitsMenuContent : undefined
+                  overflowIds.includes("traits") ? providerTraitsMenuContent : undefined
                 }
                 onToggleInteractionMode={toggleInteractionMode}
                 onRuntimeModeChange={handleRuntimeModeChange}
diff --git a/apps/web/src/components/chat/UsageLimitsMeter.tsx b/apps/web/src/components/chat/UsageLimitsMeter.tsx
new file mode 100644
index 00000000000..018df09c65b
--- /dev/null
+++ b/apps/web/src/components/chat/UsageLimitsMeter.tsx
@@ -0,0 +1,91 @@
+import type { ServerProviderUsageLimits } from "@t3tools/contracts";
+import {
+  formatResetsIn,
+  remainingPercent as windowRemainingPercent,
+  usageLimitsMeterWindow,
+  windowExpired,
+} from "@t3tools/shared/usageLimits";
+
+import { useNowMinute } from "~/hooks/useNowMinute";
+import { ComposerControl, type ComposerControlSize } from "./ComposerControl";
+import { Tooltip, TooltipPopup, TooltipTrigger } from "../ui/tooltip";
+
+/**
+ * How much of the selected provider's subscription is left, in the width of a
+ * word. Opt-in, and a shortcut into the existing `/usage-limits` panel rather
+ * than a surface of its own: the meter answers "can I keep going", the panel
+ * answers everything else.
+ *
+ * A reading whose window has already rolled over shows as unknown. The quota
+ * it reports belongs to a window that no longer exists, so drawing it as a
+ * full bar would promise headroom nobody has measured.
+ */
+export function UsageLimitsMeter(props: {
+  limits: ServerProviderUsageLimits | undefined;
+  providerLabel: string;
+  size: ComposerControlSize;
+  onOpen: (() => void) | undefined;
+}) {
+  const { limits, providerLabel, size, onOpen } = props;
+  // The app's shared minute clock, not a timer of our own: the countdown and
+  // the rollover into "expired" stay honest, and the meter repaints at most
+  // once a minute instead of continuously.
+  const now = Date.parse(`${useNowMinute()}:00.000Z`);
+  const window = usageLimitsMeterWindow(limits);
+  if (!window) return null;
+
+  const remainingPercent = windowRemainingPercent(window);
+  const stale = windowExpired(window, now);
+  const fillColor =
+    remainingPercent <= 5
+      ? "var(--color-error)"
+      : remainingPercent <= 20
+        ? "var(--color-warning)"
+        : "color-mix(in oklab, var(--color-muted-foreground) 72%, transparent)";
+  const resets = stale ? null : formatResetsIn(window, now);
+  const label = stale
+    ? `Usage limits: ${window.label} reading expired`
+    : `Usage limits: ${remainingPercent}% of ${window.label} left`;
+
+  return (
+    <Tooltip>
+      <TooltipTrigger
+        render={
+          <ComposerControl
+            size={size}
+            type="button"
+            aria-label={label}
+            className="shrink-0 gap-1.5 whitespace-nowrap"
+            aria-disabled={onOpen === undefined || undefined}
+            // Footer controls never take the caret from the editor.
+            onPointerDown={(event) => event.preventDefault()}
+            onClick={onOpen}
+          />
+        }
+      >
+        <span
+          className="h-1 w-14 shrink-0 overflow-hidden rounded-full bg-[color-mix(in_oklab,var(--color-muted-foreground)_24%,transparent)]"
+          role="progressbar"
+          aria-valuemin={0}
+          aria-valuemax={100}
+          {...(stale ? {} : { "aria-valuenow": remainingPercent })}
+        >
+          {stale ? null : (
+            <span
+              className="block h-full rounded-full"
+              style={{ width: `${remainingPercent}%`, backgroundColor: fillColor }}
+            />
+          )}
+        </span>
+        <span aria-hidden="true" className="tabular-nums">
+          {stale ? "—" : `${remainingPercent}%`}
+        </span>
+      </TooltipTrigger>
+      <TooltipPopup side="top">
+        {stale
+          ? `${providerLabel} · ${window.label}: reading expired, send a message to refresh`
+          : `${providerLabel} · ${window.label}: ${remainingPercent}% left${resets ? ` · ${resets}` : ""}`}
+      </TooltipPopup>
+    </Tooltip>
+  );
+}
diff --git a/apps/web/src/components/composerFooterLayout.test.ts b/apps/web/src/components/composerFooterLayout.test.ts
index 5c0e4327d95..f8086ec286b 100644
--- a/apps/web/src/components/composerFooterLayout.test.ts
+++ b/apps/web/src/components/composerFooterLayout.test.ts
@@ -10,6 +10,7 @@ import {
   resolveScrollToEndClearance,
   resolveRestingComposerControlsLayout,
   resolveRestingComposerControlsNaturalWidth,
+  resolveRestingHiddenBlockIds,
   shouldAnimateComposerRestingTransition,
   shouldUseCompactComposerPrimaryActions,
   shouldUseCompactComposerFooter,
@@ -210,6 +211,22 @@ describe("resolveRestingComposerControlsLayout", () => {
     });
   });
 
+  it("reserves no trigger width when only menuless trailing blocks hide", () => {
+    // Hiding the one menuless block shows no trigger: 149 + 60 + 4 = 213,
+    // where reserving the trigger would have needed 149 + 60 + 24 + 4 * 2 = 241.
+    expect(
+      resolveRestingComposerControlsLayout({
+        ...base,
+        menulessTrailingCount: 1,
+        hostWidth: 240,
+      }),
+    ).toEqual({ hiddenCount: 1, visible: true });
+    expect(resolveRestingComposerControlsLayout({ ...base, hostWidth: 240 })).toEqual({
+      hiddenCount: 2,
+      visible: true,
+    });
+  });
+
   it("shrinks the picker after moving every trailing block into overflow", () => {
     expect(resolveRestingComposerControlsLayout({ ...base, hostWidth: 176 })).toEqual({
       hiddenCount: 2,
@@ -449,3 +466,124 @@ describe("resolveScrollToEndClearance", () => {
     }
   });
 });
+
+describe("resolveRestingComposerControlsLayout invariants", () => {
+  const GAP = 4;
+  const OVERFLOW = 24;
+  // Trailing blocks are added from the left, so a 3-block case is the
+  // traits/mode/meter footer and a 1-block case is mode alone.
+  const ALL_BLOCK_WIDTHS = [60, 140, 78];
+  // The meter is deliberately narrower than the overflow trigger it would
+  // otherwise raise, which is the case menulessTrailingCount exists for.
+  const cases = ALL_BLOCK_WIDTHS.map((_, index) => ALL_BLOCK_WIDTHS.slice(0, index + 1));
+
+  const measurement = (blockWidths: readonly number[], menulessTrailingCount: number) => ({
+    gap: GAP,
+    naturalFixedWidth: 149,
+    minimumFixedWidth: 105,
+    blockWidths,
+    overflowWidth: OVERFLOW,
+    menulessTrailingCount,
+  });
+
+  /** The width rule restated, so the assertions never chase the implementation. */
+  const widthAt = (
+    input: ReturnType<typeof measurement>,
+    hiddenCount: number,
+    options?: { withOverflow?: boolean },
+  ) => {
+    const visibleCount = input.blockWidths.length - hiddenCount;
+    const showsOverflow = options?.withOverflow ?? hiddenCount > input.menulessTrailingCount;
+    return (
+      input.naturalFixedWidth +
+      input.blockWidths.slice(0, visibleCount).reduce((sum, width) => sum + width, 0) +
+      (showsOverflow ? OVERFLOW : 0) +
+      GAP * (visibleCount + (showsOverflow ? 1 : 0))
+    );
+  };
+
+  for (const blockWidths of cases) {
+    for (const menulessTrailingCount of [0, 1]) {
+      const input = measurement(blockWidths, menulessTrailingCount);
+      const label = `${blockWidths.length} blocks, ${menulessTrailingCount} menuless`;
+
+      it(`keeps the overflow decision sound across widths (${label})`, () => {
+        const everythingFits = widthAt(input, 0);
+        let previousHiddenCount = blockWidths.length;
+        for (let hostWidth = 0; hostWidth <= everythingFits + 8; hostWidth += 3) {
+          const { hiddenCount } = resolveRestingComposerControlsLayout({ ...input, hostWidth });
+          // (d) and (a): never more blocks than exist, and growing the host
+          // never moves a block back into the overflow menu.
+          expect(hiddenCount).toBeLessThanOrEqual(blockWidths.length);
+          expect(hiddenCount).toBeLessThanOrEqual(previousHiddenCount);
+          previousHiddenCount = hiddenCount;
+          // (b): a partial hide has to actually fit.
+          if (hiddenCount < blockWidths.length) {
+            expect(widthAt(input, hiddenCount)).toBeLessThanOrEqual(hostWidth);
+          }
+          // (c): hiding only the menuless trailing block raises no trigger, so
+          // its width must not have been reserved.
+          if (
+            menulessTrailingCount === 1 &&
+            hiddenCount === 1 &&
+            hiddenCount < blockWidths.length
+          ) {
+            expect(widthAt(input, 1, { withOverflow: false })).toBeLessThanOrEqual(hostWidth);
+          }
+        }
+        expect(
+          resolveRestingComposerControlsLayout({ ...input, hostWidth: everythingFits }),
+        ).toEqual({ hiddenCount: 0, visible: true });
+      });
+
+      it(`hides no more than a menuless run would need (${label})`, () => {
+        // (c) again, from the other side: not reserving the trigger can only
+        // ever keep more blocks on screen.
+        for (let hostWidth = 0; hostWidth <= widthAt(input, 0) + 8; hostWidth += 3) {
+          const menuless = resolveRestingComposerControlsLayout({ ...input, hostWidth });
+          const withMenus = resolveRestingComposerControlsLayout({
+            ...input,
+            menulessTrailingCount: 0,
+            hostWidth,
+          });
+          expect(menuless.hiddenCount).toBeLessThanOrEqual(withMenus.hiddenCount);
+        }
+      });
+    }
+  }
+
+  it("survives a menuless count larger than the block list, and no blocks at all", () => {
+    // (e): the meter can leave between the measurement and the next render,
+    // and the provider-unavailable footer has no blocks to hide at all.
+    for (const blockWidths of [[], [60], [60, 140]]) {
+      for (const menulessTrailingCount of [1, 3, 9]) {
+        for (const hostWidth of [0, 120, 200, 400]) {
+          const layout = resolveRestingComposerControlsLayout({
+            ...measurement(blockWidths, menulessTrailingCount),
+            hostWidth,
+            previous: { hiddenCount: 5, visible: true },
+          });
+          expect(layout.hiddenCount).toBeGreaterThanOrEqual(0);
+          expect(layout.hiddenCount).toBeLessThanOrEqual(blockWidths.length);
+        }
+      }
+    }
+  });
+});
+
+describe("resolveRestingHiddenBlockIds", () => {
+  const blocks = ["traits", "mode", "usage-limits"] as const;
+
+  it("hides the trailing blocks the count covers", () => {
+    expect(resolveRestingHiddenBlockIds(blocks, 0)).toEqual([]);
+    expect(resolveRestingHiddenBlockIds(blocks, 1)).toEqual(["usage-limits"]);
+    expect(resolveRestingHiddenBlockIds(blocks, 3)).toEqual(["traits", "mode", "usage-limits"]);
+  });
+
+  it("clamps a count left over from a longer measurement", () => {
+    // The meter left between the measurement and this render.
+    expect(resolveRestingHiddenBlockIds(["traits", "mode"], 3)).toEqual(["traits", "mode"]);
+    expect(resolveRestingHiddenBlockIds([], 2)).toEqual([]);
+    expect(resolveRestingHiddenBlockIds(blocks, -1)).toEqual([]);
+  });
+});
diff --git a/apps/web/src/components/composerFooterLayout.ts b/apps/web/src/components/composerFooterLayout.ts
index 42f466c2ae9..6067bc6d40a 100644
--- a/apps/web/src/components/composerFooterLayout.ts
+++ b/apps/web/src/components/composerFooterLayout.ts
@@ -113,6 +113,8 @@ export interface RestingComposerControlsMeasurement {
   minimumFixedWidth: number;
   blockWidths: readonly number[];
   overflowWidth: number;
+  /** Trailing blocks that have no overflow menu entry, so hiding only them shows no trigger. */
+  menulessTrailingCount?: number;
 }
 
 function restingComposerControlsWidth(
@@ -122,11 +124,12 @@ function restingComposerControlsWidth(
 ): number {
   const { blockWidths, gap } = input;
   const visibleCount = blockWidths.length - hiddenCount;
+  const showsOverflow = hiddenCount > (input.menulessTrailingCount ?? 0);
   return (
     fixedWidth +
     blockWidths.slice(0, visibleCount).reduce((sum, width) => sum + width, 0) +
-    (hiddenCount > 0 ? input.overflowWidth : 0) +
-    gap * (visibleCount + (hiddenCount > 0 ? 1 : 0))
+    (showsOverflow ? input.overflowWidth : 0) +
+    gap * (visibleCount + (showsOverflow ? 1 : 0))
   );
 }
 
@@ -192,6 +195,23 @@ export function resolveRestingComposerControlsLayout(
   return { hiddenCount, visible };
 }
 
+/**
+ * The trailing block ids a hidden-block count covers.
+ *
+ * The count comes from the last measurement, so the list can be shorter by
+ * the time it is applied: the opt-in usage meter leaves when its setting is
+ * toggled off or its reading ages out. Without the clamp the slice would
+ * count back from the end and hide the wrong blocks until the layout effect
+ * re-measures.
+ */
+export function resolveRestingHiddenBlockIds<Id extends string>(
+  blockIds: readonly Id[],
+  hiddenCount: number,
+): Id[] {
+  const clamped = Math.min(Math.max(hiddenCount, 0), blockIds.length);
+  return blockIds.slice(blockIds.length - clamped);
+}
+
 export function resolveScrollToEndClearance(input: {
   overlayHeight: number;
   mainSurfaceTop: number;
diff --git a/apps/web/src/components/settings/SettingsPanels.tsx b/apps/web/src/components/settings/SettingsPanels.tsx
index 5238cf19e19..8b98b564f2a 100644
--- a/apps/web/src/components/settings/SettingsPanels.tsx
+++ b/apps/web/src/components/settings/SettingsPanels.tsx
@@ -584,6 +584,9 @@ export function useSettingsRestore(onRestored?: () => void) {
       ...(settings.contextWindowMeterEnabled !== DEFAULT_UNIFIED_SETTINGS.contextWindowMeterEnabled
         ? ["Context window indicator"]
         : []),
+      ...(settings.usageLimitsMeterEnabled !== DEFAULT_UNIFIED_SETTINGS.usageLimitsMeterEnabled
+        ? ["Usage limits meter"]
+        : []),
       ...(settings.responseStreamingMode !== DEFAULT_UNIFIED_SETTINGS.responseStreamingMode
         ? ["Response streaming"]
         : []),
@@ -649,6 +652,7 @@ export function useSettingsRestore(onRestored?: () => void) {
       settings.proactivePanelsEnabled,
       settings.environmentIdentificationMode,
       settings.contextWindowMeterEnabled,
+      settings.usageLimitsMeterEnabled,
       settings.fontFamilyCode,
       settings.fontFamilyComposer,
       settings.fontFamilySans,
@@ -754,6 +758,7 @@ export function useSettingsRestore(onRestored?: () => void) {
       composerCollapseOnScroll: DEFAULT_UNIFIED_SETTINGS.composerCollapseOnScroll,
       followUpBehavior: DEFAULT_UNIFIED_SETTINGS.followUpBehavior,
       contextWindowMeterEnabled: DEFAULT_UNIFIED_SETTINGS.contextWindowMeterEnabled,
+      usageLimitsMeterEnabled: DEFAULT_UNIFIED_SETTINGS.usageLimitsMeterEnabled,
       environmentIdentificationMode: DEFAULT_UNIFIED_SETTINGS.environmentIdentificationMode,
       glassOpacity: DEFAULT_UNIFIED_SETTINGS.glassOpacity,
       panelAnimationDurationMs: DEFAULT_UNIFIED_SETTINGS.panelAnimationDurationMs,
@@ -2567,6 +2572,33 @@ export function GeneralSettingsPanel() {
           }
         />
 
+        <SettingsRow
+          {...searchableSetting("usage-limits-meter")}
+          description="Show how much of the selected provider's subscription quota is left in the composer. Click it for the full breakdown."
+          resetAction={
+            settings.usageLimitsMeterEnabled !==
+            DEFAULT_UNIFIED_SETTINGS.usageLimitsMeterEnabled ? (
+              <SettingResetButton
+                label="usage limits meter"
+                onClick={() =>
+                  updateSettings({
+                    usageLimitsMeterEnabled: DEFAULT_UNIFIED_SETTINGS.usageLimitsMeterEnabled,
+                  })
+                }
+              />
+            ) : null
+          }
+          control={
+            <Switch
+              checked={settings.usageLimitsMeterEnabled}
+              onCheckedChange={(checked) =>
+                updateSettings({ usageLimitsMeterEnabled: Boolean(checked) })
+              }
+              aria-label="Usage limits meter"
+            />
+          }
+        />
+
         <SettingsRow
           {...searchableSetting("composer-collapse")}
           description="Rest the composer of an existing thread into a single line when you scroll the conversation. Focus the composer or start typing to expand it again."
diff --git a/apps/web/src/components/settings/settingsSearch.ts b/apps/web/src/components/settings/settingsSearch.ts
index 7e999417f2a..ea868590ac9 100644
--- a/apps/web/src/components/settings/settingsSearch.ts
+++ b/apps/web/src/components/settings/settingsSearch.ts
@@ -292,6 +292,12 @@ export const SETTINGS_SEARCH_ITEMS = [
     to: "/settings/general",
     searchTerms: ["command menu dollar $ slash /"],
   },
+  {
+    id: "usage-limits-meter",
+    title: "Usage limits meter",
+    to: "/settings/general",
+    searchTerms: ["composer quota subscription remaining rate limit weekly session percent"],
+  },
   {
     id: "composer-collapse",
     title: "Collapse composer on scroll",
diff --git a/docs/user/usage.md b/docs/user/usage.md
index dbef802509b..209a06729a4 100644
--- a/docs/user/usage.md
+++ b/docs/user/usage.md
@@ -69,6 +69,9 @@ current model's limits without leaving the conversation. The result opens above
 closes when you dismiss it or send your next message. It uses the same snapshot as **Usage → Limits**, so it does not run the agent or refresh
 anything. The command is offered only for providers that appear under **Usage → Limits**.
 
+Turn on **Settings → General → Usage limits meter** to keep a small quota meter in the composer;
+clicking it opens the same panel.
+
 API-key accounts may not report subscription limits. This also applies to Claude connections
 using a proxy through `ANTHROPIC_AUTH_TOKEN`.
 
diff --git a/packages/contracts/src/settings.test.ts b/packages/contracts/src/settings.test.ts
index ba612edaf26..970a2c2df52 100644
--- a/packages/contracts/src/settings.test.ts
+++ b/packages/contracts/src/settings.test.ts
@@ -542,6 +542,18 @@ describe("ClientSettings follow-up behavior", () => {
   });
 });
 
+describe("ClientSettings usage limits meter", () => {
+  it("defaults off and accepts opting in", () => {
+    expect(decodeClientSettings({}).usageLimitsMeterEnabled).toBe(false);
+    expect(decodeClientSettings({ usageLimitsMeterEnabled: true }).usageLimitsMeterEnabled).toBe(
+      true,
+    );
+    expect(
+      decodeClientSettingsPatch({ usageLimitsMeterEnabled: true }).usageLimitsMeterEnabled,
+    ).toBe(true);
+  });
+});
+
 describe("ClientSettings composer collapse", () => {
   it("collapses on scroll by default and accepts opting out", () => {
     expect(decodeClientSettings({}).composerCollapseOnScroll).toBe(true);
diff --git a/packages/contracts/src/settings.ts b/packages/contracts/src/settings.ts
index 1c53b36037b..5a484380dee 100644
--- a/packages/contracts/src/settings.ts
+++ b/packages/contracts/src/settings.ts
@@ -427,6 +427,9 @@ export const ClientSettingsSchema = Schema.Struct({
   // Legacy context window meter. The composer hides it by default; users who
   // still want the old usage indicator can restore it from Settings.
   contextWindowMeterEnabled: Schema.Boolean.pipe(Schema.withDecodingDefault(Effect.succeed(false))),
+  // Opt-in composer meter for the selected provider's subscription quota.
+  // Off by default: most users never think about limits until they hit one.
+  usageLimitsMeterEnabled: Schema.Boolean.pipe(Schema.withDecodingDefault(Effect.succeed(false))),
   // Desktop resting composer: scrolling an existing thread's conversation
   // settles the composer into its single-line layout. Losing focus never does.
   composerCollapseOnScroll: Schema.Boolean.pipe(Schema.withDecodingDefault(Effect.succeed(true))),
@@ -1501,6 +1504,7 @@ export const ClientSettingsPatch = Schema.Struct({
   ),
   planModeEnabled: Schema.optionalKey(Schema.Boolean),
   contextWindowMeterEnabled: Schema.optionalKey(Schema.Boolean),
+  usageLimitsMeterEnabled: Schema.optionalKey(Schema.Boolean),
   composerCollapseOnScroll: Schema.optionalKey(Schema.Boolean),
   followUpBehavior: Schema.optionalKey(Schema.Literals(["queue", "steer"])),
   proactivePanelsEnabled: Schema.optionalKey(Schema.Boolean),
diff --git a/packages/shared/src/usageLimits.test.ts b/packages/shared/src/usageLimits.test.ts
index 0ef53b1e7f5..6ba07bd3b81 100644
--- a/packages/shared/src/usageLimits.test.ts
+++ b/packages/shared/src/usageLimits.test.ts
@@ -22,6 +22,8 @@ import {
   paceOf,
   providersWithLimits,
   remainingPercent,
+  usageLimitsMeterWindow,
+  windowExpired,
 } from "./usageLimits.ts";
 
 const now = Date.parse("2026-09-03T12:00:00.000Z");
@@ -1008,3 +1010,92 @@ describe("isUsageLimitsCommand", () => {
     expect(isUsageLimitsCommand("/usage")).toBe(false);
   });
 });
+
+describe("usageLimitsMeterWindow", () => {
+  const limits = (windows: ReadonlyArray<Record<string, unknown>>) => ({
+    checkedAt: "2026-09-03T11:00:00.000Z",
+    windows: windows as never,
+  });
+
+  it("has nothing to show without a usable reading", () => {
+    expect(usageLimitsMeterWindow(undefined)).toBeNull();
+    expect(usageLimitsMeterWindow(limits([]))).toBeNull();
+    expect(usageLimitsMeterWindow(limits([window]))).not.toBeNull();
+    expect(
+      usageLimitsMeterWindow({ ...limits([window]), unavailable: { reason: "unsupported" } }),
+    ).toBeNull();
+    expect(
+      usageLimitsMeterWindow({ ...limits([window]), unavailable: { reason: "probeFailed" } }),
+    ).toBeNull();
+  });
+
+  it("prefers the session window even when another has less left", () => {
+    const chosen = usageLimitsMeterWindow(
+      limits([
+        { ...window, id: "weekly", kind: "weekly", label: "Weekly", usedPercent: 90 },
+        { ...window, usedPercent: 40 },
+      ]),
+    );
+
+    expect(chosen?.kind).toBe("session");
+    expect(chosen ? remainingPercent(chosen) : null).toBe(60);
+  });
+
+  it("falls back to the window with the least left, ties to the shorter", () => {
+    expect(
+      usageLimitsMeterWindow(
+        limits([
+          { ...window, id: "monthly", kind: "monthly", label: "Monthly", usedPercent: 20 },
+          { ...window, id: "weekly", kind: "weekly", label: "Weekly", usedPercent: 90 },
+        ]),
+      )?.id,
+    ).toBe("weekly");
+    expect(
+      usageLimitsMeterWindow(
+        limits([
+          { ...window, id: "monthly", kind: "monthly", label: "Monthly" },
+          { ...window, id: "weekly", kind: "weekly", label: "Weekly" },
+        ]),
+      )?.kind,
+    ).toBe("weekly");
+  });
+
+  it("breaks a tie on reported duration before window kind", () => {
+    expect(
+      usageLimitsMeterWindow(
+        limits([
+          { ...window, id: "weekly", kind: "weekly", label: "Weekly", windowDurationMins: 10080 },
+          { ...window, id: "hourly", kind: "other", label: "Hourly", windowDurationMins: 60 },
+        ]),
+      )?.id,
+    ).toBe("hourly");
+    expect(
+      usageLimitsMeterWindow(
+        limits([
+          { ...window, id: "other", kind: "other", label: "Other", windowDurationMins: undefined },
+          {
+            ...window,
+            id: "weekly",
+            kind: "weekly",
+            label: "Weekly",
+            windowDurationMins: undefined,
+          },
+        ]),
+      )?.kind,
+    ).toBe("weekly");
+  });
+});
+
+describe("windowExpired", () => {
+  it("expires a window at and after its reset, not before", () => {
+    expect(windowExpired(window, now)).toBe(false);
+    expect(windowExpired(window, Date.parse(window.resetsAt))).toBe(true);
+    expect(windowExpired(window, now + 5 * 60 * 60_000)).toBe(true);
+  });
+
+  it("never expires a window that reports no reset", () => {
+    expect(windowExpired({ ...window, resetsAt: undefined }, now + 365 * 24 * 60 * 60_000)).toBe(
+      false,
+    );
+  });
+});
diff --git a/packages/shared/src/usageLimits.ts b/packages/shared/src/usageLimits.ts
index 17ba1feab5d..e75c327b9cf 100644
--- a/packages/shared/src/usageLimits.ts
+++ b/packages/shared/src/usageLimits.ts
@@ -407,6 +407,50 @@ export function remainingPercent(window: ServerProviderUsageWindow): number {
   return Math.round(100 - Math.max(0, Math.min(100, window.usedPercent)));
 }
 
+/**
+ * The one window a compact meter shows, or null when there is nothing to draw.
+ * The session window wins when the provider reports one: it is the number
+ * Claude Code and Codex put in their own status lines, and the one that moves
+ * while you work. Providers without a session window fall back to whichever
+ * window has the least left. Ties go to the shorter window by reported
+ * duration, and to the shorter kind when a duration is missing. The choice
+ * never depends on the clock, so deciding whether to mount the meter does not
+ * need one.
+ */
+export function usageLimitsMeterWindow(
+  limits: ServerProviderUsageLimits | undefined,
+): ServerProviderUsageWindow | null {
+  if (!limits || limitsNotice(limits) !== null) return null;
+  return (
+    limits.windows.find((window) => window.kind === "session") ??
+    [...limits.windows].sort(
+      (left, right) =>
+        remainingPercent(left) - remainingPercent(right) || byWindowLength(left, right),
+    )[0] ??
+    null
+  );
+}
+
+/** Shorter window first: by reported duration when both report one, else by kind. */
+function byWindowLength(left: ServerProviderUsageWindow, right: ServerProviderUsageWindow): number {
+  const leftMins = left.windowDurationMins;
+  const rightMins = right.windowDurationMins;
+  if (leftMins !== undefined && rightMins !== undefined && leftMins !== rightMins) {
+    return leftMins - rightMins;
+  }
+  return WINDOW_KIND_ORDER[left.kind] - WINDOW_KIND_ORDER[right.kind];
+}
+
+/**
+ * Whether a reading can still be trusted. A window that has rolled over since
+ * it was read must render as unknown, never as its number: the quota it
+ * reports belongs to a window that no longer exists.
+ */
+export function windowExpired(window: ServerProviderUsageWindow, now: number): boolean {
+  const resetsAt = resetMillis(window);
+  return resetsAt !== null && resetsAt <= now;
+}
+
 function resetMillis(window: ServerProviderUsageWindow): number | null {
   if (window.resetsAt === undefined) return null;
   const at = Date.parse(window.resetsAt);