refactor: charcoal palette + sidebar drawer fixes

- Switch from true-dark to charcoal palette (sidebar darkest, content lighter)
  Page #1a1c23, Sidebar #10121a, Card #22252e, Border #2e3240
- Update all Tailwind semantic mappings to match new palette
- Update landing page CSS hardcoded hex to new palette values
- Fix remaining hardcoded hex in SurveyResponsesPage, SessionsPanel, FlowPilotMessageBar
- Sidebar drawer starts below topbar (top: var(--topbar-h)) instead of viewport top
- Drawer section title uses amber (#fbbf24) for visual pop
- Unify all rail icons: white when inactive, cyan with bg-accent-dim when active

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

frontend/src/components/dashboard/SessionsPanel.tsx

@@ -28,7 +28,7 @@ export function SessionsPanel({ sessions, delay = 200 }: SessionsPanelProps) {
           View All
         </Link>
       </div>
-      <div className="divide-y divide-[#1e2130]">
+      <div className="divide-y divide-border">
         {sessions.map(session => (
           <Link
             key={session.id}

frontend/src/components/flowpilot/FlowPilotMessageBar.tsx

@@ -51,7 +51,7 @@ export function FlowPilotMessageBar({ onRespond, disabled = false, isProcessing
             ? 'border-border/50 opacity-50'
             : 'border-border focus-within:border-[rgba(6,182,212,0.3)]'
         )}
-        style={{ background: '#14161d' }}
+        style={{ background: 'var(--color-bg-card)' }}
       >
         <textarea
           ref={textareaRef}

frontend/src/components/layout/Sidebar.tsx

@@ -243,9 +243,6 @@ export function Sidebar() {
     const Icon = item.icon
     const hasChildren = item.children && item.children.length > 0
 
-    // Home icon: always cyan icon, but only bg-accent-dim when route is exactly "/"
-    const isHome = item.href === '/' && item.shortLabel === 'Home'
-
     return (
       <div
         key={key}
@@ -258,18 +255,14 @@ export function Sidebar() {
           onFocus={() => hasChildren && !sidebarPinned ? openFlyout(key) : undefined}
           className={cn(
             'group relative flex flex-col items-center justify-center rounded-lg px-2 py-3 transition-all duration-150',
-            isHome
-              ? active
-                ? 'bg-accent-dim text-accent-text'
-                : 'text-accent-text'
-              : active
-                ? 'bg-accent-dim text-accent-text'
-                : 'text-text-rail-label hover:text-muted-foreground'
+            active
+              ? 'bg-accent-dim text-accent-text'
+              : 'text-text-rail-label hover:text-foreground'
           )}
           title={item.label}
         >
           <span className="relative">
-            <Icon size={24} strokeWidth={1.6} className={active || isHome ? 'opacity-100' : 'opacity-60 group-hover:opacity-85'} />
+            <Icon size={24} strokeWidth={1.6} className={active ? 'opacity-100' : 'opacity-60 group-hover:opacity-85'} />
             {item.badge !== undefined && item.badge > 0 && (
               <span className="absolute -right-2 -top-1.5 flex h-4 min-w-[16px] items-center justify-center rounded-full bg-primary px-1 text-[0.5rem] font-bold text-background">
                 {item.badge > 99 ? '99+' : item.badge}
@@ -448,8 +441,8 @@ export function Sidebar() {
       {/* Drawer panel — fixed position, full height, resizable, overlays main content */}
       {activeFlyoutGroup && activeFlyoutGroup.children && (
         <div
-          className="fixed top-0 bottom-0 z-50 flex"
-          style={{ left: '72px' }}
+          className="fixed bottom-0 z-50 flex"
+          style={{ top: 'var(--topbar-h)', left: '72px' }}
           onMouseEnter={keepFlyout}
           onMouseLeave={closeFlyout}
         >
@@ -464,7 +457,7 @@ export function Sidebar() {
           >
             {/* Drawer header */}
             <div className="px-3 mb-3">
-              <h3 className="text-[0.6875rem] font-mono uppercase tracking-[0.12em] text-text-muted">
+              <h3 className="text-[0.6875rem] font-mono uppercase tracking-[0.12em] text-[#fbbf24]">
                 {activeFlyoutGroup.label}
               </h3>
             </div>