diff --git a/src/components/GoodDetail/index.vue b/src/components/GoodDetail/index.vue
index 2177e9a..5a2cfb8 100644
--- a/src/components/GoodDetail/index.vue
+++ b/src/components/GoodDetail/index.vue
@@ -11,7 +11,7 @@
               .commodityPurchaseInstructionModuleEntityList.length -
             1,
         }">
-          <div class="flex items-center flex-row flex-shrink-0 mr-[8px]">
+          <div class="flex items-center flex-row shrink-0 mr-[8px]">
             <zn-icon :name="moduleItem.moduleIcon" size="20" color="#333"></zn-icon>
             <span class="ml-[4px] text-[14px] text-[#171717] leading-[20px]">
               {{ moduleItem.moduleTitle }}
diff --git a/src/pages/home/components/ChatLongAnswer/index.vue b/src/pages/home/components/ChatLongAnswer/index.vue
index 74c6e84..99abf3d 100644
--- a/src/pages/home/components/ChatLongAnswer/index.vue
+++ b/src/pages/home/components/ChatLongAnswer/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="flex flex-col bg-liner h-screen overflow-hidden">
     <!-- ✅ 顶部固定导航 -->
-    <div class="flex-shrink-0">
+    <div class="shrink-0">
       <TopNavBar :title="title" background="transparent" />
     </div>
 
diff --git a/src/pages/home/components/FacilityLocationCard/index.vue b/src/pages/home/components/FacilityLocationCard/index.vue
index ac9aa17..1bad81b 100644
--- a/src/pages/home/components/FacilityLocationCard/index.vue
+++ b/src/pages/home/components/FacilityLocationCard/index.vue
@@ -12,13 +12,13 @@
         </div>
       </div>
 
-      <div class="facility-location-card__distance flex items-center color-94A3B8 text-[14px] font-bold">
+      <div class="facility-location-card__distance flex items-center text-[#94A3B8] text-[14px] font-bold">
         <span class="facility-location-card__distance-icon">{{ distance.icon }}</span>
         <span>{{ distance.text }}</span>
       </div>
 
       <div class="facility-location-card__location bg-[#f8fafc] rounded-[20px]">
-        <div class="facility-location-card__location-label flex items-center color-64748B text-[13px] font-bold">
+        <div class="facility-location-card__location-label flex items-center text-[#64748B] text-[13px] font-bold">
           <span class="facility-location-card__location-dot">{{ location.icon }}</span>
           <span>{{ location.label }}</span>
         </div>
diff --git a/src/pages/home/components/LongTextGuideCard/index.vue b/src/pages/home/components/LongTextGuideCard/index.vue
index 8a8adab..ed912df 100644
--- a/src/pages/home/components/LongTextGuideCard/index.vue
+++ b/src/pages/home/components/LongTextGuideCard/index.vue
@@ -9,7 +9,7 @@
         <div class="long-text-guide-card__summary-title text-[#1e293b] text-[18px] font-bold">
           {{ item.title }}
         </div>
-        <div class="long-text-guide-card__summary-text color-94A3B8 text-[14px] font-medium ellipsis-2">
+        <div class="long-text-guide-card__summary-text text-[#94A3B8] text-[14px] font-medium ellipsis-2">
           {{ item.summary }}
         </div>
         <div class="long-text-guide-card__summary-footer flex items-center justify-between">
@@ -52,9 +52,9 @@
         <div class="long-text-guide-card__section-title text-[#1e293b] text-[16px] font-bold">
           {{ activeItem.sectionTitle }}
         </div>
-        <div class="long-text-guide-card__tip-block bg-ECFDF5">
+        <div class="long-text-guide-card__tip-block bg-[#ecfdf5]">
           <div v-for="(tip, index) in activeItem.tips || []" :key="tip"
-            class="long-text-guide-card__tip color-047857 text-[14px] font-800">
+            class="long-text-guide-card__tip text-[#047857] text-[14px] font-800">
             {{ index + 1 }} {{ tip }}
           </div>
         </div>
