fix(design): unify messages canvas, keep only app nav elevated

On the Messages page three surfaces collided: the channel list column
and the channel header bar both used bg-card (lighter surface), while
the content area above and below used bg-background (deep). That made
the page read as a sandwich of alternating tones.

Route ChannelSidebar and ChannelHeader through bg-background so the
entire Messages canvas — title bar, channel list, header bar, and
conversation pane — shares the deep kami surface. The left app
SidebarView continues to use bg-card as the single elevated island,
preserving the apple-style "one navigation column floats on the
canvas" hierarchy.

Borders (border-r / border-b on those two panels) already provide the
structural separation, so no shadow is needed — consistent with kami's
rule 8 (ring or whisper shadow only).

Typecheck and build:verify clean.

src/renderer/components/communication/ChannelHeader.tsx

@@ -47,7 +47,7 @@ export function ChannelHeader({
   const t = useT()
 
   return (
-    <div className="flex items-center gap-3 border-b border-border bg-card px-4 py-2.5">
+    <div className="flex items-center gap-3 border-b border-border bg-background px-4 py-2.5">
       {!showSidebar ? (
         <button
           type="button"

src/renderer/components/communication/ChannelSidebar.tsx

@@ -105,7 +105,7 @@ export function ChannelSidebar({
       animate={{ width: 260, opacity: 1 }}
       exit={{ width: 0, opacity: 0 }}
       transition={{ duration: 0.2 }}
-      className="flex h-full shrink-0 flex-col overflow-hidden border-r border-border bg-card"
+      className="flex h-full shrink-0 flex-col overflow-hidden border-r border-border bg-background"
       style={{ width: 260 }}
     >
       <div className="flex-1 overflow-y-auto px-2 py-3">