diff --git a/components/Button.jsx b/components/Button.jsx
new file mode 100644
index 0000000..e538362
--- /dev/null
+++ b/components/Button.jsx
@@ -0,0 +1,15 @@
+import classNames from 'classnames';
+
+const Button = ({ children, className, ...props }) => (
+  <button
+    {...props}
+    class={classNames(
+      'inline-block text-xs font-medium leading-6 text-center uppercase transition rounded-lg ripple focus:outline-none',
+      className
+    )}
+  >
+    {children}
+  </button>
+);
+
+export default Button;
diff --git a/components/Content.jsx b/components/Content.jsx
index 533d4be..333945d 100644
--- a/components/Content.jsx
+++ b/components/Content.jsx
@@ -1,12 +1,15 @@
 import classNames from 'classnames';
 
-const Content = ({ className, visible, children }) => (
-  <div className={classNames(`h-full overflow-auto py-2 absolute top-0`, className, {
-    visible,
-    invisible: !visible
-  })}>
+const Content = ({ className, visible, children, ...props }) => (
+  <div
+    {...props}
+    className={classNames(`h-full w-full overflow-auto py-2 absolute top-0`, className, {
+      visible,
+      invisible: !visible,
+    })}
+  >
     {children}
   </div>
 );
 
-export default Content;
\ No newline at end of file
+export default Content;
diff --git a/components/EdgeDrag.jsx b/components/EdgeDrag.jsx
new file mode 100644
index 0000000..ab1512c
--- /dev/null
+++ b/components/EdgeDrag.jsx
@@ -0,0 +1,3 @@
+const EdgeDrag = () => null;
+
+export default EdgeDrag;
diff --git a/components/List.jsx b/components/List.jsx
new file mode 100644
index 0000000..af144c1
--- /dev/null
+++ b/components/List.jsx
@@ -0,0 +1,3 @@
+const List = ({ children, ...props }) => <div {...props}>{children}</div>;
+
+export default List;
diff --git a/components/ListItem.jsx b/components/ListItem.jsx
new file mode 100644
index 0000000..3f0e30e
--- /dev/null
+++ b/components/ListItem.jsx
@@ -0,0 +1,9 @@
+import classNames from 'classnames';
+
+const ListItem = ({ children, className, ...props }) => (
+  <div className={classNames('p-4', className)} {...props}>
+    {children}
+  </div>
+);
+
+export default ListItem;
diff --git a/components/Menu.jsx b/components/Menu.jsx
index d2e76e4..94bb6e2 100644
--- a/components/Menu.jsx
+++ b/components/Menu.jsx
@@ -4,7 +4,7 @@ import { useEffect, useLayoutEffect, useRef, useState } from 'react';
 
 import { useDrag } from 'react-use-gesture';
 
-const Menu = ({ open, onClose, children }) => {
+const Menu = ({ open, onClose, children, className, ...props }) => {
   const ref = useRef();
   const [x, setX] = useState(-100000);
   const [rect, setRect] = useState(null);
@@ -68,6 +68,7 @@ const Menu = ({ open, onClose, children }) => {
 
   return (
     <div
+      {...props}
       {...bind()}
       ref={ref}
       style={{
@@ -78,15 +79,10 @@ const Menu = ({ open, onClose, children }) => {
       }}
       className={classNames(
         'fixed z-40 transform transform-gpu translate w-48 h-full bg-gray-100',
+        className,
         {
           'transition-transform': !dragging,
         }
-        /*
-        {
-          '-translate-x-full': !open,
-          '-translate-x-0': open,
-        }
-        */
       )}
     >
       {children}
diff --git a/components/Modal.jsx b/components/Modal.jsx
index 1bb9cc0..c0bdf8a 100644
--- a/components/Modal.jsx
+++ b/components/Modal.jsx
@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import { useLayoutEffect, useRef, useState } from 'react';
+import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
 import { useDrag } from 'react-use-gesture';
 
 const Modal = ({ open, onClose, children }) => {
@@ -7,24 +7,46 @@ const Modal = ({ open, onClose, children }) => {
   const [dragging, setDragging] = useState(false);
   const [rect, setRect] = useState(null);
   const [y, setY] = useState(100000);
+  const [safeAreaTop, setSafeAreaTop] = useState(0);
 
+  const _open = useCallback(() => {
+    setY(safeAreaTop);
+  }, [safeAreaTop]);
+
+  const _close = useCallback(() => {
+    if (!rect) {
+      return;
+    }
+    setY(rect.height + safeAreaTop);
+  }, [safeAreaTop, rect]);
+
+  // Get pixel value of safe area insets
+  useEffect(() => {
+    const safeAreaTop = parseInt(
+      getComputedStyle(document.documentElement).getPropertyValue('--safe-area-top')
+    );
+    setSafeAreaTop(safeAreaTop);
+  }, []);
+
+  // Get the layout rectangle for the modal
   useLayoutEffect(() => {
     const rect = ref.current?.getBoundingClientRect();
     setRect(rect);
-    setY(-rect.width);
+    _close();
   }, []);
 
+  // If open changes, open/close the modal
   useLayoutEffect(() => {
     if (open) {
-      setY(0);
-    } else if (rect) {
-      setY(rect.height);
+      _open();
+    } else {
+      _close();
     }
-  }, [rect, open]);
+  }, [rect, open, _open, _close]);
 
   const bind = useDrag(
     ({ down, movement: [mx, my] }) => {
-      setY(my < 0 ? 0 : my);
+      setY(my < 0 ? safeAreaTop : my + safeAreaTop);
 
       if (down) {
         setDragging(true);
@@ -32,16 +54,16 @@ const Modal = ({ open, onClose, children }) => {
         setDragging(false);
       }
 
-      // If the drag ended, snap the menu back
+      // If the drag ended, snap the menu back open or close it
       if (!down) {
         const mid = rect.height;
         if (y > mid / 2) {
           // Close
-          setY(rect.height);
+          _close();
           onClose();
         } else {
           // Re-open
-          setY(0);
+          _open();
         }
       }
     },
@@ -55,13 +77,13 @@ const Modal = ({ open, onClose, children }) => {
       ref={ref}
       {...bind()}
       className={classNames(
-        'fixed z-40 top-5 transform transform-gpu ranslate w-full h-full bg-white rounded-t-lg',
+        'fixed z-40 top-5 transform transform-gpu ranslate w-full h-full bg-white rounded-t-xl',
         {
           'ease-in-out duration-300 transition-transformation': !dragging,
         }
       )}
       style={{
-        height: `calc(100% - 1.25rem)`,
+        height: `calc(100% - env(safe-area-inset-top, 0px) - 1.25rem)`,
         touchAction: 'pan-y',
         transform: `translateY(${y}px)`,
       }}
diff --git a/components/pages/Feed.jsx b/components/pages/Feed.jsx
new file mode 100644
index 0000000..7119ee5
--- /dev/null
+++ b/components/pages/Feed.jsx
@@ -0,0 +1,24 @@
+import Content from '../Content';
+
+import { Virtuoso } from 'react-virtuoso';
+import List from '../List';
+import ListItem from '../ListItem';
+
+const Feed = ({ selected }) => {
+  return (
+    <Content visible={selected} className="p-4">
+      <List className="h-full w-full">
+        {selected && (
+          <Virtuoso
+            totalCount={1000}
+            overscan={200}
+            style={{ height: '100%', width: '100%' }}
+            itemContent={index => <ListItem>Item {index}</ListItem>}
+          />
+        )}
+      </List>
+    </Content>
+  );
+};
+
+export default Feed;
diff --git a/components/pages/Profile.jsx b/components/pages/Profile.jsx
deleted file mode 100644
index efbb9c6..0000000
--- a/components/pages/Profile.jsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import { homeItems } from "../../data";
-import Content from "../Content";
-
-const Profile = ({ selected }) => {
-  return (
-    <Content visible={selected} className="p-4">
-      <h2>Profile</h2>
-    </Content>
-  )
-}
-
-export default Profile;
\ No newline at end of file
diff --git a/data/index.js b/data/index.js
index b06fcf2..aa465bc 100644
--- a/data/index.js
+++ b/data/index.js
@@ -44,4 +44,4 @@ export const homeItems = [
     author: 'Max',
     image: images[4],
   },
-];
\ No newline at end of file
+];
diff --git a/package-lock.json b/package-lock.json
index 0551263..0314f1a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -312,6 +312,19 @@
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.6.tgz",
       "integrity": "sha512-3c+yGKvVP5Y9TYBEibGNR+kLtijnj7mYrXRg+WpFb2X9xm04g/DXYkfg4hmzJQosc9snFNUPkbYIhu+KAm6jJw=="
     },
+    "@virtuoso.dev/react-urx": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/@virtuoso.dev/react-urx/-/react-urx-0.2.2.tgz",
+      "integrity": "sha512-PH2suwXIqFSbAfdkM6COQTRVqKVIC4DWUPPmZVTSWrdPJx6m45rxifAS91a5X3kl9RPaCWD0fBN0ztzWG6BdGQ==",
+      "requires": {
+        "@virtuoso.dev/urx": "^0.2.2"
+      }
+    },
+    "@virtuoso.dev/urx": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/@virtuoso.dev/urx/-/urx-0.2.2.tgz",
+      "integrity": "sha512-CbzbWVCtyG2XFSZ+X0K9jNjTpKI+p4dn61ZUM+cpKwCp2HK9jCRWchnOFovqvWqELoGP65TmGNNF06OjCDlk0A=="
+    },
     "@webassemblyjs/ast": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.9.0.tgz",
@@ -665,6 +678,11 @@
       "resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
       "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg="
     },
+    "asap": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
+      "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
+    },
     "asn1.js": {
       "version": "5.4.1",
       "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-5.4.1.tgz",
@@ -1372,6 +1390,11 @@
       "resolved": "https://registry.npmjs.org/copy-descriptor/-/copy-descriptor-0.1.1.tgz",
       "integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40="
     },
+    "core-js": {
+      "version": "3.8.1",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.8.1.tgz",
+      "integrity": "sha512-9Id2xHY1W7m8hCl8NkhQn5CufmF/WuR30BTRewvCXc1aZd3kMECwNZ69ndLbekKfakw9Rf2Xyc+QR6E7Gg+obg=="
+    },
     "core-util-is": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
@@ -3869,6 +3892,11 @@
         "sha.js": "^2.4.8"
       }
     },