@@ -72,7 +72,7 @@
       </div>
 
       <div v-if="activeItem.action?.type === 'map'" class="long-text-guide-card__action-zone">
-        <div class="long-text-guide-card__action-label color-94A3B8 text-[11px] font-800">
+        <div class="long-text-guide-card__action-label text-[#94A3B8] text-[11px] font-800">
           {{ activeItem.action.label }}
         </div>
         <div class="long-text-guide-card__map-card rounded-[16px] overflow-hidden">
@@ -86,7 +86,7 @@
           <div class="long-text-guide-card__map-bar flex items-center bg-white">
             <div class="flex-1">
               <div class="text-[#1e293b] text-[15px] font-bold">{{ activeItem.action.title }}</div>
-              <div class="color-94A3B8 text-[12px] font-800 mt-2">{{ activeItem.action.subtitle }}</div>
+              <div class="text-[#94A3B8] text-[12px] font-800 mt-2">{{ activeItem.action.subtitle }}</div>
             </div>
             <div class="long-text-guide-card__nav-btn text-white bg-0F172A text-[14px] font-bold"
               @click="handleAction(activeItem)">
@@ -97,7 +97,7 @@
       </div>
 
       <div v-else-if="activeItem.action?.type === 'image'" class="long-text-guide-card__action-zone">
-        <div class="long-text-guide-card__action-label color-94A3B8 text-[11px] font-800">
+        <div class="long-text-guide-card__action-label text-[#94A3B8] text-[11px] font-800">
           {{ activeItem.action.label }}
         </div>
         <div class="long-text-guide-card__photo-card relative" @click="handleAction(activeItem)">
diff --git a/src/pages/home/components/LongTextGuideCardPreview/index.vue b/src/pages/home/components/LongTextGuideCardPreview/index.vue
index a1d10a9..3cf31e2 100644
--- a/src/pages/home/components/LongTextGuideCardPreview/index.vue
+++ b/src/pages/home/components/LongTextGuideCardPreview/index.vue
@@ -11,7 +11,7 @@
       <div class="long-text-guide-card__summary-title text-[#1e293b] text-[18px] font-bold">
         {{ item.title }}
       </div>
-      <div class="long-text-guide-card__summary-text color-94A3B8 text-[14px] font-medium ellipsis-2">
+      <div class="long-text-guide-card__summary-text text-[#94A3B8] text-[14px] font-medium ellipsis-2">
         {{ item.summary }}
       </div>
       <div class="long-text-guide-card__summary-footer flex items-center justify-between">
diff --git a/src/pages/home/components/MapNavigationCard/index.vue b/src/pages/home/components/MapNavigationCard/index.vue
index 8bd062c..33c7abc 100644
--- a/src/pages/home/components/MapNavigationCard/index.vue
+++ b/src/pages/home/components/MapNavigationCard/index.vue
@@ -13,7 +13,7 @@
         <div class="map-navigation-card__title text-[#1e293b] text-[18px] font-bold truncate">
           {{ data.title }}
         </div>
-        <div class="map-navigation-card__distance color-94A3B8 text-[14px] font-bold truncate">
+        <div class="map-navigation-card__distance text-[#94A3B8] text-[14px] font-bold truncate">
           {{ data.distance }}
         </div>
       </div>
diff --git a/src/pages/home/components/NoticeCard/index.vue b/src/pages/home/components/NoticeCard/index.vue
index 7d83c16..16efeeb 100644
--- a/src/pages/home/components/NoticeCard/index.vue
+++ b/src/pages/home/components/NoticeCard/index.vue
@@ -1,14 +1,14 @@
 <template>
   <div class="notice-card w-full">
-    <div v-if="!detailOpen" class="notice-card__summary bg-FFFBEB rounded-[24px] w-full">
+    <div v-if="!detailOpen" class="notice-card__summary bg-[#FFFBEB] rounded-[24px] w-full">
       <div class="notice-card__summary-title color-B45309 text-[16px] font-bold">
         {{ summary.title }}
       </div>
