diff --git a/app/play/page.tsx b/app/play/page.tsx
index b1f1fa5..87936a6 100644
--- a/app/play/page.tsx
+++ b/app/play/page.tsx
@@ -25,7 +25,16 @@ export default function PlayPage() {
 
   const [resMap, setResMap] = useState(new Map());
   const [countMap, setCountMap] = useState(new Map());
-  const [filter, setFilter] = useState("all");
+  const [filter, setFilter] = useState(() => {
+    if (typeof window !== "undefined") {
+      return localStorage.getItem("mapFilter") || "all";
+    }
+    return "all";
+  });
+
+  useEffect(() => {
+    localStorage.setItem("mapFilter", filter);
+  }, [filter]);
 
   useEffect(() => {
     if (userMapResults && mapCountResults) {
@@ -69,6 +78,7 @@ export default function PlayPage() {
             type="single"
             variant="outline"
             className="w-max pb-4"
+            value={filter}
             onValueChange={(value) => setFilter(value)}
           >
             <ToggleGroupItem value="all">All</ToggleGroupItem>
@@ -96,6 +106,7 @@ export default function PlayPage() {
           type="single"
           variant="outline"
           className="w-max pb-4"
+          value={filter}
           onValueChange={(value) => setFilter(value)}
         >
           <ToggleGroupItem value="all">All</ToggleGroupItem>
@@ -106,7 +117,6 @@ export default function PlayPage() {
 
       <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
         {filteredMaps.map((map) => (
-          <Card key={map._id} className="flex flex-col h-full">
           <Card
             key={map._id}
             className={cn(