+    "performance-now": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
+      "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
+    },
     "picomatch": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz",
@@ -4156,6 +4184,14 @@
       "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
       "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
     },
+    "promise": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/promise/-/promise-8.1.0.tgz",
+      "integrity": "sha512-W04AqnILOL/sPRXziNicCjSNRruLAuIHEOVBazepu0545DDNGYHz7ar9ZgZ1fMU8/MA4mVxp5rkBWRi6OXIy3Q==",
+      "requires": {
+        "asap": "~2.0.6"
+      }
+    },
     "promise-inflight": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/promise-inflight/-/promise-inflight-1.0.1.tgz",
@@ -4269,6 +4305,14 @@
       "resolved": "https://registry.npmjs.org/querystring-es3/-/querystring-es3-0.2.1.tgz",
       "integrity": "sha1-nsYfeQSYdXB9aUFFlv2Qek1xHnM="
     },
+    "raf": {
+      "version": "3.4.1",
+      "resolved": "https://registry.npmjs.org/raf/-/raf-3.4.1.tgz",
+      "integrity": "sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA==",
+      "requires": {
+        "performance-now": "^2.1.0"
+      }
+    },
     "randombytes": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@@ -4318,6 +4362,19 @@
         "object-assign": "^4.1.1"
       }
     },