-      <div class="notice-card__summary-content color-D97706 text-[14px] font-bold">
+      <div class="notice-card__summary-content text-[#D97706] text-[14px] font-bold">
         {{ summary.content }}
       </div>
       <div class="notice-card__summary-footer flex items-center justify-between">
-        <div class="notice-card__summary-time color-D97706 text-[12px] font-bold">
+        <div class="notice-card__summary-time text-[#D97706] text-[12px] font-bold">
           {{ summary.publishTime }}
         </div>
         <div class="notice-card__summary-link color-B45309 text-[14px] font-bold" :class="{ 'is-disabled': disabled }"
@@ -20,7 +20,7 @@
 
     <div v-else class="notice-card__detail bg-white rounded-[24px] overflow-hidden w-full">
       <div class="notice-card__detail-head flex items-center">
-        <div class="notice-card__back flex items-center justify-center rounded-full flex-shrink-0" @click="closeDetail">
+        <div class="notice-card__back flex items-center justify-center rounded-full shrink-0" @click="closeDetail">
           <uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
         </div>
         <div class="notice-card__head-title text-[#1e293b] text-[18px] font-bold">
diff --git a/src/pages/home/components/NoticeMessage/detail.vue b/src/pages/home/components/NoticeMessage/detail.vue
index 123d147..e83598d 100644
--- a/src/pages/home/components/NoticeMessage/detail.vue
+++ b/src/pages/home/components/NoticeMessage/detail.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="flex flex-col bg-liner h-screen overflow-hidden">
     <!-- ✅ 顶部固定导航 -->
-    <div class="flex-shrink-0">
+    <div class="shrink-0">
       <TopNavBar :title="detailTitle" background="transparent" />
     </div>
 
diff --git a/src/pages/home/components/PoiCompareCard/index.vue b/src/pages/home/components/PoiCompareCard/index.vue
index 0e901c4..399275d 100644
--- a/src/pages/home/components/PoiCompareCard/index.vue
+++ b/src/pages/home/components/PoiCompareCard/index.vue
@@ -2,7 +2,7 @@
   <div class="poi-compare-card w-full">
     <div v-if="!isDetail" class="poi-compare-card__overdiv bg-white rounded-[24px] overflow-hidden">
       <div class="poi-compare-card__head flex items-center">
-        <div class="poi-compare-card__mark flex items-center justify-center rounded-full flex-shrink-0">
+        <div class="poi-compare-card__mark flex items-center justify-center rounded-full shrink-0">
           {{ data.icon }}
         </div>
         <div class="poi-compare-card__title text-[#1e293b] text-[18px] font-bold truncate flex-1">
@@ -15,7 +15,7 @@
           :class="{ 'is-disabled': disabled }" @click="handleSelect(item)">
           <img class="poi-compare-card__image block w-full" :src="item.image" mode="aspectFill" />
           <div v-for="field in item.fields" :key="field.label" class="poi-compare-card__field">
-            <div class="poi-compare-card__field-label color-94A3B8 text-[12px] font-800">
+            <div class="poi-compare-card__field-label text-[#94A3B8] text-[12px] font-800">
               {{ field.label }}
             </div>
             <div v-if="field.tone" class="poi-compare-card__chip text-[12px] font-bold"
@@ -37,14 +37,13 @@
 
     <div v-else class="poi-compare-card__detail-card bg-white rounded-[24px] overflow-hidden">
       <div class="poi-compare-card__detail-head flex items-center">
-        <div class="poi-compare-card__back flex items-center justify-center rounded-full flex-shrink-0"
-          @click="closeDetail">
+        <div class="poi-compare-card__back flex items-center justify-center rounded-full shrink-0" @click="closeDetail">
           <uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
         </div>
         <div class="poi-compare-card__detail-title text-[#1e293b] font-size-20 font-bold flex-1">
           {{ detail.title }}
         </div>
