fix: resolve workbench final review findings

apps/web/src/features/workbench/channels/CustomLinkChannel.svelte

@@ -2,15 +2,24 @@
   import type { WorkbenchChannel } from '../types';
 
   export let channel: WorkbenchChannel;
+  let copyStatus = '';
 
-  function copyUrl() {
-    void navigator.clipboard?.writeText(channel.url ?? '');
+  async function copyUrl() {
+    try {
+      await navigator.clipboard?.writeText(channel.url ?? '');
+      copyStatus = 'URL copied.';
+    } catch {
+      copyStatus = 'Copy unavailable in this browser.';
+    }
   }
 </script>
 
 <section class="channel-page custom-link-channel">
   <header class="channel-header"><p>External resource</p><h1>{channel.title}</h1></header>
   <p>{channel.url}</p>
-  <a href={channel.url} target="_blank" rel="noreferrer">Open external channel</a>
-  <button type="button" on:click={copyUrl}>Copy URL</button>
+  <a class="custom-link" href={channel.url} target="_blank" rel="noreferrer">Open external channel</a>
+  <button class="copy-url-button" type="button" on:click={copyUrl}>Copy URL</button>
+  {#if copyStatus}
+    <p class="copy-feedback" aria-live="polite">{copyStatus}</p>
+  {/if}
 </section>

apps/web/src/features/workbench/channels/TasksChannel.svelte

@@ -4,18 +4,41 @@
   export let tasks: WorkTask[];
   export let onInspect: (item: InspectorItem) => void;
 
+  let taskStates: WorkTask[] = [];
+  let sourceTasks: WorkTask[] | undefined;
+
+  $: if (tasks !== sourceTasks) {
+    sourceTasks = tasks;
+    taskStates = tasks.map((task) => ({ ...task }));
+  }
+
   function inspectTask(task: WorkTask) {
     onInspect({ title: task.title, type: 'Task', description: task.summary, properties: [{ label: 'Status', value: task.completed ? 'Completed' : 'Open' }, { label: 'Owner', value: task.owner }, { label: 'Due', value: task.due }, { label: 'Tag', value: task.tag }] });
   }
+
+  function toggleTask(taskID: string) {
+    taskStates = taskStates.map((task) => task.id === taskID ? { ...task, completed: !task.completed } : task);
+  }
 </script>
 
 <section class="channel-page tasks-channel">
   <header class="channel-header"><p>Work Plan</p><h1>Tasks</h1></header>
   <div class="task-list">
-    {#each tasks as task}
+    {#each taskStates as task}
       <article class:completed={task.completed} class="task-card">
-        <span class="task-check" aria-hidden="true">{task.completed ? 'Done' : 'Open'}</span>
-        <div><h2>{task.title}</h2><p>{task.summary}</p><small>{task.owner} · {task.due} · #{task.tag}</small></div>
+        <input
+          class="task-check"
+          type="checkbox"
+          aria-label={`Mark ${task.title} complete`}
+          checked={task.completed}
+          on:change={() => toggleTask(task.id)}
+        />
+        <div>
+          <h2>{task.title}</h2>
+          <p>{task.summary}</p>
+          <small>{task.owner} / {task.due} / #{task.tag}</small>
+          <span class="task-status">{task.completed ? 'Completed' : 'Open'}</span>
+        </div>
         <button aria-label={`Inspect ${task.title}`} on:click={() => inspectTask(task)}>Inspect</button>
       </article>
     {/each}