form 1 topics added

app/page.tsx

@@ -35,6 +35,16 @@ const unitStyles = {
     unitCard: "border-[#a5b4fc] bg-[#eef2ff]",
     chip: "bg-[#3730a3]",
   },
+  "unit-7": {
+    tile: "from-[#4ade80] to-[#15803d]",
+    unitCard: "border-[#86efac] bg-[#f0fdf4]",
+    chip: "bg-[#15803d]",
+  },
+  "unit-8": {
+    tile: "from-[#fb7185] to-[#be123c]",
+    unitCard: "border-[#fda4af] bg-[#fff1f2]",
+    chip: "bg-[#be123c]",
+  },
 };
 
 const topicTiles = [
@@ -59,7 +69,7 @@ export default function Home() {
   return (
     <div className="playground-bg flex min-h-screen flex-col">
       <Header />
-      <main className="playground-frame mx-auto w-full max-w-6xl flex-1 px-3 pb-10 sm:px-5">
+      <main className="playground-frame mx-auto w-full max-w-7xl flex-1 px-3 pb-10 sm:px-5">
         <section className="mt-4 rounded-md border-2 border-[#1f50bf] bg-[#f1f6ff] p-4 sm:p-6">
           <p className="text-center text-sm font-bold text-[#26438b]">
             Interactive maths practice for secondary school students