fix: resolve chat input pill and header clipping in glass container

Make brand-glass-container a flex column so the header banner and chat
content stack properly without overflowing. Use flex-1 + min-h-0 on the
layout wrapper so the chat area fills remaining space and can shrink
below its content size.

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

Author: GeneralJerel

apps/app/src/app/globals.css

@@ -302,6 +302,8 @@ body, html {
   box-shadow: var(--shadow-glass);
   flex: 1;
   overflow: hidden;
+  display: flex;
+  flex-direction: column;
 }
 
 @media (max-width: 768px) {

apps/app/src/components/example-layout/index.tsx

@@ -10,9 +10,9 @@ export function ExampleLayout({
   chatContent,
 }: ExampleLayoutProps) {
   return (
-    <div className="h-full flex flex-row">
+    <div className="flex-1 min-h-0 flex flex-row">
       {/* Chat Content */}
-      <div className="max-h-full overflow-y-auto flex-1 max-lg:px-4">
+      <div className="h-full flex-1 max-lg:px-4">
         {chatContent}
       </div>
     </div>