feat: glassmorphism sidebar toggle (P5-3)

Settings → Appearance: "Glassmorphism Sidebar" toggle (off by default).
When enabled, applies backdrop-filter: blur(12px) and a semi-transparent
background to the left sidebar so chat background patterns show through.
SidebarGlass vanilla-extract class in Sidebar.css.ts; wired in
SidebarNav.tsx via classNames conditional.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/app/pages/client/SidebarNav.tsx

@@ -1,5 +1,6 @@
 import React, { useRef } from 'react';
 import { Scroll } from 'folds';
+import classNames from 'classnames';
 
 import {
   Sidebar,
@@ -7,6 +8,7 @@ import {
   SidebarStackSeparator,
   SidebarStack,
 } from '../../components/sidebar';
+import { SidebarGlass } from '../../components/sidebar/Sidebar.css';
 import {
   DirectTab,
   HomeTab,
@@ -19,12 +21,15 @@ import {
   BookmarksTab,
 } from './sidebar';
 import { CreateTab } from './sidebar/CreateTab';
+import { useSetting } from '../../state/hooks/settings';
+import { settingsAtom } from '../../state/settings';
 
 export function SidebarNav() {
   const scrollRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;
+  const [glassmorphismSidebar] = useSetting(settingsAtom, 'glassmorphismSidebar');
 
   return (
-    <Sidebar>
+    <Sidebar className={classNames(glassmorphismSidebar && SidebarGlass)}>
       <SidebarContent
         scrollable={
           <Scroll ref={scrollRef} variant="Background" size="0">