-        <div class="poi-compare-card__compare-label color-94A3B8 text-[12px] font-bold">
+        <div class="poi-compare-card__compare-label text-[#94A3B8] text-[12px] font-bold">
           {{ detail.compareLabel }}
         </div>
       </div>
@@ -58,7 +57,7 @@
           </div>
         </div>
         <div v-for="row in detail.rows" :key="row.label" class="poi-compare-card__table-row poi-compare-card__data-row">
-          <div class="poi-compare-card__row-label color-94A3B8 text-[12px] font-bold">
+          <div class="poi-compare-card__row-label text-[#94A3B8] text-[12px] font-bold">
             {{ row.label }}
           </div>
           <div v-for="cell in row.values" :key="row.label + '-' + cell.text"
@@ -69,12 +68,12 @@
       </div>
 
       <div class="poi-compare-card__recommend">
-        <div class="poi-compare-card__recommend-title color-94A3B8 text-[12px] font-bold">
+        <div class="poi-compare-card__recommend-title text-[#94A3B8] text-[12px] font-bold">
           {{ detail.recommendTitle }}
         </div>
         <div class="poi-compare-card__tips">
           <div v-for="tip in detail.tips" :key="tip.text" class="poi-compare-card__tip flex gap-10">
-            <div class="poi-compare-card__dot rounded-full flex-shrink-0" :class="getDotClass(tip.tone)" />
+            <div class="poi-compare-card__dot rounded-full shrink-0" :class="getDotClass(tip.tone)" />
             <div class="poi-compare-card__tip-text text-[#334155] text-[14px] font-bold">
               {{ tip.text }}
             </div>
@@ -117,8 +116,8 @@ const detail = computed(() => props.data.detail || {});
 
 const getToneClass = (tone) => {
   const toneMap = {
-    green: "poi-compare-card__chip--green color-047857 bg-ECFDF5",
-    amber: "poi-compare-card__chip--amber color-D97706 bg-FFFBEB",
+    green: "poi-compare-card__chip--green text-[#047857] bg-[#ecfdf5]",
+    amber: "poi-compare-card__chip--amber text-[#D97706] bg-[#FFFBEB]",
   };
   return toneMap[tone] || "";
 };
diff --git a/src/pages/home/components/PoiDetailCard/index.vue b/src/pages/home/components/PoiDetailCard/index.vue
index 6bb3e34..7039066 100644
--- a/src/pages/home/components/PoiDetailCard/index.vue
+++ b/src/pages/home/components/PoiDetailCard/index.vue
@@ -14,8 +14,8 @@
       </div>
 
       <div class="poi-detail-card__tip flex items-center gap-10">
-        <div class="poi-detail-card__spark color-047857 text-[18px] font-bold">✦</div>
-        <div class="poi-detail-card__tip-text color-047857 text-[14px] font-800">
+        <div class="poi-detail-card__spark text-[#047857] text-[18px] font-bold">✦</div>
+        <div class="poi-detail-card__tip-text text-[#047857] text-[14px] font-800">
           {{ data.tip?.text }}
         </div>
       </div>
diff --git a/src/pages/home/components/RecommendationListCard/index.vue b/src/pages/home/components/RecommendationListCard/index.vue
index a424214..8730bf7 100644
--- a/src/pages/home/components/RecommendationListCard/index.vue
+++ b/src/pages/home/components/RecommendationListCard/index.vue
@@ -11,7 +11,7 @@
             {{ item.title }}
           </div>
           <div
-            class="recommendation-list-card__distance flex items-center gap-4 mt-4 color-94A3B8 text-[12px] font-800">
+            class="recommendation-list-card__distance flex items-center gap-4 mt-4 text-[#94A3B8] text-[12px] font-800">
             <span class="recommendation-list-card__pin">⌖</span>
             <span>{{ item.distance }}</span>
           </div>
diff --git a/src/pages/home/components/RoutePlanCard/index.vue b/src/pages/home/components/RoutePlanCard/index.vue
index e7acbb7..15b677a 100644
--- a/src/pages/home/components/RoutePlanCard/index.vue
+++ b/src/pages/home/components/RoutePlanCard/index.vue
@@ -1,81 +1,90 @@
 <template>
