quotacap 0.0.45 → 0.0.47

package/dist/adapters/kimi.d.ts

@@ -35,6 +35,13 @@ export declare function refreshKimiOAuthToken(oauthHost: string, refreshToken: s
     refresh_token?: string;
     expires_in?: number;
 }>;
+/** The Kimi account has no active subscription (observed: cancelled plan
+ * answers /usages 200 with `{}`, /me `user_level_name` "Free", and the TUI
+ * shows "No usage data available"). The TUI reports the same state, so the
+ * PTY fallback is skipped: report it, do not mask it with a timeout. */
+export declare class KimiSubscriptionInactiveError extends Error {
+    constructor(detail: string);
+}
 /** A refresh rotated the tokens but the result could not be saved for the Kimi CLI. */
 export declare class KimiCredentialWriteError extends Error {
     constructor(credPath: string, cause: unknown);

package/dist/adapters/kimi.js

@@ -153,6 +153,14 @@ function parseKimiApiMonthly(u, legacyUsages) {
     }
     return {};
 }
+function isEmptyUsageBody(u) {
+    const usage = u.usage;
+    const hasUsage = !!usage && typeof usage === "object" && Object.keys(usage).length > 0;
+    const hasLimits = Array.isArray(u.limits) && u.limits.length > 0;
+    const usages = u.usages;
+    const hasUsages = !!usages && typeof usages === "object" && Object.keys(usages).length > 0;
+    return !hasUsage && !hasLimits && !hasUsages;
+}
 export function parseKimiApiUsage(usagesBody, meBody, now = new Date()) {
     if (typeof usagesBody !== "object" || usagesBody === null) {
         throw new Error("kimi: invalid api response");
@@ -212,6 +220,21 @@ export function parseKimiApiUsage(usagesBody, meBody, now = new Date()) {
             }
         }
     }
+    // 3. Plan identity (from meBody), before the field throws: an empty
+    // usage body on a free plan is a dead subscription, not a parse failure.
+    let plan = "unknown";
+    if (meBody && typeof meBody === "object") {
+        const me = meBody;
+        if (typeof me.user_level_name === "string" && me.user_level_name.trim().length > 0) {
+            plan = me.user_level_name.trim().toLowerCase();
+        }
+    }
+    if (weeklyPct === null && sessionPct === null && !resetsAt && isEmptyUsageBody(u) && plan === "free") {
+        throw new KimiSubscriptionInactiveError("plan free, empty usage response");
+    }
+    // Any other shape without data stays a parse error: an empty body on a
+    // paid or unknown plan falls through to the PTY path, whose transcript
+    // decides (usage panel vs "No usage data available").
     if (weeklyPct === null || weeklyPct < 0 || weeklyPct > 100) {
         throw new Error("kimi: weekly pct not found in api response");
     }
@@ -221,14 +244,6 @@ export function parseKimiApiUsage(usagesBody, meBody, now = new Date()) {
     if (!resetsAt || Number.isNaN(new Date(resetsAt).getTime())) {
         throw new Error("kimi: weekly reset not found in api response");
     }
-    // 3. Plan identity (from meBody)
-    let plan = "unknown";
-    if (meBody && typeof meBody === "object") {
-        const me = meBody;
-        if (typeof me.user_level_name === "string" && me.user_level_name.trim().length > 0) {
-            plan = me.user_level_name.trim().toLowerCase();
-        }
-    }
     // 4. Optional monthly quota (from limit_month_total, limits, or subscriptionBalance)
     const monthly = parseKimiApiMonthly(u, legacyUsages);
     const periodStart = new Date(new Date(resetsAt).getTime() - 7 * 86400000).toISOString();
@@ -377,6 +392,16 @@ export async function refreshKimiOAuthToken(oauthHost, refreshToken, deviceId, s
         expires_in: typeof data.expires_in === "number" ? data.expires_in : undefined,
     };
 }