+    "react-app-polyfill": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/react-app-polyfill/-/react-app-polyfill-1.0.6.tgz",
+      "integrity": "sha512-OfBnObtnGgLGfweORmdZbyEz+3dgVePQBb3zipiaDsMHV1NpWm0rDFYIVXFV/AK+x4VIIfWHhrdMIeoTLyRr2g==",
+      "requires": {
+        "core-js": "^3.5.0",
+        "object-assign": "^4.1.1",
+        "promise": "^8.0.3",
+        "raf": "^3.4.1",
+        "regenerator-runtime": "^0.13.3",
+        "whatwg-fetch": "^3.0.0"
+      }
+    },
     "react-dom": {
       "version": "17.0.1",
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.1.tgz",
@@ -4354,6 +4411,17 @@
       "integrity": "sha512-lpn39vmrDu/zB2bNx7rjaL0+Gjm17a9mzn53bX9IP4TIjMUxXlsB0IkiFj/B23F0vq1A9ozDLGHl2OaXkKJcBg==",
       "dev": true
     },
+    "react-virtuoso": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/react-virtuoso/-/react-virtuoso-1.1.1.tgz",
+      "integrity": "sha512-ljUxZQUdJtMpobTKL1hLHsJJSznAH5bupEuLFKxlA6gVSfayxnldNZyhRVdoZmHqfVvsaNwQETw246uernMdpw==",
+      "requires": {
+        "@virtuoso.dev/react-urx": "^0.2.0",
+        "@virtuoso.dev/urx": "^0.2.0",
+        "react-app-polyfill": "^1.0.6",
+        "resize-observer-polyfill": "^1.5.1"
+      }
+    },
     "readable-stream": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