-  <div class="route-plan-card w-full">
+  <div class="w-full">
     <div v-if="!detailOpen"
-      class="route-plan-card__summary flex items-center bg-white rounded-[24px] overflow-hidden w-full"
-      :class="{ 'is-disabled': disabled }" @click="openDetail">
-      <img class="route-plan-card__cover block flex-shrink-0" :src="data.image" mode="aspectFill" />
-      <div class="route-plan-card__body flex-1">
-        <div class="route-plan-card__title text-[#1e293b] text-[18px] font-bold truncate">
+      class="min-h-[108px] px-[20px] py-[16px] flex items-center bg-white rounded-[24px] overflow-hidden w-full border border-slate-200/72 [box-shadow:0_10px_28px_rgba(15,23,42,0.05)] active:opacity-86"
+      :class="{ 'opacity-55': disabled }" @click="openDetail">
+      <img class="w-[76px] h-[76px] rounded-[10px] block shrink-0" :src="data.image" />
+      <div class="min-w-0 ml-[18px] flex-1">
+        <div class="leading-[24px] text-[#1e293b] text-[18px] font-bold truncate">
           {{ data.title }}
         </div>
-        <div class="route-plan-card__tags flex items-center">
-          <div v-for="tag in summaryTags" :key="tag.id || tag.text" class="route-plan-card__tag text-[12px] font-bold"
+        <div class="min-w-0 mt-[10px] flex items-center space-x-2">
+          <div v-for="tag in summaryTags" :key="tag.id || tag.text"
+            class="h-[24px] px-[11px] rounded-full leading-[24px] text-[12px] font-bold whitespace-nowrap"
             :class="getTagClass(tag.tone)">
             {{ tag.text }}
           </div>
         </div>
       </div>
-      <div class="flex-shrink-0">
-        <uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
+      <div class="shrink-0">
+        <van-icon name="arrow-right" size="16" color="#CBD5E1"></van-icon>
       </div>
     </div>
 
-    <div v-else class="route-plan-card__detail bg-white rounded-[24px] overflow-hidden w-full">
-      <div class="route-plan-card__detail-head flex items-center">
-        <div class="route-plan-card__back flex items-center justify-center rounded-full flex-shrink-0"
+    <div v-else
+      class="bg-white rounded-[24px] overflow-hidden w-full border border-slate-200/72 [box-shadow:0_10px_28px_rgba(15,23,42,0.05)]">
+      <div class="min-w-0 h-[70px] px-[22px] border-b border-slate-100 flex items-center">
+        <div
+          class="w-[34px] h-[34px] mr-3.5 text-slate-500 text-[28px] leading-none bg-slate-50 flex items-center justify-center rounded-full shrink-0"
           @click="closeDetail">
-          <uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
+          <van-icon name="arrow-left" size="16" color="#CBD5E1"></van-icon>
         </div>
-        <div class="route-plan-card__detail-title text-[#1e293b] text-[18px] font-bold truncate flex-1">
+        <div class="min-w-0 leading-[24px] text-[#1e293b] text-[18px] font-bold truncate flex-1">
           {{ data.title }}
         </div>
-        <div class="route-plan-card__detail-badge color-047857 bg-ECFDF5 text-[12px] font-bold">
+        <div
+          class="h-[26px] ml-3 px-3 rounded-full leading-[26px] whitespace-nowrap text-[#047857] bg-[#ecfdf5] text-[12px] font-bold">
           {{ detail.badge }}
         </div>
       </div>
 
-      <div class="route-plan-card__timeline">
+      <div class="pt-[26px] py-[18px]">
         <template v-for="(node, index) in nodes" :key="node.id || node.title">
-          <div class="route-plan-card__node-wrap" :class="{ 'is-disabled': disabled }" @click="handleSelect(node)">
+          <div class="active:opacity-86 relative" :class="{ 'opacity-55': disabled }" @click="handleSelect(node)">
             <div
