@geminilight/mindos 0.6.58 → 0.6.60

package/_standalone/.next/types/routes.d.ts

@@ -2,7 +2,7 @@
 // Do not edit this file manually
 
 type AppRoutes = "/" | "/agents" | "/agents/[agentKey]" | "/changes" | "/echo" | "/echo/[segment]" | "/explore" | "/help" | "/inbox/history" | "/login" | "/setup" | "/trash" | "/view/[...path]" | "/wiki"
-type AppRouteHandlerRoutes = "/.well-known/agent-card.json" | "/api/a2a" | "/api/a2a/agents" | "/api/a2a/delegations" | "/api/a2a/discover" | "/api/acp/config" | "/api/acp/detect" | "/api/acp/install" | "/api/acp/registry" | "/api/acp/session" | "/api/agent-activity" | "/api/agents/custom" | "/api/agents/custom/detect" | "/api/ask" | "/api/ask-sessions" | "/api/auth" | "/api/backlinks" | "/api/bootstrap" | "/api/changes" | "/api/export" | "/api/extract-pdf" | "/api/file" | "/api/file/import" | "/api/file/raw" | "/api/files" | "/api/git" | "/api/graph" | "/api/health" | "/api/inbox" | "/api/init" | "/api/mcp/agents" | "/api/mcp/install" | "/api/mcp/install-skill" | "/api/mcp/restart" | "/api/mcp/status" | "/api/mcp/uninstall" | "/api/monitoring" | "/api/recent-files" | "/api/restart" | "/api/search" | "/api/settings" | "/api/settings/list-models" | "/api/settings/reset-token" | "/api/settings/test-key" | "/api/setup" | "/api/setup/check-path" | "/api/setup/check-port" | "/api/setup/generate-token" | "/api/setup/ls" | "/api/skills" | "/api/sync" | "/api/tree-version" | "/api/uninstall" | "/api/update" | "/api/update-check" | "/api/update-status" | "/api/workflows"
+type AppRouteHandlerRoutes = "/.well-known/agent-card.json" | "/api/a2a" | "/api/a2a/agents" | "/api/a2a/delegations" | "/api/a2a/discover" | "/api/acp/config" | "/api/acp/detect" | "/api/acp/install" | "/api/acp/registry" | "/api/acp/session" | "/api/agent-activity" | "/api/agents/copy-skill" | "/api/agents/custom" | "/api/agents/custom/detect" | "/api/ask" | "/api/ask-sessions" | "/api/auth" | "/api/backlinks" | "/api/bootstrap" | "/api/changes" | "/api/export" | "/api/extract-pdf" | "/api/file" | "/api/file/import" | "/api/file/raw" | "/api/files" | "/api/git" | "/api/graph" | "/api/health" | "/api/inbox" | "/api/init" | "/api/mcp/agents" | "/api/mcp/install" | "/api/mcp/install-skill" | "/api/mcp/restart" | "/api/mcp/status" | "/api/mcp/uninstall" | "/api/monitoring" | "/api/recent-files" | "/api/restart" | "/api/search" | "/api/settings" | "/api/settings/list-models" | "/api/settings/reset-token" | "/api/settings/test-key" | "/api/setup" | "/api/setup/check-path" | "/api/setup/check-port" | "/api/setup/generate-token" | "/api/setup/ls" | "/api/skills" | "/api/sync" | "/api/tree-version" | "/api/uninstall" | "/api/update" | "/api/update-check" | "/api/update-status" | "/api/workflows"
 type PageRoutes = never
 type LayoutRoutes = "/"
 type RedirectRoutes = never
@@ -25,6 +25,7 @@ interface ParamMap {
   "/api/acp/registry": {}
   "/api/acp/session": {}
   "/api/agent-activity": {}
+  "/api/agents/copy-skill": {}
   "/api/agents/custom": {}
   "/api/agents/custom/detect": {}
   "/api/ask": {}

package/_standalone/.next/types/validator.ts

@@ -272,6 +272,15 @@ type RouteHandlerConfig<Route extends AppRouteHandlerRoutes = AppRouteHandlerRou
   type __Unused = __Check
 }
 
