shell: collapsible nav groups + mobile-friendly settings

- Reorganize sidenav into collapsible groups (Tenancy, Data,
  Integrations, Communications, Observability, AI & Search) with
  Overview/Settings pinned at top/bottom. Group open/close persists in
  localStorage; the group containing the active route auto-opens.
  Icon-only collapsed rail flattens to a single icon column. Sub-items
  inside groups drop their per-item icons and indent under the header.
- Fix mobile sheet scroll — the nav couldn't reach items past viewport
  height. SheetContent is now flex-col h-svh, header shrink-0, nav
  flex-1 min-h-0 overflow-y-auto.
- Settings page mobile fixes: section nav wraps instead of horizontal
  scroll, top padding clears the floating actions pill, LLM config
  card header and rows stack on narrow widths.

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

app/components/settings/llm-configurations-panel.tsx

@@ -226,7 +226,7 @@ export function LlmConfigurationsPanel() {
 
   return (
     <Card>
-      <CardHeader className="flex flex-row items-start justify-between gap-4">
+      <CardHeader className="flex flex-col items-stretch justify-between gap-4 sm:flex-row sm:items-start">
         <div className="flex-1">
           <CardTitle>LLM configurations</CardTitle>
           <CardDescription>
@@ -235,7 +235,7 @@ export function LlmConfigurationsPanel() {
           </CardDescription>
         </div>
         {usage ? (
-          <div className="flex shrink-0 flex-col items-end rounded-md border bg-muted/40 px-3 py-2 text-right">
+          <div className="flex shrink-0 flex-col items-start rounded-md border bg-muted/40 px-3 py-2 text-left sm:items-end sm:text-right">
             <span className="text-[10px] uppercase tracking-wide text-muted-foreground">
               Spend (30d)
             </span>
@@ -248,7 +248,7 @@ export function LlmConfigurationsPanel() {
             </span>
           </div>
         ) : null}
-        <div className="flex shrink-0 gap-2">
+        <div className="flex shrink-0 flex-wrap gap-2">
           {hasLocalSettings && configs.length === 0 ? (
             <Button
               variant="outline"
@@ -368,7 +368,7 @@ function ConfigRow({
   onDelete: () => void
 }) {
   return (
-    <li className="flex items-center justify-between gap-3 px-1 py-2.5">
+    <li className="flex flex-col items-stretch justify-between gap-3 px-1 py-2.5 sm:flex-row sm:items-center">
       <div className="flex min-w-0 items-center gap-3">
         <button
           type="button"
@@ -421,7 +421,7 @@ function ConfigRow({
         </div>
       </div>
 
-      <div className="flex shrink-0 items-center gap-3">
+      <div className="flex shrink-0 items-center justify-end gap-3 pl-7 sm:pl-0">
         {spend && spend.cost_cents > 0 ? (
           <div className="flex flex-col items-end text-right">
             <span className="font-mono text-sm tabular-nums">