Выравнивание UI с vps-tracker: тема b2fA, ReUI DataGrid и shell

Синхронизированы тема и layout (ModeToggle, sticky header), списки переведены на DataGridCard, дашборд на компактные SectionCards.

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/web/src/components/layout/site-header.tsx

@@ -8,7 +8,8 @@ import {
   BreadcrumbPage,
   BreadcrumbSeparator,
 } from '@cfdm/ui/components/breadcrumb'
-import { AppSeparator } from '@/components/app-separator'
+import { ModeToggle } from '@/components/mode-toggle'
+import { Separator } from '@cfdm/ui/components/separator'
 import { SidebarTrigger } from '@cfdm/ui/components/sidebar'
 
 export interface RouteBreadcrumbLoaderData {
@@ -83,14 +84,10 @@ export function SiteHeader() {
   const crumbs = getBreadcrumbs(pathname, dynamicLabels)
 
   return (
-    <header className="flex h-16 shrink-0 items-center gap-2 border-b transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12">
-      <div className="flex items-center gap-2 px-4">
-        <SidebarTrigger className="-ml-1" />
-        <AppSeparator
-          orientation="vertical"
-          className="mr-2 data-[orientation=vertical]:h-4"
-        />
-        <Breadcrumb>
+    <header className="sticky top-0 z-10 flex h-16 shrink-0 items-center gap-2 border-b bg-background/95 px-4 backdrop-blur supports-[backdrop-filter]:bg-background/80">
+      <SidebarTrigger className="-ml-1" />
+      <Separator orientation="vertical" className="mr-2 data-[orientation=vertical]:h-4" />
+      <Breadcrumb>
           <BreadcrumbList>
             {crumbs.map((crumb, index) => {
               const isLast = index === crumbs.length - 1
@@ -115,6 +112,8 @@ export function SiteHeader() {
             })}
           </BreadcrumbList>
         </Breadcrumb>
+      <div className="ml-auto flex items-center gap-2">
+        <ModeToggle />
       </div>
     </header>
   )