+// Validate ../../app/api/agents/copy-skill/route.ts
+{
+  type __IsExpected<Specific extends RouteHandlerConfig<"/api/agents/copy-skill">> = Specific
+  const handler = {} as typeof import("../../app/api/agents/copy-skill/route.js")
+  type __Check = __IsExpected<typeof handler>
+  // @ts-ignore
+  type __Unused = __Check
+}
+
 // Validate ../../app/api/agents/custom/detect/route.ts
 {
   type __IsExpected<Specific extends RouteHandlerConfig<"/api/agents/custom/detect">> = Specific

package/_standalone/__tests__/api/mcp-install.test.ts

@@ -254,11 +254,11 @@ describe('POST /api/mcp/install', () => {
 });
 
 describe('GET /api/mcp/agents', () => {
-  it('returns all 21 agents (1 builtin + 20 registry)', async () => {
+  it('returns all 23 agents (1 builtin + 20 registry + 2 new)', async () => {
     const { GET } = await importAgentsRoute();
     const res = await GET();
     const body = await res.json();
-    expect(body.agents).toHaveLength(21);
+    expect(body.agents).toHaveLength(23);
     const keys = body.agents.map((a: { key: string }) => a.key);
     expect(keys).toContain('mindos');
     expect(keys).toContain('claude-code');
@@ -276,6 +276,8 @@ describe('GET /api/mcp/agents', () => {
     expect(keys).toContain('github-copilot');
     expect(keys).toContain('codex');
     expect(keys).toContain('antigravity');
+    expect(keys).toContain('qclaw');
+    expect(keys).toContain('workbuddy');
   });
 
   it('detects installed agent from config file', async () => {

package/_standalone/app/globals.css

@@ -180,7 +180,7 @@ body {
 }
 
 .prose {
-  font-family: var(--prose-font-override, 'Lora', Georgia, serif);
+  font-family: var(--prose-font-override, 'IBM Plex Sans', system-ui, sans-serif);
   color: var(--prose-body);
   line-height: 1.85;
   font-size: var(--prose-font-size-override, 0.95rem);
@@ -238,6 +238,7 @@ body {
 
 /* Ask Panel — compact prose for side panel chat bubbles */
 .prose.prose-panel {
+  font-family: 'IBM Plex Sans', system-ui, sans-serif;
   font-size: 0.8125rem !important;
   line-height: 1.6;
 }

package/_standalone/components/AskFab.tsx

@@ -2,6 +2,7 @@
 
 import { Sparkles } from 'lucide-react';
 import { useLocale } from '@/lib/stores/locale-store';
+import { usePathname } from 'next/navigation';
 
 interface AskFabProps {
   /** Toggle the right-side Ask AI panel */
@@ -12,8 +13,13 @@ interface AskFabProps {
 
 export default function AskFab({ onToggle, askPanelOpen }: AskFabProps) {
   const { t } = useLocale();
+  const pathname = usePathname();
   const label = `${t.ask?.fabLabel ?? 'Ask AI'} (⌘/)`;
 
+  // Hide on home page — it already has an inline chatbot
+  const isHome = pathname === '/' || pathname === '';
+  const hidden = askPanelOpen || isHome;
+
   return (
     <button
       onClick={onToggle}
@@ -22,13 +28,13 @@ export default function AskFab({ onToggle, askPanelOpen }: AskFabProps) {
         fixed z-40 bottom-5 right-5
         items-center justify-center
         gap-0 hover:gap-2
-        p-3 rounded-xl
-        text-white font-medium text-[13px]
-        shadow-sm shadow-amber-900/10
+        p-3 rounded-2xl
+        text-[var(--amber-foreground)] font-medium text-[13px]
+        shadow-md shadow-[var(--amber)]/15
         transition-all duration-200 ease-out
-        hover:shadow-md hover:shadow-amber-900/15
+        hover:shadow-lg hover:shadow-[var(--amber)]/20
         active:scale-95 cursor-pointer overflow-hidden
-        ${askPanelOpen ? 'opacity-0 pointer-events-none translate-y-2' : 'opacity-100 translate-y-0'}
+        ${hidden ? 'opacity-0 pointer-events-none translate-y-2' : 'opacity-100 translate-y-0'}
       `}
       style={{
         background: 'var(--amber)',

package/_standalone/components/AskModal.tsx

@@ -29,7 +29,7 @@ export default function AskModal({ open, onClose, currentFile, initialMessage, i
         role="dialog"
         aria-modal="true"
         aria-label={t.ask.title}
-        className="w-full md:max-w-2xl md:mx-4 bg-card border-t md:border border-border rounded-t-2xl md:rounded-xl shadow-2xl flex flex-col h-[92vh] md:h-auto md:max-h-[75vh]"
+        className="w-full md:max-w-2xl md:mx-4 bg-card border-t md:border border-border/60 rounded-t-2xl md:rounded-2xl shadow-2xl flex flex-col h-[92vh] md:h-auto md:max-h-[75vh]"
       >
         <AskContent
           visible={open}

package/_standalone/components/FileTree.tsx

@@ -12,6 +12,7 @@ import {
 import { createFileAction, deleteFileAction, renameFileAction, renameSpaceAction, deleteSpaceAction, convertToSpaceAction, deleteFolderAction, undoDeleteAction } from '@/lib/actions';
 import { toast } from '@/lib/toast';
 import { useLocale } from '@/lib/stores/locale-store';
+import { quickDropToDirectory } from '@/lib/inbox-upload';
 import { ConfirmDialog } from '@/components/agents/AgentsPrimitives';
 import { usePinnedFiles } from '@/lib/hooks/usePinnedFiles';
 import { checkAiAvailable, triggerSpaceAiInit } from '@/lib/space-ai-init';
@@ -318,6 +319,81 @@ function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth, onI
   const [deleteConfirm, setDeleteConfirm] = useState<null | 'space' | 'folder'>(null);
   const [isPendingDelete, startDeleteTransition] = useTransition();
 
+  // ── External file drop target ──
+  const [isDragTarget, setIsDragTarget] = useState(false);
+  const autoExpandTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const dragLeaveTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+
+  const clearAutoExpand = useCallback(() => {
+    if (autoExpandTimerRef.current) {
+      clearTimeout(autoExpandTimerRef.current);
+      autoExpandTimerRef.current = null;
+    }
+  }, []);
+
+  // Use dragOver (fires continuously while hovering) for highlight.
+  // Clear highlight with a short delay on dragLeave — if dragOver fires again
+  // within the delay, the highlight stays. This avoids flicker from nested elements.
+  const handleRowDragOver = useCallback((e: React.DragEvent) => {
+    if (!e.dataTransfer.types.includes('Files')) return;
+    e.preventDefault();
+    e.stopPropagation();
+    e.dataTransfer.dropEffect = 'copy';
+    if (dragLeaveTimerRef.current) {
+      clearTimeout(dragLeaveTimerRef.current);
+      dragLeaveTimerRef.current = null;
+    }
+    if (!isDragTarget) setIsDragTarget(true);
+  }, [isDragTarget]);
+
+  const handleRowDragEnter = useCallback((e: React.DragEvent) => {
+    if (!e.dataTransfer.types.includes('Files')) return;
+    e.preventDefault();
+    e.stopPropagation();
+    setIsDragTarget(true);
+    // Auto-expand collapsed directory after 500ms hover
+    clearAutoExpand();
+    if (!open) {
+      autoExpandTimerRef.current = setTimeout(() => {
+        setOpen(true);
+        autoExpandTimerRef.current = null;
+      }, 500);
+    }
+  }, [open, clearAutoExpand]);
+
+  const handleRowDragLeave = useCallback((e: React.DragEvent) => {
+    if (!e.dataTransfer.types.includes('Files')) return;
+    e.stopPropagation();
+    // Delay clearing so dragOver on the same row can cancel it
+    dragLeaveTimerRef.current = setTimeout(() => {
+      setIsDragTarget(false);
+      clearAutoExpand();
+      dragLeaveTimerRef.current = null;
+    }, 50);
+  }, [clearAutoExpand]);
+
+  const handleRowDrop = useCallback((e: React.DragEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setIsDragTarget(false);
+    clearAutoExpand();
+    if (dragLeaveTimerRef.current) {
+      clearTimeout(dragLeaveTimerRef.current);
+      dragLeaveTimerRef.current = null;
+    }
+    const files = e.dataTransfer.files;
+    if (files.length > 0) {
+      void quickDropToDirectory(Array.from(files), node.path, t);
+    }
+  }, [node.path, t, clearAutoExpand]);
+
+  useEffect(() => {
+    return () => {
+      clearAutoExpand();
+      if (dragLeaveTimerRef.current) clearTimeout(dragLeaveTimerRef.current);
+    };
+  }, [clearAutoExpand]);
+
   const toggle = useCallback(() => setOpen(v => !v), []);
 
   const prevMaxOpenDepth = useRef<number | null | undefined>(undefined);
@@ -421,8 +497,14 @@ function DirectoryNode({ node, depth, currentPath, onNavigate, maxOpenDepth, onI
   return (
     <div>
       <div
-        className="relative group/dir flex items-center"
+        className={`relative group/dir flex items-center transition-colors duration-100 ${
+          isDragTarget ? 'bg-[var(--amber)]/10 rounded-md' : ''
+        }`}
         onContextMenu={handleContextMenu}
+        onDragEnter={handleRowDragEnter}
+        onDragOver={handleRowDragOver}
+        onDragLeave={handleRowDragLeave}
+        onDrop={handleRowDrop}
       >
         <button
           onClick={toggle}

package/_standalone/components/GuideCard.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useState, useEffect, useCallback, useRef } from 'react';
-import { X, Sparkles, Upload, MessageCircle, ExternalLink, Check, ChevronRight, Copy } from 'lucide-react';
+import { X, Sparkles, Upload, MessageCircle, ExternalLink, Check, Copy, ChevronDown } from 'lucide-react';
 import { copyToClipboard } from '@/lib/clipboard';
 import { toast } from '@/lib/toast';
 import Link from 'next/link';
@@ -9,6 +9,7 @@ import { useLocale } from '@/lib/stores/locale-store';
 import { openAskModal } from '@/hooks/useAskModal';
 import { walkthroughSteps } from './walkthrough/steps';
 import type { GuideState } from '@/lib/settings';
+
 export default function GuideCard() {
   const { t } = useLocale();
   const g = t.guide;
@@ -18,7 +19,6 @@ export default function GuideCard() {
   const [isFirstVisit, setIsFirstVisit] = useState(false);
   const [step3Done, setStep3Done] = useState(false);
 
-  // Fetch guide state from backend
   const fetchGuideState = useCallback(() => {
     fetch('/api/setup')
       .then(r => r.json())
@@ -37,10 +37,8 @@ export default function GuideCard() {
 
   useEffect(() => {
     fetchGuideState();
-
     const handleFirstVisit = () => { setIsFirstVisit(true); };
     window.addEventListener('mindos:first-visit', handleFirstVisit);
-
     const handleGuideUpdate = () => fetchGuideState();
     window.addEventListener('focus', handleGuideUpdate);
     window.addEventListener('guide-state-updated', handleGuideUpdate);
@@ -68,7 +66,6 @@ export default function GuideCard() {
   }, [patchGuide]);
 
   // ── Step 1: Import ──
-
   const handleImportClick = useCallback(() => {
     window.dispatchEvent(new CustomEvent('mindos:open-import'));
   }, []);
@@ -78,7 +75,6 @@ export default function GuideCard() {
     setExpanded(null);
   }, [patchGuide]);
 
-  // Auto-mark step 1 done when files change (import completes, space created, etc.)
   useEffect(() => {
     if (!guideState || guideState.step1Done) return;
     const handler = () => patchGuide({ step1Done: true });
@@ -87,7 +83,6 @@ export default function GuideCard() {
   }, [guideState, guideState?.step1Done, patchGuide]);
 
   // ── Step 2: AI verify ──
-
   const handleStartAI = useCallback(() => {
     const gs = guideState;
     const isEmpty = gs?.template === 'empty';
@@ -96,7 +91,6 @@ export default function GuideCard() {
   }, [guideState, g]);
 
   // ── Step 3: Cross-agent copy ──
-
   const handleCopyPrompt = useCallback(async () => {
     const ok = await copyToClipboard(g.agent.copyPrompt);
     if (ok) toast.copy();
@@ -109,7 +103,6 @@ export default function GuideCard() {
   }, [patchGuide]);
 
   // ── Next-step prompts ──
-
   const handleNextStepClick = useCallback(() => {
     if (!guideState) return;
     const idx = guideState.nextStepIndex;
@@ -121,15 +114,12 @@ export default function GuideCard() {
   }, [guideState, g, patchGuide]);
 
   // ── Auto-expand on step transitions ──
-
-  // First visit: expand step 1
   useEffect(() => {
     if (isFirstVisit && guideState && !guideState.step1Done) {
       setExpanded('import');
     }
   }, [isFirstVisit, guideState]);
 
-  // Step transition: auto-expand next step
   const prevStepRef = useRef({ s1: false, s2: false });
   useEffect(() => {
     if (!guideState) return;
@@ -145,7 +135,6 @@ export default function GuideCard() {
   }, [guideState?.step1Done, guideState?.askedAI, guideState]);
 
   // ── Auto-dismiss final state ──
-
   const step1Done = guideState?.step1Done ?? false;
   const step2Done = guideState?.askedAI ?? false;
   const nextIdx = guideState?.nextStepIndex ?? 0;
@@ -161,7 +150,6 @@ export default function GuideCard() {
   }, [allNextDone, handleDismiss]);
 
   // ── Render guards ──
-
   if (!guideState) return null;
 
   const walkthroughActive = guideState.walkthroughStep !== undefined
@@ -170,17 +158,14 @@ export default function GuideCard() {
     && !guideState.walkthroughDismissed;
   if (walkthroughActive) return null;
 
-  // If both steps 1+2 were already done on load (e.g. page refresh), step3Done is local
-  // and starts false — this lets the user see step 3 again, which is useful.
   const showStep3 = step1Done && step2Done && !step3Done;
 
   // ── Final state: all next-steps done ──
-
   if (allCoreDone && allNextDone) {
     return (
-      <div className="mb-6 rounded-xl border border-[var(--amber)] px-5 py-4 flex items-center gap-3 animate-in fade-in duration-300 bg-[var(--amber-subtle)]">
-        <Sparkles size={16} className="animate-spin-slow text-[var(--amber)]" />
-        <span className="text-sm font-semibold flex-1 text-foreground">
+      <div className="rounded-lg border border-border/50 px-4 py-3 flex items-center gap-3 animate-in fade-in duration-300">
+        <Sparkles size={14} className="text-[var(--amber)] shrink-0" />
+        <span className="text-xs font-medium flex-1 text-foreground">
           {g.done.titleFinal}
         </span>
         <Link
@@ -190,159 +175,159 @@ export default function GuideCard() {
           {t.walkthrough.exploreCta}
         </Link>
         <button onClick={handleDismiss} className="p-1 rounded hover:bg-muted transition-colors text-muted-foreground">
-          <X size={14} />
+          <X size={12} />
         </button>
       </div>
     );
   }
 
   // ── Done state: next-step prompts ──
-
   if (allCoreDone) {
     const step = g.done.steps[nextIdx];
     return (
-      <div className="mb-6 rounded-xl border border-[var(--amber)] px-5 py-4 animate-in fade-in duration-300 bg-[var(--amber-subtle)]">
+      <div className="rounded-lg border border-border/50 px-4 py-3 animate-in fade-in duration-300">
         <div className="flex items-center gap-3">
-          <Sparkles size={16} className="text-[var(--amber)]" />
-          <span className="text-sm font-semibold flex-1 text-foreground">
+          <Sparkles size={14} className="text-[var(--amber)] shrink-0" />
+          <span className="text-xs font-medium flex-1 text-foreground">
             {g.done.title}
           </span>
           <button onClick={handleDismiss} className="p-1 rounded hover:bg-muted transition-colors text-muted-foreground">
-            <X size={14} />
+            <X size={12} />
           </button>
         </div>
         {step && (
           <button
             onClick={handleNextStepClick}
-            className="mt-3 flex items-center gap-2 text-sm text-[var(--amber)] transition-colors hover:opacity-80 cursor-pointer animate-in fade-in slide-in-from-left-2 duration-300"
+            className="mt-2 ml-6 flex items-center gap-1.5 text-xs text-[var(--amber)] transition-colors hover:opacity-80 cursor-pointer"
           >
-            <ChevronRight size={14} />
             <span>{step.hint}</span>
+            <ChevronDown size={10} className="-rotate-90" />
           </button>
         )}
       </div>
     );
   }
 
-  // ── Main guide card with 3 steps ──
+  // ── Steps data ──
+  const steps = [
+    { key: 'import' as const, done: step1Done, icon: Upload, title: g.import.title, dimmed: false },
+    { key: 'ai' as const, done: step2Done, icon: MessageCircle, title: g.ai.title, dimmed: !step1Done },
+    { key: 'agent' as const, done: step3Done, icon: ExternalLink, title: g.agent.title, dimmed: !step1Done || !step2Done },
+  ];
+
+  const handleStepClick = (key: 'import' | 'ai' | 'agent', done: boolean, dimmed: boolean) => {
+    if (done || dimmed) return;
+    setExpanded(expanded === key ? null : key);
+  };
 
+  // ── Main guide card ──
   return (
-    <div className="mb-6 rounded-xl border border-[var(--amber)] overflow-hidden bg-[var(--amber-subtle)]">
+    <div className="rounded-lg border border-border/50 overflow-hidden">
+
+      {/* Header row with inline steps */}
+      <div className="flex items-center gap-2 px-4 py-3">
+        <Sparkles size={14} className="text-[var(--amber)] shrink-0" />
+        <span className="text-xs font-semibold text-foreground mr-2">{g.title}</span>
+
+        {/* Step indicators — horizontal */}
+        <div className="flex items-center gap-1 flex-1 min-w-0">
+          {steps.map((s, i) => {
+            const Icon = s.icon;
+            const isActive = expanded === s.key;
+            const isClickable = !s.done && !s.dimmed;
+            return (
+              <button
+                key={s.key}
+                type="button"
+                onClick={() => handleStepClick(s.key, s.done, s.dimmed)}
+                disabled={s.done || s.dimmed}
+                className={`flex items-center gap-1.5 px-2.5 py-1 rounded-md text-2xs font-medium transition-all ${
+                  s.done
+                    ? 'text-success/70'
+                    : s.dimmed
+                      ? 'text-muted-foreground/30'
+                      : isActive
+                        ? 'bg-[var(--amber)]/10 text-[var(--amber)]'
+                        : 'text-muted-foreground hover:text-foreground hover:bg-muted/50'
+                } ${isClickable ? 'cursor-pointer' : ''}`}
+              >
+                {s.done ? (
+                  <Check size={11} className="shrink-0" />
+                ) : (
+                  <span className={`flex items-center justify-center w-4 h-4 rounded-full text-[9px] font-bold shrink-0 ${
+                    isActive ? 'bg-[var(--amber)] text-white' : s.dimmed ? 'bg-muted/50 text-muted-foreground/30' : 'bg-muted text-muted-foreground'
+                  }`}>
+                    {i + 1}
+                  </span>
+                )}
+                <span className="truncate hidden sm:inline">{s.title}</span>
+              </button>
+            );
+          })}
+        </div>
 
-      {/* Header */}
-      <div className="flex items-center gap-3 px-5 pt-4 pb-2">
-        <Sparkles size={16} className="text-[var(--amber)]" />
-        <span className="text-sm font-semibold flex-1 text-foreground">
-          {g.title}
-        </span>
-        <button onClick={handleDismiss} className="p-1 rounded hover:bg-muted transition-colors text-muted-foreground">
-          <X size={14} />
+        <button onClick={handleDismiss} className="p-1 rounded hover:bg-muted transition-colors text-muted-foreground shrink-0">
+          <X size={12} />
         </button>
       </div>
 
-      {/* Task cards */}
-      <div className="grid grid-cols-1 sm:grid-cols-3 gap-2 px-5 py-3">
-        <TaskCard
-          icon={<Upload size={16} />}
-          title={g.import.title}
-          cta={g.import.cta}
-          done={step1Done}
-          active={expanded === 'import'}
-          onClick={() => !step1Done ? setExpanded(expanded === 'import' ? null : 'import') : null}
-        />
-        <TaskCard
-          icon={<MessageCircle size={16} />}
-          title={g.ai.title}
-          cta={g.ai.cta}
-          done={step2Done}
-          active={expanded === 'ai'}
-          dimmed={!step1Done}
-          onClick={() => {
-            if (step2Done || !step1Done) return;
-            setExpanded(expanded === 'ai' ? null : 'ai');
-          }}
-        />
-        <TaskCard
-          icon={<ExternalLink size={16} />}
-          title={g.agent.title}
-          cta={g.agent.cta}
-          done={step3Done}
-          active={expanded === 'agent'}
-          dimmed={!step1Done || !step2Done}
-          onClick={() => {
-            if (!step1Done || !step2Done) return;
-            setExpanded(expanded === 'agent' ? null : 'agent');
-          }}
-        />
-      </div>
-
-      {/* ── Step 1 expanded: Import files ── */}
+      {/* ── Step 1 expanded ── */}
       {expanded === 'import' && !step1Done && (
-        <div className="px-5 pb-4 animate-in slide-in-from-top-2 duration-200">
-          <div className="rounded-lg border border-border bg-card p-4">
-            <p className="text-xs text-muted-foreground mb-3">
-              {g.import.desc}
-            </p>
-            <div className="flex items-center justify-between">
-              <button
-                onClick={handleImportClick}
-                className="text-xs font-medium px-4 py-2 rounded-lg transition-all hover:opacity-90"
-                style={{ background: 'var(--amber)', color: 'var(--amber-foreground)' }}
-              >
-                {g.import.button}
-              </button>
-              <button
-                onClick={handleSkipImport}
-                className="text-xs px-3 py-1 rounded-lg text-muted-foreground transition-colors hover:bg-muted"
-              >
-                {g.skip}
-              </button>
-            </div>
+        <div className="px-4 pb-3 animate-in fade-in slide-in-from-top-1 duration-150">
+          <div className="flex items-center gap-3 pl-6">
+            <p className="text-xs text-muted-foreground flex-1">{g.import.desc}</p>
+            <button
+              onClick={handleImportClick}
+              className="shrink-0 text-xs font-medium px-3 py-1.5 rounded-md bg-[var(--amber)] text-[var(--amber-foreground)] transition-all hover:opacity-90"
+            >
+              {g.import.button}
+            </button>
+            <button
+              onClick={handleSkipImport}
+              className="shrink-0 text-xs px-2 py-1 rounded-md text-muted-foreground/60 hover:text-muted-foreground hover:bg-muted transition-colors"
+            >
+              {g.skip}
+            </button>
           </div>
         </div>
       )}
 
-      {/* ── Step 2 expanded: AI verification ── */}
+      {/* ── Step 2 expanded ── */}
       {expanded === 'ai' && step1Done && !step2Done && (
-        <div className="px-5 pb-4 animate-in slide-in-from-top-2 duration-200">
-          <div className="rounded-lg border border-border bg-card p-4">
-            <p className="text-xs text-muted-foreground mb-3">
-              {g.ai.desc}
-            </p>
+        <div className="px-4 pb-3 animate-in fade-in slide-in-from-top-1 duration-150">
+          <div className="flex items-center gap-3 pl-6">
+            <p className="text-xs text-muted-foreground flex-1">{g.ai.desc}</p>
             <button
               onClick={handleStartAI}
-              className="text-xs font-medium px-4 py-2 rounded-lg transition-all hover:opacity-90"
-              style={{ background: 'var(--amber)', color: 'var(--amber-foreground)' }}
+              className="shrink-0 text-xs font-medium px-3 py-1.5 rounded-md bg-[var(--amber)] text-[var(--amber-foreground)] transition-all hover:opacity-90"
             >
-              {g.ai.cta} →
+              {g.ai.cta}
             </button>
           </div>
         </div>
       )}
 
-      {/* ── Step 3 expanded: Cross-agent prompt ── */}
+      {/* ── Step 3 expanded ── */}
       {expanded === 'agent' && showStep3 && (
-        <div className="px-5 pb-4 animate-in slide-in-from-top-2 duration-200">
-          <div className="rounded-lg border border-border bg-card p-4">
-            <p className="text-xs text-muted-foreground mb-3">
-              {g.agent.desc}
-            </p>
-            <div className="relative rounded-lg border border-border bg-muted/50 p-3 pr-16">
-              <p className="text-xs font-mono text-foreground leading-relaxed whitespace-pre-wrap">
+        <div className="px-4 pb-3 animate-in fade-in slide-in-from-top-1 duration-150">
+          <div className="pl-6">
+            <p className="text-xs text-muted-foreground mb-2">{g.agent.desc}</p>
+            <div className="relative rounded-md bg-muted/50 p-3 pr-20">
+              <p className="text-xs font-mono text-foreground/80 leading-relaxed whitespace-pre-wrap">
                 {g.agent.copyPrompt}
               </p>
               <button
                 onClick={handleCopyPrompt}
-                className="absolute top-2 right-2 flex items-center gap-1 text-2xs font-medium px-2.5 py-1.5 rounded-md border transition-all border-border bg-card text-muted-foreground hover:text-foreground hover:border-[var(--amber)]/30"
+                className="absolute top-2 right-2 flex items-center gap-1 text-2xs font-medium px-2 py-1 rounded-md bg-background border border-border/50 text-muted-foreground hover:text-foreground transition-colors"
               >
-                <Copy size={11} />
+                <Copy size={10} />
                 {g.agent.copy}
               </button>
             </div>
-            <div className="flex items-center justify-end mt-3 pt-3 border-t border-border">
+            <div className="flex justify-end mt-2">
               <button
                 onClick={handleStep3Done}
-                className="text-xs px-3 py-1 rounded-lg text-muted-foreground transition-colors hover:bg-muted"
+                className="text-xs px-2 py-1 rounded-md text-muted-foreground/60 hover:text-muted-foreground hover:bg-muted transition-colors"
               >
                 {g.skip}
               </button>
@@ -353,39 +338,3 @@ export default function GuideCard() {
     </div>
   );
 }
-
-function TaskCard({ icon, title, cta, done, active, dimmed, onClick }: {
-  icon: React.ReactNode;
-  title: string;
-  cta: string;
-  done: boolean;
-  active: boolean;
-  dimmed?: boolean;
-  onClick: () => void;
-}) {
-  return (
-    <button
-      onClick={onClick}
-      disabled={done || dimmed}
-      className={`
-        flex flex-col items-center gap-1.5 px-3 py-3 rounded-lg border text-center
-        transition-all duration-150
-        ${done ? 'opacity-60' : dimmed ? 'opacity-40 cursor-default' : 'hover:border-[var(--amber)]/30 hover:bg-muted/50 cursor-pointer'}
-        ${active ? 'border-[var(--amber)]/40 bg-muted/50' : ''}
-        ${done || active ? 'border-[var(--amber)]' : 'border-border'}
-      `}
-    >
-      <span className={`${done ? 'animate-in zoom-in-50 duration-300 text-success' : 'text-[var(--amber)]'}`}>
-        {done ? <Check size={16} /> : icon}
-      </span>
-      <span className="text-xs font-medium text-foreground">
-        {title}
-      </span>
-      {!done && !dimmed && (
-        <span className="text-2xs text-[var(--amber-text)]">
-          {cta} →
-        </span>
-      )}
-    </button>
-  );
-}