+/** The Kimi account has no active subscription (observed: cancelled plan
+ * answers /usages 200 with `{}`, /me `user_level_name` "Free", and the TUI
+ * shows "No usage data available"). The TUI reports the same state, so the
+ * PTY fallback is skipped: report it, do not mask it with a timeout. */
+export class KimiSubscriptionInactiveError extends Error {
+    constructor(detail) {
+        super(`kimi: subscription inactive (${detail})`);
+        this.name = "KimiSubscriptionInactiveError";
+    }
+}
 /** A refresh rotated the tokens but the result could not be saved for the Kimi CLI. */
 export class KimiCredentialWriteError extends Error {
     constructor(credPath, cause) {
@@ -463,6 +488,11 @@ export async function pollKimiApi(ctx) {
         headers.Authorization = `Bearer ${freshToken}`;
         usagesRes = await fetch(usagesUrl, { headers, signal });
     }
+    // 402/403 on an authenticated /usages call is an entitlement state, not
+    // a transport failure: the account has no active subscription.
+    if (usagesRes.status === 402 || usagesRes.status === 403) {
+        throw new KimiSubscriptionInactiveError(`HTTP ${usagesRes.status}`);
+    }
     if (!usagesRes.ok) {
         throw new Error(`kimi: usage request failed (HTTP ${usagesRes.status})`);
     }
@@ -520,9 +550,13 @@ export const kimiAdapter = {
                 return await pollKimiApi(authCtx);
             }
             catch (e) {
-                // A lost rotated token leaves the CLI logged out: report it, do not mask it with the PTY path.
+                // A lost rotated token leaves the CLI logged out, and a dead
+                // subscription reads the same in the TUI: report either, do not
+                // mask them with the PTY path.
                 if (e instanceof KimiCredentialWriteError)
                     throw e;
+                if (e instanceof KimiSubscriptionInactiveError)
+                    throw e;
             }
         }
         return pollKimiPty();

package/dist/advisory/snapshot.js

@@ -97,7 +97,10 @@ export function buildSnapshot(db, opts) {
                 providerFailed = true;
             }
         }