-              class="route-plan-card__node-number flex items-center justify-center rounded-full color-047857 bg-ECFDF5 text-[12px] font-bold">
+              class="absolute left-5 top-1/2 z-10 w-[26px] h-[26px] -translate-y-1/2 flex items-center justify-center rounded-full text-[#047857] bg-[#ecfdf5] text-[12px] font-bold">
               {{ index + 1 }}
             </div>
-            <div class="route-plan-card__node bg-white rounded-[20px] flex items-center">
-              <img class="route-plan-card__node-image block flex-shrink-0" :src="node.image" mode="aspectFill" />
-              <div class="route-plan-card__node-body flex-1">
-                <div class="route-plan-card__node-title text-[#1e293b] text-[16px] font-bold truncate">
+            <div
+              class="min-h-[88px] pt-3 pr-4 pb-3 pl-[56px] border border-gray-200 bg-white rounded-[20px] flex items-center">
+              <img class="w-16 h-16 mr-3.5 rounded-[10px] object-cover block shrink-0" :src="node.image" />
+              <div class="min-w-0 flex-1">
+                <div class="leading-[22px] text-[#1e293b] text-[16px] font-bold truncate">
                   {{ node.title }}
                 </div>
-                <div class="route-plan-card__node-desc color-94A3B8 text-[12px] font-800 truncate">
+                <div class="mt-[4px] leading-[18px] text-[#94A3B8] text-[12px] font-800 truncate">
                   {{ node.description }}
                 </div>
-                <div v-if="node.tag" class="route-plan-card__node-tag color-D97706 bg-FFFBEB text-[12px] font-bold">
+                <div v-if="node.tag"
+                  class="inline-flex items-center h-[22px] mt-1.5 px-[9px] border border-amber-200 rounded-full leading-[22px] text-[#D97706] bg-[#FFFBEB] text-[12px] font-bold">
                   {{ node.tag }}
                 </div>
               </div>
             </div>
           </div>
 
-          <div v-if="connectors[index]" class="route-plan-card__connector">
-            <div class="route-plan-card__connector-line"></div>
-            <div class="route-plan-card__connector-arrow"></div>
+          <div v-if="connectors[index]" class="relative h-[56px]">
+            <div class="absolute left-1/2 top-0 w-[2px] h-[52px] -translate-x-1/2 rounded-[2px] bg-green-200"></div>
             <div
-              class="route-plan-card__connector-chip flex items-center bg-[#f8fafc] rounded-full color-64748B text-[12px] font-bold">
-              <span class="route-plan-card__connector-icon">{{ connectors[index].icon }}</span>
+              class="absolute left-1/2 top-[42px] w-2.5 h-2.5 border-r-2 border-r-[#86efac] border-b-2 border-b-[#86efac] [-translate-x-4px] rotate-45">
+            </div>
+            <div
+              class="absolute right-0 top-3.5 h-7 px-3 border border-gray-200 leading-7 text-gray-600 flex items-center bg-[#f8fafc] rounded-full text-[#64748B] text-[12px] font-bold">
+              <span class="mr-[5px]">{{ connectors[index].icon }}</span>
               <span>{{ connectors[index].text }}</span>
             </div>
           </div>
         </template>
       </div>
 
-      <div v-if="tips.length" class="route-plan-card__tips bg-[#f8fafc] rounded-[20px]">
-        <div class="route-plan-card__tips-title color-64748B text-[14px] font-bold">
+      <div v-if="tips.length"
+        class="mt-[26px] mx-5 pt-4.5 pr-4.5 pb-4.5 pl-5 border border-slate-200 bg-[#f8fafc] rounded-[20px]">
+        <div class="mb-[14px] leading-[18px] text-[#64748B] text-[14px] font-bold">
           {{ detail.tipsTitle }}
         </div>
         <div v-for="tip in tips" :key="tip"
