Confirm before Reset, and rewrite the docs for the new UI

Reset is destructive in a way its name does not advertise:
rebuild_project_container deletes both project volumes, so it wipes the
claude login, anything installed in the container, and every saved
session transcript. It was a single unconfirmed click in the overflow
menu, while the comparably destructive Remove already confirmed. Adds
ConfirmResetModal, which names each loss and says explicitly that the
host-side mounted folders are untouched.

Docs: the user guides still described the pre-Project-Home UI. Sixteen
factually wrong statements corrected, including "expand the Config
panel" (six sites), the actions table (Reset and Remove are in an
overflow menu, Files is a tab), a progress modal that no longer exists,
a double-click-to-rename gesture ProjectRow never had, the Full
Permissions boolean, an incomplete reserved-env list, and the claim in
TECHNICAL.md that OAuth tokens survive a Reset. Both layout diagrams and
the project tree were rebuilt from the filesystem.

New sections cover permission modes with the exact CLI mapping, Project
Home, Sessions, capability tiles, Automation, shared authentication, the
Auth Bridge and its security posture, and keyboard shortcuts.

Known gap recorded rather than papered over: the Automation tab manages
existing scheduled tasks but cannot create them — no add command is
registered — so task creation remains `triple-c-scheduler add` in the
terminal.

87 frontend tests, 34 Rust tests, both builds clean.

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

app/src/components/projects/ConfirmResetModal.test.tsx

