Flatten app layout with straight-line borders

Replace rounded card-style chrome (rounded-md/-lg, margin gaps) with
flush straight borders on the app shell and sidebar inset, matching
the static site's layout aesthetic. Bump sidebar top padding so the
first nav group sits lower below the header.

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

Author: bchapuis

apps/app/src/components/app-header.tsx

@@ -26,7 +26,7 @@ export function AppHeader() {
     "bg-neutral-300/50 hover:bg-neutral-300/50 dark:bg-neutral-600/50 dark:hover:bg-neutral-600/50";
 
   return (
-    <header className="flex h-12 shrink-0 items-center justify-between gap-2 ps-5 pe-3">
+    <header className="flex h-12 shrink-0 items-center justify-between gap-2 ps-5 pe-3 border-b">
       <div className="flex items-center gap-2">
         <Link to="/" className="flex items-center gap-2">
           <Bot className="h-6 w-6" />

apps/app/src/components/layouts/app-layout.tsx

@@ -39,7 +39,7 @@ export function AppLayout({ children, sidebar, className }: AppLayoutProps) {
           ) : (
             <div
               className={cn(
-                "relative flex w-full flex-1 flex-col border rounded-md mx-2 mb-2 bg-background overflow-auto",
+                "relative flex w-full flex-1 flex-col bg-background overflow-auto",
                 className
               )}
             >

apps/app/src/components/sidebar/nav-main.tsx

@@ -86,7 +86,7 @@ export function NavMain({ groups, footerItems }: NavMainProps) {
   const { toggleSidebar, open } = useSidebar();
 
   return (
-    <div className="flex-1 flex flex-col justify-between py-2 pb-0">
+    <div className="flex-1 flex flex-col justify-between pt-4 pb-0">
       <div className="flex flex-col gap-2 px-4">
         {groups.map((group, index) => (
           <SidebarGroup

apps/app/src/components/ui/sidebar.tsx

@@ -305,8 +305,7 @@ const SidebarInset = React.forwardRef<
     <main
       ref={ref}
       className={cn(
-        "relative flex w-full flex-1 flex-col border rounded-lg mr-2 mb-2 bg-background overflow-hidden",
-        "md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow",
+        "relative flex w-full flex-1 flex-col border-l bg-background overflow-hidden",
         className
       )}
       {...props}