-        // Precedence: invalid, reset-passed, provider-failed, stale, not-reporting
+        // Precedence: invalid, provider-failed, reset-passed, stale, not-reporting.
+        // A fresh failure outranks a passed reset: "poll again to capture the new
+        // window" is only actionable when polls succeed, and would otherwise mask
+        // the real state (e.g. an inactive subscription) behind a re-poll prompt.
         let exclusionReason = null;
         if (quota === null) {
             exclusionReason = "not-reporting";
@@ -105,12 +108,12 @@ export function buildSnapshot(db, opts) {
         else if (isInvalid) {
             exclusionReason = "invalid";
         }
-        else if (resetPassed) {
-            exclusionReason = "reset-passed";
-        }
         else if (providerFailed) {
             exclusionReason = "provider-failed";
         }
+        else if (resetPassed) {
+            exclusionReason = "reset-passed";
+        }
         else if (stale) {
             exclusionReason = "stale";
         }

package/dist/diagnostics/failure.js

@@ -86,6 +86,15 @@ const UNRECOGNIZED_OMITTED = "Unrecognized diagnostic text omitted";
 // "account is not eligible" is the Antigravity sentence; a bare "not eligible" is not.
 // The hyphen covers "Sign-in with". "signed in with" does not match.
 const ACCOUNT_CONFIRMATION = /\b(?:account is not eligible|verify your account|eligibility check failed|device code|sign(?:ing)?[ -]in with)\b/i;
+// Cancelled- or missing-subscription wording. The QuotaCap-authored phrase
+// ("subscription inactive", thrown by adapters that detect it directly) plus
+// Kimi's own sentences for the same state: the /usage panel shows "No usage
+// data available" and prompting fails with "[provider.auth_error] 403 ...
+// does not have access to Kimi Code ... Upgrade your plan". Bare "does not
+// have access" is not enough: it must name Kimi Code, so file-permission
+// errors never match. A bare "Upgrade your plan" is not enough either: it
+// can be upsell banner text on an otherwise healthy screen.
+const SUBSCRIPTION_INACTIVE = /\bsubscription inactive\b|\bno usage data available\b|\bprovider\.auth_error\b|\bdoes not have access to Kimi Code\b/i;
 function matchPrecedence(evidence, errorName, errorCode, text) {
     // Order 1: timeout — Structured AbortError or an explicit QuotaCap abort/timeout checkpoint.
     // A ready or completion timeout whose transcript is an account-confirmation
@@ -93,7 +102,13 @@ function matchPrecedence(evidence, errorName, errorCode, text) {
     // abort stays a timeout even if that screen is in the transcript.
     const signInTimeout = ACCOUNT_CONFIRMATION.test(text) &&
         (evidence?.checkpoint === "ready timeout" || evidence?.checkpoint === "completion timeout");
+    // Same fall-through for a dead subscription: a completion timeout whose
+    // stable transcript is the empty usage panel reports the subscription
+    // state, not the timeout that a missing completion pattern caused.
+    const inactiveTimeout = SUBSCRIPTION_INACTIVE.test(text) &&
+        (evidence?.checkpoint === "ready timeout" || evidence?.checkpoint === "completion timeout");
     const isAbort = !signInTimeout &&
+        !inactiveTimeout &&
         (errorName === "AbortError" ||
             errorCode === "ABORT_ERR" ||
             evidence?.checkpoint === "abort" ||
@@ -158,6 +173,12 @@ function matchPrecedence(evidence, errorName, errorCode, text) {
     }
     // Order 6: auth — login required, not logged in, logged out, unauthorized, unauthorised, forbidden,
     // run <provider> login to continue, or error indicating missing, invalid, or expired credentials, authentication, or API key
+    // A dead subscription sorts as auth (the 403 is an authorization state),
+    // first in this order so its summary wins over login wording: the user is
+    // logged in, and "login required" would mislead.
+    if (SUBSCRIPTION_INACTIVE.test(text)) {
+        return { code: "auth", phrase: "subscription inactive" };
+    }
     if (/\brun\s+[a-z0-9_:-]+\s+login\s+to\s+continue\b/i.test(text)) {
         return { code: "auth", phrase: "run <provider> login to continue" };
     }
@@ -424,7 +445,8 @@ export function diagnosticError(reason, evidence) {
             const matchedLines = lines.filter((l) => /\b(error|failed|failure|fatal|unauthorized|unauthorised|denied|forbidden|panic|exception)\b/i.test(l) ||
                 /\btrust\b/i.test(l) ||
                 /\b(stdin is not a terminal|device not configured|not a tty|inappropriate ioctl|node-pty)\b/i.test(l) ||
-                ACCOUNT_CONFIRMATION.test(l));
+                ACCOUNT_CONFIRMATION.test(l) ||
+                SUBSCRIPTION_INACTIVE.test(l));
             safeStdoutText = matchedLines.join(" ");
         }
         else {
@@ -497,6 +519,12 @@ function getSummaryAndAction(code, providerName, provider, errorDetail) {
                 action: `Open ${providerName} directly in your terminal to check whether it starts. If it works there, inspect the QuotaCap service log and report the adapter failure. Refresh in the dashboard retries through the same service.`,
             };
         case "auth":
+            if (/\bsubscription inactive\b/i.test(errorDetail)) {
+                return {
+                    summary: `${providerName} subscription inactive`,
+                    action: `Open ${providerName} to manage your subscription, or run \`quotacap providers disable ${provider}\` to stop polling it. Then select Refresh in the QuotaCap dashboard.`,
+                };
+            }
             if (/\baccount confirmation required\b/i.test(errorDetail)) {
                 return {
                     summary: `${providerName} needs you to confirm the subscription account`,

package/dist/version.js

@@ -1,2 +1,2 @@
 // generated by scripts/build-embed.mjs — do not edit
-export const VERSION = "0.0.45";
+export const VERSION = "0.0.47";

package/dist/web/src/components/ResetRail.d.ts

@@ -1,8 +1,12 @@
 import React from "react";
 import type { ProviderView } from "../state.js";
 export declare const RAIL_DAYS = 7;
+/** Stem height; every pin sits at tier 0, so the rail never grows. */
+export declare const STEM_PX = 14;
 export interface RailRow {
     id: string;
+    /** Pill text, used to estimate the width for dodge packing. */
+    label: string;
     resetsAt: string | null;
     estimated?: boolean;
 }
@@ -10,13 +14,16 @@ export type RailBand = "above" | "below";
 export interface PlacedPin extends RailRow {
     positionPct: number;
     band: RailBand;
-    tier: number;
+    /** Sideways pill offset in px; the dot stays on the time coordinate. */
+    offsetPx: number;
 }
 export interface PinCluster {
     ids: string[];
+    label: string;
     positionPct: number;
     band: RailBand;
-    tier: number;
+    /** Sideways pill offset in px; the dot stays on the time coordinate. */
+    offsetPx: number;
 }
 export interface PinPlacement {
     placed: PlacedPin[];
@@ -24,15 +31,29 @@ export interface PinPlacement {
     overflow: RailRow[];
     invalid: RailRow[];
 }
+/** Half the pill width for a display name: 16ch cap, ~7px per char + chrome. */
+export declare function pillHalfWidth(label: string): number;
+/** Half the timestamp width: tabular mono, ~6.6px per char + padding. */
+export declare function stampHalfWidth(text: string): number;
+export type RailMode = "separate" | "grouped";
+export declare const RAIL_MODE_KEY = "quotacap-rail-mode";
+export declare function storedRailMode(): RailMode;
 /**
  * Place reset pins proportionally over the next 7 days from `asOf`.
- * Crowded windows past tier capacity group into clusters; resets beyond the
- * rail overflow; invalid rows are reported; reset-passed rows place no pin
- * (the ledger shows "awaiting fresh window" for them).
+ * Same-band pills that would overlap dodge sideways by pill width (earlier
+ * left, later right); crowds past the spread cap shingle with small overlap
+ * instead, resolved by hover. Dots stay on the time coordinate and the rail
+ * stays flat. Resets beyond the rail overflow; invalid rows are reported;
+ * reset-passed rows place no pin (the ledger shows "awaiting fresh window"
+ * for them). Grouped mode collapses crowded windows into cluster pins.
  */
-export declare function placePins(rows: RailRow[], asOf: Date): PinPlacement;
-export declare function ResetRail({ providers, asOf, onSelectProvider, }: {
+export declare function placePins(rows: RailRow[], asOf: Date, opts?: {
+    grouped?: boolean;
+    railWidthPx?: number;
+}): PinPlacement;
+export declare function ResetRail({ providers, asOf, onSelectProvider, initialMode, }: {
     providers: ProviderView[];
     asOf: string;
     onSelectProvider: (id: string) => void;
+    initialMode?: RailMode;
 }): React.JSX.Element;

package/dist/web/src/components/ResetRail.js

@@ -3,17 +3,60 @@ import { useEffect, useRef, useState } from "react";
 import { paceBadge, resetClock, resetCountdown, timeLeft } from "./PaceBar.js";
 export const RAIL_DAYS = 7;
 const RAIL_MS = RAIL_DAYS * 24 * 60 * 60 * 1000;
-/** Pins within this span of rail group into one collision window. */
+/** Pins within this span of rail group into one collision window (grouped mode). */
 const COLLISION_PCT = 3;
-/** Pins per window before they group into a cluster pin. */
-const WINDOW_CAPACITY = 3;
+/** Pins per window past which they group into a cluster pin (grouped mode). */
+const WINDOW_CAPACITY = 2;
+/** Stem height; every pin sits at tier 0, so the rail never grows. */
+export const STEM_PX = 14;
+/** Layout width before the rail measures itself (dashboard content max). */
+const RAIL_REF_PX = 1072;
+/** Gap kept between dodged pills. */
+const DODGE_GAP_PX = 6;
+/** Widest one dodge group may spread; past this pills shingle with overlap. */
+const MAX_GROUP_SPREAD_PX = 160;
+/** Half the pill width for a display name: 16ch cap, ~7px per char + chrome. */
+export function pillHalfWidth(label) {
+    return (Math.min(label.length, 16) * 7 + 30) / 2;
+}
+/** Half the timestamp width: tabular mono, ~6.6px per char + padding. */
+export function stampHalfWidth(text) {
+    return (text.length * 6.6 + 12) / 2;
+}
+function pinHalfWidth(pin) {
+    // Candidates reaching layout always parsed, but the row type allows null.
+    const clock = pin.resetsAt === null ? "" : (resetClock(pin.resetsAt) ?? "");
+    const stamp = `${clock}${pin.estimated ? " (est.)" : ""}`;
+    return Math.max(pillHalfWidth(pin.label), stampHalfWidth(stamp));
+}
+export const RAIL_MODE_KEY = "quotacap-rail-mode";
+export function storedRailMode() {
+    try {
+        const v = typeof localStorage === "undefined" ? null : localStorage.getItem(RAIL_MODE_KEY);
+        return v === "grouped" ? "grouped" : "separate";
+    }
+    catch {
+        return "separate";
+    }
+}
+function persistRailMode(mode) {
+    try {
+        localStorage.setItem(RAIL_MODE_KEY, mode);
+    }
+    catch {
+        // Private mode or non-DOM: the choice simply does not persist.
+    }
+}
 /**
  * Place reset pins proportionally over the next 7 days from `asOf`.
- * Crowded windows past tier capacity group into clusters; resets beyond the
- * rail overflow; invalid rows are reported; reset-passed rows place no pin
- * (the ledger shows "awaiting fresh window" for them).
+ * Same-band pills that would overlap dodge sideways by pill width (earlier
+ * left, later right); crowds past the spread cap shingle with small overlap
+ * instead, resolved by hover. Dots stay on the time coordinate and the rail
+ * stays flat. Resets beyond the rail overflow; invalid rows are reported;
+ * reset-passed rows place no pin (the ledger shows "awaiting fresh window"
+ * for them). Grouped mode collapses crowded windows into cluster pins.
  */
-export function placePins(rows, asOf) {
+export function placePins(rows, asOf, opts) {
     const asOfMs = asOf.getTime();
     const placed = [];
     const clusters = [];
@@ -48,41 +91,87 @@ export function placePins(rows, asOf) {
     }
     const items = [];
     for (const window of windows) {
-        if (window.length <= WINDOW_CAPACITY) {
+        if (opts?.grouped && window.length > WINDOW_CAPACITY) {
+            const positionPct = window.reduce((sum, c) => sum + c.positionPct, 0) / window.length;
+            const ids = window.map((c) => c.row.id);
+            items.push({
+                kind: "cluster",
+                cluster: { ids, label: `${ids.length} resets`, positionPct, band: "above", offsetPx: 0 },
+            });
+        }
+        else {
             for (const c of window) {
                 items.push({
                     kind: "pin",
-                    pin: { ...c.row, positionPct: c.positionPct, band: "above", tier: 0 },
+                    pin: { ...c.row, positionPct: c.positionPct, band: "above", offsetPx: 0 },
                 });
             }
         }
-        else {
-            const positionPct = window.reduce((sum, c) => sum + c.positionPct, 0) / window.length;
-            items.push({
-                kind: "cluster",
-                cluster: { ids: window.map((c) => c.row.id), positionPct, band: "above", tier: 0 },
-            });
-        }
     }
     items.sort((a, b) => {
         const pa = a.kind === "pin" ? a.pin.positionPct : a.cluster.positionPct;
         const pb = b.kind === "pin" ? b.pin.positionPct : b.cluster.positionPct;
         return pa - pb;
     });
-    // Alternate above/below bands; stagger tiers when same-band items crowd.
-    const lastByBand = {
-        above: { position: -Infinity, tier: 0 },
-        below: { position: -Infinity, tier: 0 },
-    };
+    // Alternate above/below bands so time-adjacent pins never share a side.
     items.forEach((item, index) => {
         const target = item.kind === "pin" ? item.pin : item.cluster;
-        const band = index % 2 === 0 ? "above" : "below";
-        const prev = lastByBand[band];
-        const tier = target.positionPct - prev.position < COLLISION_PCT * 2 ? prev.tier + 1 : 0;
-        target.band = band;
-        target.tier = tier;
-        lastByBand[band] = { position: target.positionPct, tier };
+        target.band = index % 2 === 0 ? "above" : "below";
     });
+    const width = opts?.railWidthPx && opts.railWidthPx > 0 ? opts.railWidthPx : RAIL_REF_PX;
+    const cap = Math.min(MAX_GROUP_SPREAD_PX, width * 0.3);
+    for (const band of ["above", "below"]) {
+        const lane = items
+            .filter((item) => (item.kind === "pin" ? item.pin.band : item.cluster.band) === band)
+            .map((item) => {
+            const target = item.kind === "pin" ? item.pin : item.cluster;
+            return {
+                target,
+                x: (target.positionPct / 100) * width,
+                half: item.kind === "pin" ? pinHalfWidth(item.pin) : pillHalfWidth(item.cluster.label),
+            };
+        });
+        // Chain natural extents into dodge groups.
+        const groups = [];
+        let group = [];
+        let edge = -Infinity;
+        const flush = () => {
+            if (group.length > 0)
+                groups.push(group);
+            group = [];
+            edge = -Infinity;
+        };
+        for (const slot of lane) {
+            if (slot.x - slot.half > edge + DODGE_GAP_PX)
+                flush();
+            group.push(slot);
+            edge = Math.max(edge, slot.x + slot.half);
+        }
+        flush();
+        for (const g of groups) {
+            if (g.length === 1)
+                continue; // offsetPx stays 0
+            const mid = (g[0].x + g[g.length - 1].x) / 2;
+            const totalW = g.reduce((sum, s) => sum + s.half * 2, 0) + DODGE_GAP_PX * (g.length - 1);
+            let cursor = mid - totalW / 2;
+            let centers = g.map((s) => {
+                const center = cursor + s.half;
+                cursor += s.half * 2 + DODGE_GAP_PX;
+                return center;
+            });
+            const boxSpan = centers[centers.length - 1] + g[g.length - 1].half - (centers[0] - g[0].half);
+            if (boxSpan > cap)
+                centers = centers.map((c) => mid + ((c - mid) * cap) / boxSpan);
+            const shift = centers[0] - g[0].half < 0
+                ? -(centers[0] - g[0].half)
+                : centers[centers.length - 1] + g[g.length - 1].half > width
+                    ? width - (centers[centers.length - 1] + g[g.length - 1].half)
+                    : 0;
+            g.forEach((s, i) => {
+                s.target.offsetPx = centers[i] + shift - s.x;
+            });
+        }
+    }
     for (const item of items) {
         if (item.kind === "pin")
             placed.push(item.pin);
@@ -154,16 +243,59 @@ function dayLabels(asOfMs) {
         return `${weekday} ${day}`;
     });
 }
-export function ResetRail({ providers, asOf, onSelectProvider, }) {
+/**
+ * Stem from the dot to the pill: vertical when centered, a short diagonal
+ * when the pill dodged sideways. The over-tall layout box is pulled back
+ * with a negative margin so the pill meets the stem's visual end.
+ */
+function PinStem({ band, offsetPx }) {
+    if (offsetPx === 0)
+        return _jsx("span", { className: "pin-stem" });
+    const dx = Math.abs(offsetPx);
+    const len = Math.sqrt(dx * dx + STEM_PX * STEM_PX);
+    const angle = (Math.atan2(dx, STEM_PX) * 180) / Math.PI;
+    const deg = band === "above" ? Math.sign(offsetPx) * angle : -Math.sign(offsetPx) * angle;
+    const pull = len - STEM_PX;
+    const style = band === "above"
+        ? { height: len, marginTop: -pull, transform: `rotate(${deg}deg)` }
+        : { height: len, marginBottom: -pull, transform: `rotate(${deg}deg)` };
+    return _jsx("span", { className: "pin-stem", style: style });
+}
+export function ResetRail({ providers, asOf, onSelectProvider, initialMode, }) {
     const [openCluster, setOpenCluster] = useState(null);
+    const [mode, setMode] = useState(() => initialMode ?? storedRailMode());
+    const [railWidth, setRailWidth] = useState(RAIL_REF_PX);
+    const railRef = useRef(null);
+    useEffect(() => {
+        const el = railRef.current;
+        if (!el || typeof ResizeObserver === "undefined")
+            return;
+        const ro = new ResizeObserver((entries) => {
+            const w = entries[0]?.contentRect.width;
+            if (w && w > 0)
+                setRailWidth(w);
+        });
+        ro.observe(el);
+        return () => ro.disconnect();
+    }, []);
     const asOfMs = Date.parse(asOf);
     const byId = new Map(providers.map((p) => [p.id, p]));
     const rows = providers
         .filter((p) => p.enabled && p.quota)
-        .map((p) => ({ id: p.id, resetsAt: p.quota.resetsAt, estimated: !!p.quota.resetsAtEstimated }));
-    const placement = placePins(rows, new Date(asOfMs));
+        .map((p) => ({
+        id: p.id,
+        label: p.displayName ?? p.id,
+        resetsAt: p.quota.resetsAt,
+        estimated: !!p.quota.resetsAtEstimated,
+    }));
+    const placement = placePins(rows, new Date(asOfMs), { grouped: mode === "grouped", railWidthPx: railWidth });
     const labels = dayLabels(asOfMs);
-    return (_jsxs("section", { "aria-label": "Upcoming resets", children: [_jsxs("div", { className: "section-head", children: [_jsx("h2", { id: "resets-h", children: "Upcoming resets" }), _jsxs("span", { className: "note", children: ["Next 7 days \u00B7 hover pin for usage \u00B7 click for details \u00B7 ", tzAbbrev(), placement.overflow.length > 0 && (_jsxs("span", { "data-testid": "rail-overflow", title: placement.overflow.map((o) => byId.get(o.id)?.displayName ?? o.id).join(", "), style: { marginLeft: 8, fontWeight: 600, color: "var(--ahead)" }, children: ["+", placement.overflow.length, " beyond rail"] }))] })] }), _jsx("div", { "data-testid": "rail", className: "rail-scroller", tabIndex: 0, role: "region", "aria-label": `Upcoming resets over the next ${RAIL_DAYS} days`, children: _jsxs("div", { className: "rail", children: [_jsx("div", { className: "rail-grid", "aria-hidden": "true", children: Array.from({ length: RAIL_DAYS }, (_, i) => (_jsx("span", {}, i))) }), _jsx("div", { className: "rail-axis", "aria-hidden": "true" }), _jsx("div", { className: "rail-now", "aria-hidden": "true" }), _jsx("span", { className: "rail-nowlabel", "aria-hidden": "true", children: "Now" }), placement.placed.map((pin) => {
+    const setModePersist = (next) => {
+        setOpenCluster(null);
+        setMode(next);
+        persistRailMode(next);
+    };
+    return (_jsxs("section", { "aria-label": "Upcoming resets", children: [_jsxs("div", { className: "section-head", children: [_jsx("h2", { id: "resets-h", children: "Upcoming resets" }), _jsxs("div", { className: "section-head-controls", children: [_jsxs("span", { className: "note", children: ["Next 7 days \u00B7 hover pin for usage \u00B7 click for details \u00B7 ", tzAbbrev(), placement.overflow.length > 0 && (_jsxs("span", { "data-testid": "rail-overflow", title: placement.overflow.map((o) => byId.get(o.id)?.displayName ?? o.id).join(", "), style: { marginLeft: 8, fontWeight: 600, color: "var(--ahead)" }, children: ["+", placement.overflow.length, " beyond rail"] }))] }), _jsxs("div", { "data-testid": "rail-mode", role: "group", "aria-label": "Reset pin grouping", className: "seg", children: [_jsx("button", { type: "button", "aria-pressed": mode === "separate", onClick: () => setModePersist("separate"), children: "Separate" }), _jsx("button", { type: "button", "aria-pressed": mode === "grouped", onClick: () => setModePersist("grouped"), children: "Grouped" })] })] })] }), _jsx("div", { "data-testid": "rail", className: "rail-scroller", tabIndex: 0, role: "region", "aria-label": `Upcoming resets over the next ${RAIL_DAYS} days`, children: _jsxs("div", { className: "rail", ref: railRef, children: [_jsx("div", { className: "rail-grid", "aria-hidden": "true", children: Array.from({ length: RAIL_DAYS }, (_, i) => (_jsx("span", {}, i))) }), _jsx("div", { className: "rail-axis", "aria-hidden": "true" }), _jsx("div", { className: "rail-now", "aria-hidden": "true" }), _jsx("span", { className: "rail-nowlabel", "aria-hidden": "true", children: "Now" }), placement.placed.map((pin) => {
                             const provider = byId.get(pin.id);
                             const when = provider?.quota ? pinWhen(provider.quota.resetsAt) : provider ? resetCountdown(provider, asOfMs) : "";
                             const pace = provider ? paceBadge(provider) : "";
@@ -171,20 +303,20 @@ export function ResetRail({ providers, asOf, onSelectProvider, }) {
                             const name = provider?.displayName ?? pin.id;
                             const { cls: paceCls, color: paceColor } = pinPace(provider);
                             const alignClass = pin.positionPct < 12 ? "pin-start" : pin.positionPct > 88 ? "pin-end" : "";
-                            const tierClass = pin.tier > 0 ? `tier${pin.tier + 1}` : "tier1";
                             const pinBorder = {
                                 ["--pin-border"]: `color-mix(in oklch, ${paceColor} 45%, var(--line))`,
                             };
-                            return (_jsxs("button", { "data-testid": "pin", type: "button", className: `pin ${pin.band} ${tierClass} ${alignClass}`, style: {
+                            const dodgeX = pin.offsetPx === 0 ? undefined : { translate: `${pin.offsetPx}px 0` };
+                            return (_jsxs("button", { "data-testid": "pin", type: "button", className: `pin ${pin.band} ${alignClass}`, style: {
                                     left: `${pin.positionPct}%`,
-                                    "--dot-color": paceColor,
-                                }, "aria-label": `${name}: ${pace}, resets ${when}`, onClick: () => onSelectProvider(pin.id), children: [pin.band === "above" ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "pin-when", children: pin.estimated ? `${when} (est.)` : when }), _jsx("span", { className: `pin-label ${paceCls}`, style: pinBorder, children: name }), _jsx("span", { className: "pin-stem" }), _jsx("span", { className: "pin-dot" })] })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: "pin-dot" }), _jsx("span", { className: "pin-stem" }), _jsx("span", { className: `pin-label ${paceCls}`, style: pinBorder, children: name }), _jsx("span", { className: "pin-when", children: pin.estimated ? `${when} (est.)` : when })] })), _jsxs("span", { className: "pin-tooltip", role: "tooltip", children: [_jsx("b", { children: name }), _jsx("span", { className: "pt-sep", children: "\u00B7" }), provider?.quota ? `${provider.quota.weeklyPct}% used` : "no readings", _jsx("span", { className: "pt-sep", children: "\u00B7" }), left ? `${left} left` : when, pin.estimated ? " (est.)" : ""] })] }, pin.id));
+                                    ["--dot-color"]: paceColor,
+                                }, "aria-label": `${name}: ${pace}, resets ${when}`, onClick: () => onSelectProvider(pin.id), children: [pin.band === "above" ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "pin-when", style: dodgeX, children: pin.estimated ? `${when} (est.)` : when }), _jsx("span", { className: `pin-label ${paceCls}`, style: { ...pinBorder, ...dodgeX }, children: name }), _jsx(PinStem, { band: pin.band, offsetPx: pin.offsetPx }), _jsx("span", { className: "pin-dot" })] })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: "pin-dot" }), _jsx(PinStem, { band: pin.band, offsetPx: pin.offsetPx }), _jsx("span", { className: `pin-label ${paceCls}`, style: { ...pinBorder, ...dodgeX }, children: name }), _jsx("span", { className: "pin-when", style: dodgeX, children: pin.estimated ? `${when} (est.)` : when })] })), _jsxs("span", { className: "pin-tooltip", role: "tooltip", children: [_jsx("b", { children: name }), _jsx("span", { className: "pt-sep", children: "\u00B7" }), provider?.quota ? `${provider.quota.weeklyPct}% used` : "no readings", _jsx("span", { className: "pt-sep", children: "\u00B7" }), left ? `${left} left` : when, pin.estimated ? " (est.)" : ""] })] }, pin.id));
                         }), placement.clusters.map((cluster, index) => {
                             const alignClass = cluster.positionPct < 12 ? "pin-start" : cluster.positionPct > 88 ? "pin-end" : "";
-                            const tierClass = cluster.tier > 0 ? `tier${cluster.tier + 1}` : "tier1";
-                            return (_jsx("button", { "data-testid": "cluster-pin", type: "button", className: `pin ${cluster.band} ${tierClass} ${alignClass}`, style: {
+                            const dodgeX = cluster.offsetPx === 0 ? undefined : { translate: `${cluster.offsetPx}px 0` };
+                            return (_jsx("button", { "data-testid": "cluster-pin", type: "button", className: `pin ${cluster.band} ${alignClass}`, style: {
                                     left: `${cluster.positionPct}%`,
                                     "--dot-color": "var(--accent)",
-                                }, "aria-label": `${cluster.ids.length} resets at the same time: ${cluster.ids.map((id) => byId.get(id)?.displayName ?? id).join(", ")}`, "aria-expanded": openCluster === index, onClick: () => setOpenCluster(openCluster === index ? null : index), children: cluster.band === "above" ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: "pin-label", style: { borderColor: "var(--accent)", color: "var(--accent)" }, children: [cluster.ids.length, " resets"] }), _jsx("span", { className: "pin-stem" }), _jsx("span", { className: "pin-dot" })] })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: "pin-dot" }), _jsx("span", { className: "pin-stem" }), _jsxs("span", { className: "pin-label", style: { borderColor: "var(--accent)", color: "var(--accent)" }, children: [cluster.ids.length, " resets"] })] })) }, cluster.ids.join("+")));
+                                }, "aria-label": `${cluster.ids.length} resets at the same time: ${cluster.ids.map((id) => byId.get(id)?.displayName ?? id).join(", ")}`, "aria-expanded": openCluster === index, onClick: () => setOpenCluster(openCluster === index ? null : index), children: cluster.band === "above" ? (_jsxs(_Fragment, { children: [_jsxs("span", { className: "pin-label", style: { borderColor: "var(--accent)", color: "var(--accent)", ...dodgeX }, children: [cluster.ids.length, " resets"] }), _jsx(PinStem, { band: cluster.band, offsetPx: cluster.offsetPx }), _jsx("span", { className: "pin-dot" })] })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: "pin-dot" }), _jsx(PinStem, { band: cluster.band, offsetPx: cluster.offsetPx }), _jsxs("span", { className: "pin-label", style: { borderColor: "var(--accent)", color: "var(--accent)", ...dodgeX }, children: [cluster.ids.length, " resets"] })] })) }, cluster.ids.join("+")));
                         }), openCluster !== null && placement.clusters[openCluster] && (_jsx(ClusterPopover, { cluster: placement.clusters[openCluster], providers: byId, asOfMs: asOfMs, onSelect: onSelectProvider, onClose: () => setOpenCluster(null) })), _jsx("div", { className: "rail-days", "aria-hidden": "true", children: labels.map((label) => (_jsx("span", { children: label }, label))) })] }) })] }));
 }