@@ -0,0 +1,57 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
+import { render, screen, fireEvent, act } from "@testing-library/react";
+import ConfirmResetModal from "./ConfirmResetModal";
+
+/** Modal focuses via rAF so the panel is laid out first; jsdom needs a flush. */
+async function flushFocus() {
+  await act(async () => {
+    vi.advanceTimersByTime(20);
+  });
+}
+
+describe("ConfirmResetModal", () => {
+  beforeEach(() => {
+    vi.useFakeTimers({ toFake: ["requestAnimationFrame", "setTimeout"] });
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  async function renderModal() {
+    const onConfirm = vi.fn();
+    const onCancel = vi.fn();
+    render(
+      <ConfirmResetModal
+        projectName="api-server"
+        onConfirm={onConfirm}
+        onCancel={onCancel}
+      />,
+    );
+    await flushFocus();
+    return { onConfirm, onCancel };
+  }
+
+  it("names what will be lost rather than just asking to confirm", async () => {
+    await renderModal();
+    // The whole point of the gate: Reset deletes the volumes, and the two
+    // losses users do not expect are the login and the session transcripts.
+    expect(screen.getByText(/sign in again/i)).toBeInTheDocument();
+    expect(screen.getByText(/session transcript/i)).toBeInTheDocument();
+    // And it must say what is safe, or the warning reads as "you lose everything".
+    expect(screen.getByText(/mounted project folders/i)).toBeInTheDocument();
+  });
+
+  it("does not reset until confirmed", async () => {
+    const { onConfirm, onCancel } = await renderModal();
+    fireEvent.click(screen.getByRole("button", { name: "Cancel" }));
+    expect(onCancel).toHaveBeenCalledTimes(1);
+    expect(onConfirm).not.toHaveBeenCalled();
+  });
+
+  it("resets on confirm", async () => {
+    const { onConfirm } = await renderModal();
+    fireEvent.click(screen.getByRole("button", { name: "Reset container" }));
+    expect(onConfirm).toHaveBeenCalledTimes(1);
+  });
+});

app/src/components/projects/ConfirmResetModal.tsx

@@ -0,0 +1,66 @@
+import Modal from "../ui/Modal";
+import Button from "../ui/Button";
+
+interface Props {
+  projectName: string;
+  onConfirm: () => void;
+  onCancel: () => void;
+}
+
+/**
+ * Reset is destructive in a way its name does not advertise.
+ *
+ * `rebuild_project_container` calls `remove_project_volumes`, which deletes
+ * both `triple-c-home-{id}` and `triple-c-claude-config-{id}` — so the OAuth
+ * login, any skills or agents installed in the container, and every session
+ * transcript go with them. That is intentional (Reset exists to get back to a
+ * clean base image), but it is not recoverable, so it gets the same
+ * confirmation gate as Remove.
+ */
+export default function ConfirmResetModal({ projectName, onConfirm, onCancel }: Props) {
+  return (
+    <Modal
+      title="Reset container"
+      onClose={onCancel}
+      widthClassName="w-[28rem]"
+      footer={
+        <>
+          <Button size="md" variant="ghost" onClick={onCancel}>
+            Cancel
+          </Button>
+          <Button
+            size="md"
+            onClick={onConfirm}
+            className="bg-[var(--error-emphasis)] text-white border border-transparent hover:opacity-90"
+          >
+            Reset container
+          </Button>
+        </>
+      }
+    >
+      <div className="space-y-2.5 text-[13px] text-[var(--text-secondary)]">
+        <p>
+          Rebuild{" "}
+          <strong className="text-[var(--text-primary)]">{projectName}</strong>&rsquo;s
+          container from the clean base image.
+        </p>
+        <p>
+          This deletes the container&rsquo;s volumes, which means you will lose:
+        </p>
+        <ul className="list-disc pl-5 space-y-1">
+          <li>
+            your <code className="font-mono">claude login</code> &mdash; you will need to
+            sign in again
+          </li>
+          <li>any skills, agents or plugins installed inside the container</li>
+          <li>every saved session transcript, so past sessions cannot be resumed</li>
+          <li>anything installed with <code className="font-mono">apt</code>, <code className="font-mono">pip</code> or <code className="font-mono">npm</code></li>
+        </ul>
+        <p>
+          Your mounted project folders are on the host and are{" "}
+          <strong className="text-[var(--text-primary)]">not</strong> affected.
+        </p>
+      </div>
+    </Modal>
+  );
+}

app/src/components/projects/home/ProjectHome.tsx

@@ -8,6 +8,7 @@ import { ProjectStatusIndicator } from "../../ui/StatusIndicator";
 import Button from "../../ui/Button";
 import OverflowMenu from "../../ui/OverflowMenu";
 import ConfirmRemoveModal from "../ConfirmRemoveModal";
+import ConfirmResetModal from "../ConfirmResetModal";
 import OverviewTab from "./OverviewTab";
 import SessionsTab from "./SessionsTab";
 import AutomationTab from "./AutomationTab";
@@ -39,6 +40,7 @@ export default function ProjectHome({ projectId, active }: Props) {
   const project = projects.find((p) => p.id === projectId);
   const [tab, setTab] = useState<ProjectHomeTabId>("overview");
   const [confirmRemove, setConfirmRemove] = useState(false);
+  const [confirmReset, setConfirmReset] = useState(false);
   const { runningSince, progress } = useAppState(
     useShallow((s) => ({
       runningSince: s.runningSince[projectId],
@@ -144,9 +146,10 @@ export default function ProjectHome({ projectId, active }: Props) {
                   disabled: actions.backingUp || !project.container_id,
                 },
                 {
-                  label: "Reset container",
-                  onSelect: actions.handleReset,
+                  label: "Reset container…",
+                  onSelect: () => setConfirmReset(true),
                   disabled: !isStopped || actions.busy,
+                  danger: true,
                 },
                 {
                   label: "Remove project…",
@@ -205,6 +208,16 @@ export default function ProjectHome({ projectId, active }: Props) {
         {tab === "files" && <FilesTab project={project} />}
       </div>
 
+      {confirmReset && (
+        <ConfirmResetModal
+          projectName={project.name}
+          onCancel={() => setConfirmReset(false)}
+          onConfirm={() => {
+            setConfirmReset(false);
+            actions.handleReset();
+          }}
+        />
+      )}
       {confirmRemove && (
         <ConfirmRemoveModal
           projectName={project.name}