fix: v0.9.3 plan usage instead of API-price cost; larger footer

- Footer shows "5h N%" when Claude sends rate_limits (Pro/Max); the
  dollar figure is an API-price estimate, so it is kept only for API-key
  billing. Sessions tooltip follows suit. Closes #40
- Bottom row: 40px, larger hints, bold 1rem usage meters with wider bars;
  narrow windows drop hints instead of clipping the meters. Closes #41
- bats setup unsets inherited DevDesk env so tests pass inside DevDesk

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WHRLCCdXYm41Qx5kNhehaP

web/src/sessions.js

@@ -278,7 +278,8 @@ export class SessionsPanel {
     const title = [
       s.dir,
       status.key === 'waiting' && s.status?.message,
-      s.context?.model && `${s.context.model}${s.context.cost_usd != null ? ` · $${s.context.cost_usd.toFixed(2)}` : ''}`,
+      // rate_limits means a Pro/Max plan, where cost_usd is only an API-price estimate
+      s.context?.model && `${s.context.model}${s.context.rate_limits ? '' : s.context.cost_usd != null ? ` · $${s.context.cost_usd.toFixed(2)}` : ''}`,
     ].filter(Boolean).join('\n');
     const iconButton = (label, glyph, onclick, extra = '') =>
       el('button', { class: `dd-icon-btn ${extra}`, type: 'button', title: label, 'aria-label': `${label} ${s.name}`, onclick }, glyph);

web/styles.css

@@ -2,7 +2,7 @@
    everything visual comes from the TDS tokens defined in base.css :root. */
 
 :root {
-  --dd-footer-height: 30px;
+  --dd-footer-height: 40px;
   --dd-sidebar-width: 320px;
   --dd-gap: 8px;
 }
@@ -492,7 +492,19 @@ body.dd-sidebar-open .dd-sidebar {
   overflow: hidden;
 }
 
-.dd-footer .lt-footer-key { margin-right: 4px; }
+.dd-footer .lt-footer-key { margin-right: 5px; font-size: 0.86rem; }
+/* devdesk#41: the bottom row was too small to read at a glance */
+.dd-footer .lt-footer-hint { font-size: 0.9rem; }
+.dd-footer .lt-footer-sep { font-size: 0.9rem; }
+/* Narrower windows keep the usage meters and drop the least-used hints. */
+@media (max-width: 1400px) {
+  .dd-footer .lt-footer-hints .lt-footer-hint:nth-child(n + 13),
+  .dd-footer .lt-footer-sep:nth-child(n + 12) { display: none; }
+}
+@media (max-width: 1150px) {
+  .dd-footer .lt-footer-hints .lt-footer-hint:nth-child(n + 9),
+  .dd-footer .lt-footer-sep:nth-child(n + 8) { display: none; }
+}
 
 .dd-keybar { display: flex; gap: 4px; width: 100%; overflow-x: auto; scrollbar-width: none; }
 .dd-keybar[hidden] { display: none; }
@@ -625,7 +637,7 @@ html[data-theme="light"] .lt-cmd-item.is-selected { background: var(--accent-cya
   background: none;
   color: var(--accent-cyan);
   font-family: var(--font-mono);
-  font-size: 0.64rem;
+  font-size: 0.8rem;
   cursor: pointer;
 }
 .dd-footer-help:hover { border-color: var(--accent-cyan); }
@@ -1005,11 +1017,15 @@ html[data-theme="light"] .dd-files.is-narrow .dd-explorer { box-shadow: 8px 0 24
 .dd-history-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }
 .dd-history-actions .lt-input { width: 220px; font-size: 0.74rem; }
 
-.dd-footer-usage { margin-left: auto; padding-left: 12px; }
+.dd-footer-usage { margin-left: auto; padding-left: 16px; }
 .dd-footer-usage[hidden],
 .dd-usage-row[hidden] { display: none; }
 .dd-usage { display: inline-flex; align-items: center; gap: 10px; }
+.dd-footer-usage { display: inline-flex; align-items: center; gap: 18px; }
 .dd-meter { display: inline-flex; align-items: center; gap: 5px; color: var(--text-secondary); font-size: 0.66rem; white-space: nowrap; }
+.dd-footer-usage .dd-meter { gap: 7px; color: var(--text-primary); font-family: var(--font-mono); font-size: 1rem; font-weight: 600; }
+.dd-footer-usage .dd-meter-label { font-weight: 400; }
+.dd-footer-usage .dd-meter-bar { width: 80px; height: 8px; }
 .dd-meter-label { color: var(--text-muted); }
 .dd-meter-bar { width: 42px; height: 4px; background: var(--bg-tertiary); }
 .dd-meter-fill { display: block; height: 100%; background: var(--accent-cyan); }