fix(rectification): show mobile natal board as a covering bottom sheet

BUG-330: the compact board sat in the same layer as the composer, so peek copy overlapped the sheet title. Overlay only below 768px; desktop stays a side column.
Co-authored-by: Cursor <cursoragent@cursor.com>

frontend/src/components/rectification-agentic-chat.tsx

@@ -266,17 +266,15 @@ export function RectificationAgenticChat(props: RectificationAgenticChatProps) {
   const boardTitleId = useId();
 
   useLayoutEffect(() => {
-    const node = workspace.current;
-    if (!node) return;
+    const query = window.matchMedia(`(max-width: ${RECTIFICATION_BOARD_SPLIT_MIN_PX - 1}px)`);
     const update = () => {
-      const nextCompact = node.clientWidth < RECTIFICATION_BOARD_SPLIT_MIN_PX;
+      const nextCompact = query.matches;
       setCompactBoard(nextCompact);
       if (!nextCompact) setBoardOpen(false);
     };
     update();
-    const observer = new ResizeObserver(update);
-    observer.observe(node);
-    return () => observer.disconnect();
+    query.addEventListener("change", update);
+    return () => query.removeEventListener("change", update);
   }, []);
 
   useEffect(() => {
@@ -689,7 +687,7 @@ export function RectificationAgenticChat(props: RectificationAgenticChatProps) {
       ref={workspace}
       className={`rectification-workspace${compactBoard ? " is-compact" : ""}${boardOpen ? " is-board-open" : ""}`}
     >
-      <div className="rectification-workspace__chat">
+      <div className="rectification-workspace__chat" inert={compactBoard && boardOpen ? true : undefined}>
         <section ref={conversation} className="conversation is-rectification" aria-label="生时校正对话" aria-busy={busy || regeneratingMessageKey !== null}>
           <div className="message-list">
           {pendingConsultationQuestion?.trim() && (