-          class="route-plan-card__tip flex items-center text-[#334155] text-[13px] font-bold">
-          <div class="route-plan-card__tip-dot rounded-full flex-shrink-0"></div>
+          class="min-h-[22px] leading-[22px] mt-[4px] flex items-center text-[#334155] text-[13px] font-bold">
+          <div class="w-[5px] h-[5px] mr-[12px] bg-[#cbd5e1] rounded-full shrink-0"></div>
           <div>{{ tip }}</div>
         </div>
       </div>
@@ -107,8 +116,8 @@ const connectors = computed(() => detail.value.connectors || []);
 const tips = computed(() => detail.value.tips || []);
 
 const getTagClass = (tone) => {
-  if (tone === "green") return "color-047857 bg-ECFDF5";
-  return "color-64748B bg-[#f1f5f9]";
+  if (tone === "green") return "text-[#047857] bg-[#ecfdf5]";
+  return "text-[#64748B] bg-[#f1f5f9]";
 };
 
 const openDetail = () => {
diff --git a/src/pages/home/components/RoutePlanCard/styles/index.scss b/src/pages/home/components/RoutePlanCard/styles/index.scss
deleted file mode 100644
index 33ba781..0000000
--- a/src/pages/home/components/RoutePlanCard/styles/index.scss
+++ /dev/null
@@ -1,227 +0,0 @@
-.route-plan-card {
-  width: 100%;
-}
-
-.route-plan-card__summary,
-.route-plan-card__detail {
-  border: 1px solid rgba(226, 232, 240, 0.72);
-  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
-  box-sizing: border-box;
-}
-
-.route-plan-card__summary {
-  min-height: 108px;
-  padding: 16px 20px;
-}
-
-.route-plan-card__summary:active,
-.route-plan-card__node-wrap:active {
-  opacity: 0.86;
-}
-
-.route-plan-card__summary.is-disabled,
-.route-plan-card__node-wrap.is-disabled {
-  opacity: 0.55;
-}
-
-.route-plan-card__cover {
-  width: 76px;
-  height: 76px;
-  border-radius: 10px;
-}
-
-.route-plan-card__body {
-  min-width: 0;
-  margin-left: 18px;
-}
-
-.route-plan-card__title {
-  line-height: 24px;
-}
-
-.route-plan-card__tags {
-  min-width: 0;
-  margin-top: 10px;
-}
-
-.route-plan-card__tag {
-  height: 24px;
-  padding: 0 11px;
-  border-radius: 999px;
-  line-height: 24px;
-  white-space: nowrap;
-}
-
-.route-plan-card__tag + .route-plan-card__tag {
-  margin-left: 8px;
-}
-
-.route-plan-card__arrow {
-  width: 12px;
-  height: 12px;
-  margin-left: 14px;
-  border-top: 2px solid #cbd5e1;
-  border-right: 2px solid #cbd5e1;
-  transform: rotate(45deg);
-}
-
-.route-plan-card__detail {
-  padding-bottom: 26px;
-}
-
-.route-plan-card__detail-head {
-  min-width: 0;
-  height: 70px;
-  padding: 0 22px;
-  border-bottom: 1px solid #f1f5f9;
-  box-sizing: border-box;
-}
-
-.route-plan-card__back {
-  width: 34px;
-  height: 34px;
-  margin-right: 14px;
-  color: #64748b;
-  font-size: 28px;
-  line-height: 1;
-  background: #f8fafc;
-}
-
-.route-plan-card__detail-title {
-  min-width: 0;
-  line-height: 24px;
-}
-
-.route-plan-card__detail-badge {
-  height: 26px;
-  margin-left: 12px;
-  padding: 0 12px;
-  border-radius: 999px;
-  line-height: 26px;
-  white-space: nowrap;
-}
-
-.route-plan-card__timeline {
-  padding: 26px 18px 0;
-}
-
-.route-plan-card__node-wrap {
-  position: relative;
-}
-
-.route-plan-card__node-number {
-  position: absolute;
-  left: 20px;
-  top: 50%;
-  z-index: 2;
-  width: 26px;
-  height: 26px;
-  transform: translateY(-50%);
-}
-
-.route-plan-card__node {
-  min-height: 88px;
-  padding: 12px 16px 12px 56px;
-  border: 1px solid #e5e7eb;
-  box-sizing: border-box;
-}
-
-.route-plan-card__node-image {
-  width: 64px;
-  height: 64px;
-  margin-right: 14px;
-  border-radius: 10px;
-}
-
-.route-plan-card__node-body {
-  min-width: 0;
-}
-
-.route-plan-card__node-title {
-  line-height: 22px;
-}
-
-.route-plan-card__node-desc {
-  margin-top: 4px;
-  line-height: 18px;
-}
-
-.route-plan-card__node-tag {
-  display: inline-flex;
-  align-items: center;
-  height: 22px;
-  margin-top: 6px;
-  padding: 0 9px;
-  border: 1px solid #fde68a;
-  border-radius: 999px;
-  line-height: 22px;
-}
-
-.route-plan-card__connector {
-  position: relative;
-  height: 56px;
-}
-
-.route-plan-card__connector-line {
-  position: absolute;
-  left: 50%;
-  top: 0;
-  width: 2px;
-  height: 52px;
-  border-radius: 2px;
-  background: #bbf7d0;
-}
-
-.route-plan-card__connector-arrow {
-  position: absolute;
-  left: 50%;
-  top: 42px;
-  width: 10px;
-  height: 10px;
-  border-right: 2px solid #86efac;
-  border-bottom: 2px solid #86efac;
-  transform: translateX(-4px) rotate(45deg);
-}
-
-.route-plan-card__connector-chip {
-  position: absolute;
-  right: 0;
-  top: 14px;
-  height: 28px;
-  padding: 0 12px;
-  border: 1px solid #e5e7eb;
-  line-height: 28px;
-  box-sizing: border-box;
-}
-
-.route-plan-card__connector-icon {
-  margin-right: 5px;
-}
-
-.route-plan-card__tips {
-  margin: 26px 20px 0;
-  padding: 18px 18px 18px 20px;
-  border: 1px solid #e2e8f0;
-  box-sizing: border-box;
-}
-
-.route-plan-card__tips-title {
-  margin-bottom: 14px;
-  line-height: 18px;
-}
-
-.route-plan-card__tip {
-  min-height: 22px;
-  line-height: 22px;
-}
-
-.route-plan-card__tip + .route-plan-card__tip {
-  margin-top: 4px;
-}
-
-.route-plan-card__tip-dot {
-  width: 5px;
-  height: 5px;
-  margin-right: 12px;
-  background: #cbd5e1;
-}
diff --git a/src/pages/home/components/ScenicImageCard/styles/index.scss b/src/pages/home/components/ScenicImageCard/styles/index.scss
deleted file mode 100644
index b7e8f1e..0000000
--- a/src/pages/home/components/ScenicImageCard/styles/index.scss
+++ /dev/null
@@ -1,48 +0,0 @@
-.scenic-image-card {
-  height: 324px;
-  background: #e2e8f0;
-}
-
-.scenic-image-card:active,
-.scenic-image-card__expand:active {
-  opacity: 0.86;
-}
-
-.scenic-image-card.is-disabled {
-  opacity: 0.55;
-}
-
-.scenic-image-card__image {
-  height: 100%;
-}
-
-.scenic-image-card__expand {
-  position: absolute;
-  top: 16px;
-  right: 16px;
-  z-index: 2;
-  width: 40px;
-  height: 40px;
-  background: rgba(15, 23, 42, 0.36);
-  line-height: 40px;
-}
-
-.scenic-image-card__caption {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  padding: 72px 22px 20px;
-  background: linear-gradient(180deg, rgba(15, 23, 42, 0) 0%, rgba(15, 23, 42, 0.72) 100%);
-}
-
-.scenic-image-card__title {
-  line-height: 24px;
-  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.28);
-}
-
-.scenic-image-card__subtitle {
-  margin-top: 4px;
-  line-height: 18px;
-  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.28);
-}