fix: landing, geolocation, and description card

* feat: add step-specific DescriptionCard instructions before user input

Each flow page shows English guidance in muted instruction mode until the user makes a selection, then switches to dynamic summary copy.

Co-authored-by: Cursor <cursoragent@cursor.com>

* feat: polish route page, map geolocation, and landing artwork

Replace landing growth SVGs with flow artwork, align Start Creating with FlowContinueBar, and search nearby florists from the user's current location.

Co-authored-by: Cursor <cursoragent@cursor.com>

---------

Co-authored-by: 이지은 <ijieun@ijieun-ui-MacBookPro.local>
Co-authored-by: Cursor <cursoragent@cursor.com>

src/lib/components/ui/Artwork/Artwork.svelte

@@ -7,6 +7,8 @@
 	let {
 		title = 'Title',
 		description = 'Description Description Description',
+		/** @type {'instruction' | 'summary'} */
+		cardMode = 'summary',
 		/** @type {import('./artworkVariants.js').ArtworkVariant} */
 		variant = 'create1',
 		/** edit Continue 이후 확정된 꽃다발만 전달 (그 전에는 null → Vase) */
@@ -42,7 +44,7 @@
 		</div>
 
 		<div class="min-w-0 shrink-0 lg:w-full lg:flex lg:justify-center">
-			<DescriptionCard {title} {description} />
+			<DescriptionCard {title} {description} mode={cardMode} />
 		</div>
 	</div>
 	{#if comingSoon}

src/lib/components/ui/Artwork/DescriptionCard.svelte

@@ -1,8 +1,24 @@
 <script>
-	let { title = 'Title', description = 'Description Description Description' } = $props();
+	let {
+		title = 'Title',
+		description = 'Description Description Description',
+		/** instruction: 입력 전 안내 톤 (muted) */
+		mode = 'summary'
+	} = $props();
 </script>
 
 <div class="w-64 max-w-full flex-none border border-line-strong bg-white px-4 py-3 shadow-sm lg:px-6 lg:py-5">
-	<h3 class="text-sm leading-snug font-semibold">{title}</h3>
-	<p class="mt-2 text-xs leading-relaxed">{description}</p>
+	<h3
+		class={['text-sm leading-snug font-semibold', mode === 'instruction' ? 'text-muted' : 'text-ink']}
+	>
+		{title}
+	</h3>
+	<p
+		class={[
+			'mt-2 text-xs',
+			mode === 'instruction' ? 'leading-snug text-muted' : 'leading-relaxed text-ink'
+		]}
+	>
+		{description}
+	</p>
 </div>

src/lib/components/ui/landing/LandingHero.svelte

@@ -1,7 +1,9 @@
 <script>
 	import { goto } from '$app/navigation';
 	import { resolve } from '$app/paths';
-	import Button from '$lib/components/ui/Button.svelte';
+	import FlowContinueBar, {
+		FLOW_CONTINUE_BUTTON
+	} from '$lib/components/ui/FlowContinueBar.svelte';
 	import GrowthMetaphorIllustration from '$lib/components/ui/landing/GrowthMetaphorIllustration.svelte';
 
 	function handleStart() {
@@ -10,7 +12,7 @@
 </script>
 
 <section
-	class="relative flex min-h-dvh flex-col bg-surface px-6 py-8 font-sans text-ink sm:px-10 sm:py-10 lg:px-14"
+	class="relative flex min-h-dvh flex-col bg-surface px-6 py-8 pb-[3.75rem] font-sans text-ink sm:px-10 sm:py-10 lg:px-14 lg:pb-8"
 	aria-label="Every bouquet starts with a muse — seed to bouquet growth metaphor"
 >
 	<div class="mx-auto flex w-full max-w-6xl min-h-0 flex-1 flex-col justify-center">
@@ -21,16 +23,20 @@
 		</p>
 	</div>
 
-	<div class="mx-auto flex w-full max-w-6xl items-end justify-between gap-6 pb-2 pt-10">
-		<div class="min-w-0 text-left">
-			<p class="text-lg leading-none tracking-wide text-ink">AI Florist</p>
-			<h1 class="mt-2 text-4xl leading-none font-bold tracking-wide sm:text-5xl lg:text-6xl">
-				DearYou
-			</h1>
-		</div>
-
-		<div class="shrink-0 pb-1">
-			<Button onclick={handleStart}>start creating</Button>
-		</div>
+	<div class="mx-auto w-full max-w-6xl pt-10 pb-2">
+		<p class="text-lg leading-none tracking-wide text-ink">AI Florist</p>
+		<h1 class="mt-2 text-4xl leading-none font-bold tracking-wide sm:text-5xl lg:text-6xl">
+			Fleumuse
+		</h1>
 	</div>
+
+	<!--
+		create 등 플로우 페이지 FlowContinueBar와 동일 위치:
+		mobile — 하단 고정 / desktop — 우측 56% 패널 하단 오른쪽
+	-->
+	<FlowContinueBar class="lg:!fixed lg:top-auto lg:right-0 lg:bottom-8 lg:left-[44%]">
+		<button type="button" onclick={handleStart} class={FLOW_CONTINUE_BUTTON}>
+			Start Creating ->
+		</button>
+	</FlowContinueBar>
 </section>

src/lib/components/ui/map/MapPanel.svelte

@@ -2,6 +2,7 @@
 	import FloristOrderMessage from './FloristOrderMessage.svelte';
 	import KakaoMap from './KakaoMap.svelte';
 	import ShopList from './ShopList.svelte';
+	import { DEFAULT_MAP_CENTER } from '$lib/map/userLocation.js';
 
 	let {
 		shops = [],
@@ -12,14 +13,14 @@
 		fitBounds = false,
 		orderPlainText = '',
 		orderKoPlainText = '',
+		initialLat = DEFAULT_MAP_CENTER.lat,
+		initialLng = DEFAULT_MAP_CENTER.lng,
+		locationNotice = '',
 		onrefresh
 	} = $props();
 
-	const DEFAULT_LAT = 37.5665;
-	const DEFAULT_LNG = 126.978;
-
-	let mapCenterLat = $state(DEFAULT_LAT);
-	let mapCenterLng = $state(DEFAULT_LNG);
+	let mapCenterLat = $state(initialLat);
+	let mapCenterLng = $state(initialLng);
 	let panTarget = $state(null);
 
 	function handleCenterChange(lat, lng) {
@@ -46,6 +47,9 @@
 			Find a nearby florist
 		</h1>
 		<p class="mt-3 text-sm text-muted">Move the map, then refresh to search this area.</p>
+		{#if locationNotice}
+			<p class="mt-2 text-xs text-muted">{locationNotice}</p>
+		{/if}
 		{#if mock}
 			<p class="mt-2 text-xs text-muted">Showing sample shops (no Kakao API key).</p>
 		{/if}
@@ -63,8 +67,8 @@
 	<div class="flex min-h-0 flex-1 flex-col gap-6 px-6 pb-8 md:px-10 lg:flex-row lg:px-12 lg:pb-10">
 		<div class="relative flex min-h-64 flex-1 flex-col overflow-hidden border border-line lg:min-h-0">
 			<KakaoMap
-				initialLat={DEFAULT_LAT}
-				initialLng={DEFAULT_LNG}
+				initialLat={initialLat}
+				initialLng={initialLng}
 				{shops}
 				selectedId={selectedShopId}
 				{fitBounds}