diff --git a/src/app/globals.css b/src/app/globals.css
index 769ee01..f76e68f 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -26,3 +26,11 @@ body {
   user-select: none;
   -webkit-tap-highlight-color: transparent;
 }
+
+.scrollbar-none {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+.scrollbar-none::-webkit-scrollbar {
+  display: none;
+}
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 411bfd4..8d519eb 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -3,7 +3,7 @@
 import { useState, useRef, useEffect, useCallback } from "react";
 import { useRouter } from "next/navigation";
 import { motion, AnimatePresence } from "framer-motion";
-import { Plus, LogIn, Utensils, Loader2, MapPin, Navigation, X, Users, Heart, Sparkles, ChevronRight } from "lucide-react";
+import { Plus, LogIn, Utensils, Loader2, MapPin, Navigation, X, Users, Heart, Sparkles, ChevronRight, Flame } from "lucide-react";
 import { getUserId } from "@/lib/userId";
 
 interface LocationSuggestion {
@@ -30,7 +30,7 @@ const PRICE_OPTIONS = [
   { label: "¥100+", value: "over100" },
 ] as const;
 
-const CUISINE_OPTIONS = ["不限", "火锅", "日料", "烧烤", "西餐", "川菜", "粤菜", "东南亚"] as const;
+const HOT_CUISINES = ["火锅", "日料", "烧烤", "西餐", "川菜", "咖啡甜品", "小吃快餐"] as const;
 
 function getLocation(): Promise<{ lat: number; lng: number }> {
   if (process.env.NODE_ENV === "development") {
@@ -66,7 +66,7 @@ export default function LandingPage() {
   const [fetchingSuggestions, setFetchingSuggestions] = useState(false);
   const [radius, setRadius] = useState(3000);
   const [priceRange, setPriceRange] = useState("any");
-  const [cuisine, setCuisine] = useState("不限");
+  const [cuisine, setCuisine] = useState("");
   const suggestRef = useRef<HTMLDivElement>(null);
   const debounceRef = useRef<ReturnType<typeof setTimeout>>(null);
 
@@ -198,11 +198,7 @@ export default function LandingPage() {
         animate={{ y: 0, opacity: 1 }}
         transition={{ duration: 0.5 }}
       >
-        <div className="flex h-16 w-16 items-center justify-center rounded-2xl bg-emerald-500 shadow-lg shadow-emerald-200">
-          <Utensils size={28} className="text-white" />
-        </div>
-
-        <h1 className="mt-5 text-3xl font-black tracking-tight text-zinc-900">
+        <h1 className="text-3xl font-black tracking-tight text-zinc-900">
           NoWhatever
         </h1>
         <p className="mt-0.5 text-sm font-medium tracking-widest text-zinc-400">
@@ -324,6 +320,50 @@ export default function LandingPage() {
         </div>
 
         <div className="flex flex-col gap-2 rounded-xl border border-zinc-100 bg-zinc-50/50 px-3 py-2.5">
+          <div className="flex items-center gap-3">
+            <span className="w-8 shrink-0 text-xs font-medium text-zinc-400">美食</span>
+            <div className="relative flex flex-1 items-center">
+              <input
+                type="text"
+                placeholder="想吃什么？（留空则不限）"
+                value={cuisine}
+                onChange={(e) => setCuisine(e.target.value)}
+                disabled={loading}
+                className="h-7 w-full rounded-full border-none bg-white pl-3 pr-7 text-xs text-zinc-700 outline-none ring-1 ring-zinc-200 transition-colors placeholder:text-zinc-300 focus:ring-2 focus:ring-emerald-300 disabled:opacity-50"
+              />
+              {cuisine && !loading && (
+                <button
+                  onClick={() => setCuisine("")}
+                  className="absolute right-2 flex h-4 w-4 items-center justify-center rounded-full text-zinc-400 hover:text-zinc-600"
+                >
+                  <X size={12} />
+                </button>
+              )}
+            </div>
+          </div>
+
+          <div className="flex items-center gap-3">
+            <span className="w-8 shrink-0 text-xs font-medium text-zinc-400"></span>
+            <div className="flex flex-wrap items-center gap-1.5">
+              <Flame size={11} className="shrink-0 text-orange-400" />
+              {HOT_CUISINES.map((tag) => (
+                <button
+                  key={tag}
+                  type="button"
+                  onClick={() => setCuisine(tag)}
+                  disabled={loading}
+                  className={`h-6 rounded-full px-2.5 text-xs font-medium transition-colors disabled:opacity-50 ${
+                    cuisine === tag
+                      ? "bg-emerald-500 text-white shadow-sm"
+                      : "bg-white text-zinc-500 hover:bg-zinc-200"
+                  }`}
+                >
+                  {tag}
+                </button>
+              ))}
+            </div>
+          </div>
+
           <div className="flex items-center gap-3">
             <span className="w-8 shrink-0 text-xs font-medium text-zinc-400">距离</span>
             <div className="flex gap-1.5">
@@ -366,26 +406,6 @@ export default function LandingPage() {
             </div>
           </div>
 
-          <div className="flex items-start gap-3">
-            <span className="w-8 shrink-0 pt-1.5 text-xs font-medium text-zinc-400">菜系</span>
-            <div className="flex flex-wrap gap-1.5">
-              {CUISINE_OPTIONS.map((opt) => (
-                <button
-                  key={opt}
-                  type="button"
-                  onClick={() => setCuisine(opt)}
-                  disabled={loading}
-                  className={`h-7 rounded-full px-3 text-xs font-medium transition-colors disabled:opacity-50 ${
-                    cuisine === opt
-                      ? "bg-emerald-500 text-white shadow-sm"
-                      : "bg-white text-zinc-500 hover:bg-zinc-200"
-                  }`}
-                >
-                  {opt}
-                </button>
-              ))}
-            </div>
-          </div>
         </div>
 
         <button