@@ -4423,6 +4491,11 @@
       "resolved": "https://registry.npmjs.org/repeat-string/-/repeat-string-1.6.1.tgz",
       "integrity": "sha1-jcrkcOHIirwtYA//Sndihtp15jc="
     },
+    "resize-observer-polyfill": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
+      "integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
+    },
     "resolve": {
       "version": "1.19.0",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.19.0.tgz",
@@ -5996,6 +6069,11 @@
         "source-map": "~0.6.1"
       }
     },
+    "whatwg-fetch": {
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.5.0.tgz",
+      "integrity": "sha512-jXkLtsR42xhXg7akoDKvKWE40eJeI+2KZqcp2h3NsOrRnDvtWX36KcKl30dy+hxECivdk2BVUHVNrPtoMBUx6A=="
+    },
     "whatwg-url": {
       "version": "7.1.0",
       "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.1.0.tgz",
diff --git a/package.json b/package.json
index 637ffb0..ce7a190 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "postcss": "^8.2.1",
     "react": "17.0.1",
     "react-dom": "17.0.1",
+    "react-virtuoso": "^1.1.1",
     "tailwindcss": "^2.0.2"
   },
   "devDependencies": {
diff --git a/pages/index.js b/pages/index.js
index ecc53ba..c69d491 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -1,4 +1,8 @@
-import { useCallback, useState } from 'react';
+import { Virtuoso } from 'react-virtuoso';
+
+import { faces } from '../data';
+
+import Store from '../store';
 
 import App from '../components/App';
 import Backdrop from '../components/Backdrop';
@@ -6,20 +10,23 @@ import Menu from '../components/Menu';
 import Modal from '../components/Modal';
 import Nav from '../components/Nav';
 import Home from '../components/pages/Home';
-import Profile from '../components/pages/Profile';
+import Feed from '../components/pages/Feed';
 import Settings from '../components/pages/Settings';
 import Tab from '../components/Tab';
 import TabBar from '../components/TabBar';
-import Store from '../store';
+import List from '../components/List';
+import ListItem from '../components/ListItem';
+import { useState } from 'react';
+import Button from '../components/Button';
 
 const pages = [
   { id: 'home', title: 'Home', icon: 'home-outline', selectedIcon: 'home', component: Home },
   {
-    id: 'profile',
-    title: 'Profile',
-    icon: 'person-outline',
+    id: 'feed',
+    title: 'Feed',
+    icon: 'flash-outline',
     selectedIcon: 'person',
-    component: Profile,
+    component: Feed,
   },
   {
     id: 'settings',
@@ -64,9 +71,40 @@ const MenuContent = () => (
   </>
 );
 
+const FakeNotification = ({ i }) => (
+  <ListItem className="flex align-center">
+    <img
+      src={`/img/faces/image-${(i % 66) + 1}.png`}
+      alt="Notification"
+      className="block rounded-full w-8 h-8 mr-4"
+    />
+    <div className="flex-1">
+      <span className="p-0 m-0 align-middle">You have a new friend request</span>
+    </div>
+    <div>
+      <Button className="background-transparent px-1 py-1 text-green-400 text-lg">
+        <ion-icon name="checkmark-outline" />
+      </Button>
+      <Button className="background-transparent px-1 py-1 text-red-400 text-lg">
+        <ion-icon name="close-outline" />
+      </Button>
+    </div>
+  </ListItem>
+);
+
 const NotificationsContent = () => (
-  <div className="p-4">
-    <h2 className="text-xl">Notifications</h2>
+  <div className="w-full h-full flex flex-col">
+    <div className="p-4">
+      <h2 className="text-xl">Notifications</h2>
+    </div>
+    <List className="flex-1">
+      <Virtuoso
+        totalCount={1000}
+        overscan={200}
+        style={{ height: '100%', width: '100%' }}
+        itemContent={index => <FakeNotification i={index} />}
+      />
+    </List>
   </div>
 );
 
diff --git a/public/img/faces/image-1.png b/public/img/faces/image-1.png
new file mode 100644
index 0000000..655f3ee
Binary files /dev/null and b/public/img/faces/image-1.png differ
diff --git a/public/img/faces/image-10.png b/public/img/faces/image-10.png
new file mode 100644
index 0000000..9857da7
Binary files /dev/null and b/public/img/faces/image-10.png differ
diff --git a/public/img/faces/image-11.png b/public/img/faces/image-11.png
new file mode 100644
index 0000000..9aabe8b
Binary files /dev/null and b/public/img/faces/image-11.png differ
diff --git a/public/img/faces/image-12.png b/public/img/faces/image-12.png
new file mode 100644
index 0000000..56ad994
Binary files /dev/null and b/public/img/faces/image-12.png differ
diff --git a/public/img/faces/image-13.png b/public/img/faces/image-13.png
new file mode 100644
index 0000000..667fb8b
Binary files /dev/null and b/public/img/faces/image-13.png differ
diff --git a/public/img/faces/image-14.png b/public/img/faces/image-14.png
new file mode 100644
index 0000000..857c21a
Binary files /dev/null and b/public/img/faces/image-14.png differ
diff --git a/public/img/faces/image-15.png b/public/img/faces/image-15.png
new file mode 100644
index 0000000..ea45b13
Binary files /dev/null and b/public/img/faces/image-15.png differ
diff --git a/public/img/faces/image-16.png b/public/img/faces/image-16.png
new file mode 100644
index 0000000..7aa97f9
Binary files /dev/null and b/public/img/faces/image-16.png differ
diff --git a/public/img/faces/image-17.png b/public/img/faces/image-17.png
new file mode 100644
index 0000000..a90248b
Binary files /dev/null and b/public/img/faces/image-17.png differ
diff --git a/public/img/faces/image-18.png b/public/img/faces/image-18.png
new file mode 100644
index 0000000..3600f01
Binary files /dev/null and b/public/img/faces/image-18.png differ
diff --git a/public/img/faces/image-19.png b/public/img/faces/image-19.png
new file mode 100644
index 0000000..3ed71d7
Binary files /dev/null and b/public/img/faces/image-19.png differ
diff --git a/public/img/faces/image-2.png b/public/img/faces/image-2.png
new file mode 100644
index 0000000..9f3c22b
Binary files /dev/null and b/public/img/faces/image-2.png differ
diff --git a/public/img/faces/image-20.png b/public/img/faces/image-20.png
new file mode 100644
index 0000000..823f1fe
Binary files /dev/null and b/public/img/faces/image-20.png differ
diff --git a/public/img/faces/image-21.png b/public/img/faces/image-21.png
new file mode 100644
index 0000000..d700f7f
Binary files /dev/null and b/public/img/faces/image-21.png differ
diff --git a/public/img/faces/image-22.png b/public/img/faces/image-22.png
new file mode 100644
index 0000000..21b6fda
Binary files /dev/null and b/public/img/faces/image-22.png differ
diff --git a/public/img/faces/image-23.png b/public/img/faces/image-23.png
new file mode 100644
index 0000000..90735fc
Binary files /dev/null and b/public/img/faces/image-23.png differ
diff --git a/public/img/faces/image-24.png b/public/img/faces/image-24.png
new file mode 100644
index 0000000..88065f9
Binary files /dev/null and b/public/img/faces/image-24.png differ
diff --git a/public/img/faces/image-25.png b/public/img/faces/image-25.png
new file mode 100644
index 0000000..0b148c4
Binary files /dev/null and b/public/img/faces/image-25.png differ
diff --git a/public/img/faces/image-26.png b/public/img/faces/image-26.png
new file mode 100644
index 0000000..35a9ab4
Binary files /dev/null and b/public/img/faces/image-26.png differ
diff --git a/public/img/faces/image-27.png b/public/img/faces/image-27.png
new file mode 100644
index 0000000..2532068
Binary files /dev/null and b/public/img/faces/image-27.png differ
diff --git a/public/img/faces/image-28.png b/public/img/faces/image-28.png
new file mode 100644
index 0000000..f12729f
Binary files /dev/null and b/public/img/faces/image-28.png differ
diff --git a/public/img/faces/image-29.png b/public/img/faces/image-29.png
new file mode 100644
index 0000000..d27915b
Binary files /dev/null and b/public/img/faces/image-29.png differ
diff --git a/public/img/faces/image-3.png b/public/img/faces/image-3.png
new file mode 100644
index 0000000..43a14fd
Binary files /dev/null and b/public/img/faces/image-3.png differ
diff --git a/public/img/faces/image-30.png b/public/img/faces/image-30.png
new file mode 100644
index 0000000..2ca4564
Binary files /dev/null and b/public/img/faces/image-30.png differ
diff --git a/public/img/faces/image-31.png b/public/img/faces/image-31.png
new file mode 100644
index 0000000..da1ee9a
Binary files /dev/null and b/public/img/faces/image-31.png differ
diff --git a/public/img/faces/image-32.png b/public/img/faces/image-32.png
new file mode 100644
index 0000000..1dd3c80
Binary files /dev/null and b/public/img/faces/image-32.png differ
diff --git a/public/img/faces/image-33.png b/public/img/faces/image-33.png
new file mode 100644
index 0000000..0f41c0a
Binary files /dev/null and b/public/img/faces/image-33.png differ
diff --git a/public/img/faces/image-34.png b/public/img/faces/image-34.png
new file mode 100644
index 0000000..39940d3
Binary files /dev/null and b/public/img/faces/image-34.png differ
diff --git a/public/img/faces/image-35.png b/public/img/faces/image-35.png
new file mode 100644
index 0000000..dbee485
Binary files /dev/null and b/public/img/faces/image-35.png differ
diff --git a/public/img/faces/image-36.png b/public/img/faces/image-36.png
new file mode 100644
index 0000000..0bef76e
Binary files /dev/null and b/public/img/faces/image-36.png differ
diff --git a/public/img/faces/image-37.png b/public/img/faces/image-37.png
new file mode 100644
index 0000000..3bc567f
Binary files /dev/null and b/public/img/faces/image-37.png differ
diff --git a/public/img/faces/image-38.png b/public/img/faces/image-38.png
new file mode 100644
index 0000000..493f8db
Binary files /dev/null and b/public/img/faces/image-38.png differ
diff --git a/public/img/faces/image-39.png b/public/img/faces/image-39.png
new file mode 100644
index 0000000..ef6ff30
Binary files /dev/null and b/public/img/faces/image-39.png differ
diff --git a/public/img/faces/image-4.png b/public/img/faces/image-4.png
new file mode 100644
index 0000000..9756eab
Binary files /dev/null and b/public/img/faces/image-4.png differ
diff --git a/public/img/faces/image-40.png b/public/img/faces/image-40.png
new file mode 100644
index 0000000..cbf6346
Binary files /dev/null and b/public/img/faces/image-40.png differ
diff --git a/public/img/faces/image-41.png b/public/img/faces/image-41.png
new file mode 100644
index 0000000..6ad94eb
Binary files /dev/null and b/public/img/faces/image-41.png differ
diff --git a/public/img/faces/image-42.png b/public/img/faces/image-42.png
new file mode 100644
index 0000000..28f3868
Binary files /dev/null and b/public/img/faces/image-42.png differ
diff --git a/public/img/faces/image-43.png b/public/img/faces/image-43.png
new file mode 100644
index 0000000..88252d7
Binary files /dev/null and b/public/img/faces/image-43.png differ
diff --git a/public/img/faces/image-44.png b/public/img/faces/image-44.png
new file mode 100644
index 0000000..3f5bce0
Binary files /dev/null and b/public/img/faces/image-44.png differ
diff --git a/public/img/faces/image-45.png b/public/img/faces/image-45.png
new file mode 100644
index 0000000..4e689f7
Binary files /dev/null and b/public/img/faces/image-45.png differ
diff --git a/public/img/faces/image-46.png b/public/img/faces/image-46.png
new file mode 100644
index 0000000..83cac2f
Binary files /dev/null and b/public/img/faces/image-46.png differ
diff --git a/public/img/faces/image-47.png b/public/img/faces/image-47.png
new file mode 100644
index 0000000..cd06c97
Binary files /dev/null and b/public/img/faces/image-47.png differ
diff --git a/public/img/faces/image-48.png b/public/img/faces/image-48.png
new file mode 100644
index 0000000..b901a3a
Binary files /dev/null and b/public/img/faces/image-48.png differ
diff --git a/public/img/faces/image-49.png b/public/img/faces/image-49.png
new file mode 100644
index 0000000..a377c40
Binary files /dev/null and b/public/img/faces/image-49.png differ
diff --git a/public/img/faces/image-5.png b/public/img/faces/image-5.png
new file mode 100644
index 0000000..e76e51c
Binary files /dev/null and b/public/img/faces/image-5.png differ
diff --git a/public/img/faces/image-50.png b/public/img/faces/image-50.png
new file mode 100644
index 0000000..df42cfc
Binary files /dev/null and b/public/img/faces/image-50.png differ
diff --git a/public/img/faces/image-51.png b/public/img/faces/image-51.png
new file mode 100644
index 0000000..04af974
Binary files /dev/null and b/public/img/faces/image-51.png differ
diff --git a/public/img/faces/image-52.png b/public/img/faces/image-52.png
new file mode 100644
index 0000000..294f9cb
Binary files /dev/null and b/public/img/faces/image-52.png differ
diff --git a/public/img/faces/image-53.png b/public/img/faces/image-53.png
new file mode 100644
index 0000000..e3a0283
Binary files /dev/null and b/public/img/faces/image-53.png differ
diff --git a/public/img/faces/image-54.png b/public/img/faces/image-54.png
new file mode 100644
index 0000000..30d5de4
Binary files /dev/null and b/public/img/faces/image-54.png differ
diff --git a/public/img/faces/image-55.png b/public/img/faces/image-55.png
new file mode 100644
index 0000000..e1a4758
Binary files /dev/null and b/public/img/faces/image-55.png differ
diff --git a/public/img/faces/image-56.png b/public/img/faces/image-56.png
new file mode 100644
index 0000000..b43a77d
Binary files /dev/null and b/public/img/faces/image-56.png differ
diff --git a/public/img/faces/image-57.png b/public/img/faces/image-57.png
new file mode 100644
index 0000000..3ad1b93
Binary files /dev/null and b/public/img/faces/image-57.png differ
diff --git a/public/img/faces/image-58.png b/public/img/faces/image-58.png
new file mode 100644
index 0000000..bda44c7
Binary files /dev/null and b/public/img/faces/image-58.png differ
diff --git a/public/img/faces/image-59.png b/public/img/faces/image-59.png
new file mode 100644
index 0000000..31cdbb7
Binary files /dev/null and b/public/img/faces/image-59.png differ
diff --git a/public/img/faces/image-6.png b/public/img/faces/image-6.png
new file mode 100644
index 0000000..2bb7a1f
Binary files /dev/null and b/public/img/faces/image-6.png differ
diff --git a/public/img/faces/image-60.png b/public/img/faces/image-60.png
new file mode 100644
index 0000000..e7745a2
Binary files /dev/null and b/public/img/faces/image-60.png differ
diff --git a/public/img/faces/image-61.png b/public/img/faces/image-61.png
new file mode 100644
index 0000000..9f280f5
Binary files /dev/null and b/public/img/faces/image-61.png differ
diff --git a/public/img/faces/image-62.png b/public/img/faces/image-62.png
new file mode 100644
index 0000000..28f182e
Binary files /dev/null and b/public/img/faces/image-62.png differ
diff --git a/public/img/faces/image-63.png b/public/img/faces/image-63.png
new file mode 100644
index 0000000..a7c5d93
Binary files /dev/null and b/public/img/faces/image-63.png differ
diff --git a/public/img/faces/image-64.png b/public/img/faces/image-64.png
new file mode 100644
index 0000000..e72e58f
Binary files /dev/null and b/public/img/faces/image-64.png differ
diff --git a/public/img/faces/image-65.png b/public/img/faces/image-65.png
new file mode 100644
index 0000000..6165416
Binary files /dev/null and b/public/img/faces/image-65.png differ
diff --git a/public/img/faces/image-66.png b/public/img/faces/image-66.png
new file mode 100644
index 0000000..905cecd
Binary files /dev/null and b/public/img/faces/image-66.png differ
diff --git a/public/img/faces/image-7.png b/public/img/faces/image-7.png
new file mode 100644
index 0000000..5e555c8
Binary files /dev/null and b/public/img/faces/image-7.png differ
diff --git a/public/img/faces/image-8.png b/public/img/faces/image-8.png
new file mode 100644
index 0000000..b202d7c
Binary files /dev/null and b/public/img/faces/image-8.png differ
diff --git a/public/img/faces/image-9.png b/public/img/faces/image-9.png
new file mode 100644
index 0000000..a38624d
Binary files /dev/null and b/public/img/faces/image-9.png differ
diff --git a/styles/global.css b/styles/global.css
index 70805ef..6545650 100644
--- a/styles/global.css
+++ b/styles/global.css
@@ -1,3 +1,7 @@
+:root {
+  --safe-area-top: env(safe-area-inset-top, 0);
+  --safe-area-bottom: env(safe-area-inset-bottom, 0);
+}
 body {
   overflow: hidden;
   height: 100vh;