fix(map): align dark mode map styling

web/src/components/UserMemoMap/UserMemoMap.tsx

@@ -1,6 +1,5 @@
 import { timestampDate } from "@bufbuild/protobuf/wkt";
 import L, { DivIcon } from "leaflet";
-import "leaflet.markercluster/dist/MarkerCluster.Default.css";
 import "leaflet.markercluster/dist/MarkerCluster.css";
 import { ArrowUpRightIcon, MapPinIcon } from "lucide-react";
 import { useEffect, useMemo } from "react";
@@ -97,7 +96,7 @@ const UserMemoMap = ({ creator, className }: Props) => {
       <MapContainer
         center={defaultCenter}
         zoom={2}
-        className="h-full w-full z-0"
+        className="h-full w-full z-0 !bg-muted"
         scrollWheelZoom
         zoomControl={false}
         attributionControl={false}

web/src/components/map/LocationPicker.tsx

@@ -68,10 +68,9 @@ const GlassButton = ({ icon, onClick, ariaLabel, title }: GlassButtonProps) => {
       className={cn(
         "h-8 w-8 flex items-center justify-center rounded-lg",
         "cursor-pointer transition-all duration-200",
-        "bg-white/80 backdrop-blur-md border border-white/30 shadow-lg",
-        "hover:bg-white/90 hover:scale-105 active:scale-95",
-        "dark:bg-black/80 dark:border-white/10 dark:hover:bg-black/90",
-        "focus:outline-none focus:ring-2 focus:ring-blue-500",
+        "border border-border/80 bg-background/88 text-foreground shadow-sm backdrop-blur-md",
+        "hover:scale-105 hover:bg-background hover:shadow-md active:scale-95",
+        "focus:outline-none focus:ring-2 focus:ring-ring/60",
       )}
     >
       {icon}
@@ -213,7 +212,7 @@ const LeafletMap = (props: MapProps) => {
   return (
     <div className="memo-location-map relative isolate w-full overflow-hidden rounded-xl border border-border bg-background shadow-sm">
       <MapContainer
-        className="h-72 w-full"
+        className="h-72 w-full !bg-muted"
         center={position}
         zoom={13}
         scrollWheelZoom={false}