diff --git a/mobile/public/mentor.png b/mobile/public/mentor.png
new file mode 100644
index 00000000..2dd16b73
Binary files /dev/null and b/mobile/public/mentor.png differ
diff --git a/mobile/src/App.vue b/mobile/src/App.vue
index 17295742..4eff5db9 100644
--- a/mobile/src/App.vue
+++ b/mobile/src/App.vue
@@ -32,8 +32,8 @@
       </form>
     </section>
 
-    <section v-else class="page">
-      <header class="top">
+    <section v-else class="page" :class="{ 'user-redesign': roleKey === 'user' }">
+      <header v-if="!(roleKey === 'user' && isHomeTab)" class="top">
         <div class="top-row">
           <h1>AI人力助手</h1>
           <button class="role-pill" type="button" @click="cycleRole">
@@ -52,7 +52,7 @@
         </p>
       </header>
 
-      <Card v-if="isHomeTab" :title="roleKey === 'supervisor' ? '今日处理流程' : '今日使用流程'">
+      <Card v-if="isHomeTab && roleKey !== 'user'" :title="roleKey === 'supervisor' ? '今日处理流程' : '今日使用流程'">
         <div class="flow-steps">
           <button v-for="item in roleFlowSteps" :key="`${item.phase}-${item.title}`" type="button" :class="{ active: isFlowActive(item) }" @click="openFlowStep(item)">
             <em>{{ item.phase }}</em>
@@ -290,93 +290,101 @@
 
       <template v-else>
         <template v-if="roleKey === 'user' && isHomeTab">
-          <section class="scenario-section">
-            <div class="scenario-title">
-              <h2>今天要学</h2>
-              <p>跟着任务走，学完自动记录</p>
-            </div>
-
-            <div class="scenario-card-stack">
-              <div class="task-card">
-                <div class="task-copy">
-                  <strong>{{ userPrimaryTask.badge }}</strong>
-                  <h3>{{ userPrimaryTask.title }}</h3>
-                  <p>{{ userPrimaryTask.desc }}</p>
-                  <span>进度 {{ userPrimaryTask.progressText }}</span>
-                  <ProgressBar :value="userPrimaryTask.progress" />
-                </div>
-                <div class="headset-art">
-                  <Icon :name="userPrimaryTask.icon" size="104" stroke="1.7" />
-                </div>
-                <button type="button" @click="handlePrimaryAction">{{ userPrimaryTask.cta }}</button>
-              </div>
-
-              <button class="review-card" type="button" @click="openUserAction('sop')">
-                <IconBubble icon="document" tone="amber" />
-                <span>
-                  <b>{{ workerRole.review.title }}</b>
-                  <small>{{ workerRole.review.desc }}</small>
-                </span>
-                <Icon name="chevron-right" size="26" />
+          <section v-if="!userBuildingOpen" class="mentor-hero">
+            <div class="mentor-topline">
+              <span>生活顾问客服管家</span>
+              <button class="role-pill mentor-role-pill" type="button" @click="cycleRole">
+                {{ role.roleLabel }}
+                <Icon name="chevron-down" size="16" />
               </button>
             </div>
-
+            <div class="mentor-main">
+              <div class="mentor-avatar" :class="`is-${mentorState}`" aria-hidden="true">
+                <img :src="mentorImageSrc" alt="" />
+                <span class="mentor-eyelid mentor-eyelid-left"></span>
+                <span class="mentor-eyelid mentor-eyelid-right"></span>
+                <span class="mentor-thinking" aria-hidden="true"><i></i><i></i><i></i></span>
+                <span class="mentor-waves" aria-hidden="true"><i></i><i></i><i></i><i></i></span>
+              </div>
+              <div class="mentor-copy">
+                <span class="mentor-greeting">早上好，王敏</span>
+                <p>{{ mentorBubbleText }}</p>
+              </div>
+            </div>
+            <div class="mentor-actions">
+              <button
+                class="mentor-talk"
+                type="button"
+                @pointerdown="startMentorVoicePress"
+                @touchstart="startMentorVoicePress"
+              >
+                <span>🎙</span>
+                按住说话
+              </button>
+              <button class="mentor-type" type="button" @click="openMentorTextAsk">⌨️ 打字问</button>
+            </div>
           </section>
 
-          <section class="scenario-section">
-            <div class="scenario-title">
-              <h2>练完要复盘</h2>
-              <p>看评分和导师改写，把话术改到位</p>
-            </div>
-
-            <button v-if="latestPracticeReview" class="review-summary-card" type="button" @click="openUserHistory(latestPracticeReview)">
-              <IconBubble icon="target" tone="blue" />
-              <span>
-                <b>{{ latestPracticeReview.scene }} · {{ latestPracticeReview.score }}分</b>
-                <small>导师改写摘要：{{ latestPracticeReview.summary }}</small>
-              </span>
-              <Icon name="chevron-right" size="26" />
+          <div v-if="!userBuildingOpen" class="mentor-chip-row" aria-label="快捷提问">
+            <button v-for="chip in mentorQuickChips" :key="chip.label" type="button" @click="askMentorChip(chip.query)">
+              <span></span>
+              {{ chip.label }}
+              <b>›</b>
             </button>
-            <div v-else class="review-summary-card empty">
-              <IconBubble icon="target" tone="blue" />
-              <span>
-                <b>我的复盘</b>
-                <small>完成第一次训练后，这里会出现你的评分和导师改写</small>
-              </span>
-            </div>
+          </div>
+
+          <section v-if="userBuildingOpen" class="building-page">
+            <div class="building-icon">🚧</div>
+            <h2>建设中</h2>
+            <p>该功能正在加紧建设中,敬请期待上线</p>
+            <button type="button" @click="closeBuildingPage">返回首页</button>
           </section>
 
-          <section class="scenario-section">
-            <div class="scenario-title">
-              <h2>工作中要用</h2>
-              <p>遇到不确定的现场问题，先查标准做法</p>
-            </div>
+          <template v-else>
+            <section class="home-card agenda-card">
+              <div class="home-card-head">
+                <h2>📅 今日安排</h2>
+                <button type="button" @click="openUserAction('tasks')">查看全部 ›</button>
+              </div>
+              <div class="agenda-list">
+                <div class="agenda-row">
+                  <em class="agenda-index blue">1</em>
+                  <span>
+                    <b>{{ todayTrainingTask.title }}</b>
+                    <small>{{ todayTrainingTask.desc }}</small>
+                  </span>
+                  <button class="agenda-action blue" type="button" @click="startAgendaPractice">开始</button>
+                </div>
+                <div class="agenda-row">
+                  <em class="agenda-index orange">2</em>
+                  <span>
+                    <b>{{ reviewAgendaTitle }}</b>
+                    <small>{{ reviewAgendaDesc }}</small>
+                  </span>
+                  <button class="agenda-action orange" type="button" :disabled="!pendingPracticeReview" @click="openPendingReview">去复盘</button>
+                </div>
+              </div>
+            </section>
 
-            <button class="sop-action-card" type="button" @click="openUserAction('sop')">
-              <IconBubble icon="book-search" tone="teal" />
-              <span>
-                <b>遇到问题，问一句</b>
-                <small>输入或语音提问，30秒拿到带出处的标准做法</small>
-              </span>
-              <Icon name="chevron-right" size="28" />
-            </button>
-          </section>
-
-          <section class="scenario-section">
-            <div class="scenario-title">
-              <h2>碰到问题要报</h2>
-              <p>现场情况拍下来说出来，沉淀成案例</p>
-            </div>
-
-            <button class="report-card" type="button" @click="openUserAction('submit')">
-              <IconBubble icon="pen" tone="purple" />
-              <span>
-                <b>提交素材 / 案例上报</b>
-                <small>记录工作场景，上传后自动转写并整理案例</small>
-              </span>
-              <Icon name="chevron-right" size="26" />
-            </button>
-          </section>
+            <section class="home-card map-card">
+              <div class="home-card-head">
+                <h2>🧭 我的地图</h2>
+              </div>
+              <div class="map-grid">
+                <button
+                  v-for="item in mentorMapActions"
+                  :key="item.key"
+                  type="button"
+                  :class="`tone-${item.tone}`"
+                  @click="openMentorMapAction(item.key)"
+                >
+                  <span>{{ item.label }}</span>
+                  <small>{{ item.desc }}</small>
+                  <b>›</b>
+                </button>
+              </div>
+            </section>
+          </template>
         </template>
 
         <template v-else-if="isHomeTab">
@@ -553,7 +561,7 @@
             </template>
 
             <template v-else-if="activeUserPanel === 'sop' || activeUserPanel === 'cases'">
-              <div class="knowledge-tabs">
+              <div v-if="roleKey === 'candidate'" class="knowledge-tabs">
                 <button type="button" :class="{ active: activeUserPanel === 'sop' }" @click="switchKnowledgePanel('sop')">SOP</button>
                 <button type="button" :class="{ active: activeUserPanel === 'cases' }" @click="switchKnowledgePanel('cases')">案例</button>
               </div>
@@ -737,7 +745,7 @@
           </div>
         </Card>
 
-        <section v-if="roleKey === 'user' && isHomeTab" class="scenario-section growth-section">
+        <section v-if="roleKey === 'user' && isHomeTab && !userBuildingOpen" class="scenario-section growth-section">
           <div class="scenario-title">
             <h2>我的成长</h2>
             <p>这里只看摘要，完整记录去我的页</p>
@@ -770,11 +778,19 @@
       </template>
 
       <nav class="tabbar" aria-label="底部导航">
-        <button v-for="tab in role.tabs" :key="tab.label" type="button" :class="{ active: activeTabLabel === tab.label }" @click="openTab(tab.label)">
+        <button v-for="tab in visibleTabs" :key="tab.label" type="button" :class="{ active: isTabActive(tab.label) }" @click="openTab(tab.label)">
           <Icon :name="tab.icon" size="28" />
           <span>{{ tab.label }}</span>
         </button>
       </nav>
+
+      <button v-if="mentorFloatVisible" class="mentor-float mentor-avatar" :class="`is-${mentorState}`" type="button" @click="restoreMentorHero" aria-label="回到师傅区">
+        <img :src="mentorImageSrc" alt="" />
+        <span class="mentor-eyelid mentor-eyelid-left"></span>
+        <span class="mentor-eyelid mentor-eyelid-right"></span>
+        <span class="mentor-thinking" aria-hidden="true"><i></i><i></i><i></i></span>
+        <span class="mentor-waves" aria-hidden="true"><i></i><i></i><i></i><i></i></span>
+      </button>
     </section>
 
     <section v-if="sopPanelOpen" class="sop-overlay" aria-label="查 SOP">
@@ -785,7 +801,7 @@
         </header>
 
         <form class="sop-form" @submit.prevent="searchSopKnowledge">
-          <input v-model.trim="sopQuery" placeholder="输入或语音提问,如:投诉首次反馈时限是多久" />
+          <input ref="sopTextInput" v-model.trim="sopQuery" placeholder="输入或语音提问,如:投诉首次反馈时限是多久" />
           <div class="sop-actions">
             <button class="sop-voice" type="button" :disabled="sopAsrBusy || sopLoading" @click="toggleSopRecording">
               {{ sopRecording ? '停止录音' : sopAsrBusy ? '识别中' : sopUseAudioFileFallback ? '选择语音' : '语音提问' }}
@@ -840,13 +856,15 @@
 
 <script setup lang="ts">
 import type { PropType } from 'vue';
-import { computed, defineComponent, h, ref, watch } from 'vue';
+import { computed, defineComponent, h, nextTick, onBeforeUnmount, ref, watch } from 'vue';
 
 type RoleKey = 'user' | 'candidate' | 'supervisor';
 type Tone = 'teal' | 'blue' | 'orange' | 'purple' | 'amber';
 type UserPanelKey = '' | 'tasks' | 'sop' | 'cases' | 'submit' | 'profile' | 'history' | 'recommend';
 type SupervisorPanelKey = '' | 'team' | 'reviews' | 'assign' | 'weakness' | 'case' | 'sop' | 'profile';
 type FlowTarget = UserPanelKey | SupervisorPanelKey;
+type MentorState = 'idle' | 'listening' | 'thinking' | 'speaking';
+type MentorMapActionKey = 'ask' | 'practice' | 'learn' | 'submit';
 type IconName =
   | 'bars'
   | 'book'
@@ -1227,8 +1245,8 @@ const phoneKey = 'aihr_mobile_phone';
 const phonePattern = /^1[3-9]\d{9}$/;
 
 const roleKey = ref<RoleKey>(readRole());
-const activeTabLabel = ref('首页');
-const isHomeTab = computed(() => activeTabLabel.value === '首页');
+const activeTabLabel = ref('今日');
+const isHomeTab = computed(() => activeTabLabel.value === '首页' || activeTabLabel.value === '今日');
 const tapped = ref('');
 const toastMessage = ref('');
 const phone = ref(localStorage.getItem(phoneKey) || '');
@@ -1278,6 +1296,7 @@ const sopRecording = ref(false);
 const sopAsrBusy = ref(false);
 const sopUseAudioFileFallback = ref(false);
 const sopAudioInput = ref<HTMLInputElement>();
+const sopTextInput = ref<HTMLInputElement>();
 const sopSnippetsOpen = ref(false);
 const expandedSnippets = ref(new Set<number>());
 const sopSpeaking = ref(false);
@@ -1293,6 +1312,8 @@ const recording = ref(false);
 const asrBusy = ref(false);
 const useAudioFileFallback = ref(false);
 const practiceAudioInput = ref<HTMLInputElement>();
+const userBuildingOpen = ref(false);
+const mentorCollapsed = ref(false);
 let toastTimer: number | undefined;
 let mediaRecorder: MediaRecorder | null = null;
 let recordedChunks: Blob[] = [];
@@ -1300,6 +1321,24 @@ let sopMediaRecorder: MediaRecorder | null = null;
 let sopRecordedChunks: Blob[] = [];
 let customerAudio: HTMLAudioElement | null = null;
 let applyingRoute = false;
+let mentorVoicePressing = false;
+let sopAutoSearchAfterTranscribe = false;
+let mentorScrollRaf = 0;
+let mentorScrollListening = false;
+
+const mentorImageSrc = `${import.meta.env.BASE_URL}mentor.png`;
+const mentorQuickChips = [
+  { label: '催费话术', query: '物业费催缴怎么开口' },
+  { label: '投诉应对', query: '业主投诉时第一句话怎么说' },
+  { label: '收费标准', query: '物业费收费标准怎么向业主解释' },
+  { label: '上门带什么', query: '生活顾问上门处理问题需要带什么' }
+];
+const mentorMapActions: Array<{ key: MentorMapActionKey; label: string; desc: string; tone: 'blue' | 'green' | 'orange' | 'red' }> = [
+  { key: 'ask', label: '问', desc: '查SOP / 求助话术', tone: 'blue' },
+  { key: 'practice', label: '练', desc: '场景模拟 / 错题重练', tone: 'green' },
+  { key: 'learn', label: '学', desc: '岗前课程 / 每日小训', tone: 'orange' },
+  { key: 'submit', label: '报', desc: '上报案例 / 拍照记录', tone: 'red' }
+];
 
 const navigatePath = (path: string, replace = false) => {
   if (window.location.pathname === path) return;
@@ -1315,7 +1354,34 @@ const supervisorPanelPath = (panel: SupervisorPanelKey) =>
 const scrollToTop = () => {
   window.requestAnimationFrame(() => window.scrollTo({ top: 0 }));
 };
+const homeTabLabel = () => (roleKey.value === 'user' ? '今日' : '首页');
+const closeBuildingPage = () => {
+  userBuildingOpen.value = false;
+  activeTabLabel.value = '今日';
+  activeUserPanel.value = '';
+  syncPath();
+  scrollToTop();
+};
+const openBuildingPage = (source = '建设中') => {
+  if (roleKey.value !== 'user') {
+    tapped.value = source;
+    toastMessage.value = `「${source}」本期演示未开放,正在建设中`;
+    if (toastTimer) window.clearTimeout(toastTimer);
+    toastTimer = window.setTimeout(() => {
+      toastMessage.value = '';
+    }, 2000);
+    return;
+  }
+  userBuildingOpen.value = true;
+  activeTabLabel.value = '今日';
+  activeUserPanel.value = '';
+  scrollToTop();
+};
 const tap = (name: string) => {
+  if (roleKey.value === 'user') {
+    openBuildingPage(name);
+    return;
+  }
   tapped.value = name;
   toastMessage.value = `「${name}」本期演示未开放,正在建设中`;
   if (toastTimer) window.clearTimeout(toastTimer);
@@ -1326,7 +1392,8 @@ const tap = (name: string) => {
 const cycleRole = () => {
   const order: RoleKey[] = ['user', 'candidate', 'supervisor'];
   roleKey.value = order[(order.indexOf(roleKey.value) + 1) % order.length];
-  activeTabLabel.value = '首页';
+  activeTabLabel.value = homeTabLabel();
+  userBuildingOpen.value = false;
   syncPath();
 };
 
@@ -1517,7 +1584,10 @@ const transcribeRecording = async (blob: Blob, filename = 'practice.webm') => {
 };
 
 const openSopPanel = () => {
-  sopReturnTabLabel.value = activeTabLabel.value;
+  if (roleKey.value === 'user') {
+    userBuildingOpen.value = false;
+  }
+  sopReturnTabLabel.value = activeTabLabel.value === '问' ? '今日' : activeTabLabel.value;
   sopReturnPath.value = window.location.pathname.endsWith('/sop') ? rolePaths[roleKey.value] : window.location.pathname;
   sopPanelOpen.value = true;
   sopQuery.value = '';
@@ -1528,6 +1598,7 @@ const openSopPanel = () => {
 
 const closeSopPanel = () => {
   if (sopRecording.value) {
+    sopAutoSearchAfterTranscribe = false;
     sopMediaRecorder?.stop();
   }
   stopSopSpeak();
@@ -1539,6 +1610,7 @@ const closeSopPanel = () => {
 
 const toggleSopRecording = async () => {
   if (sopRecording.value) {
+    sopAutoSearchAfterTranscribe = false;
     sopMediaRecorder?.stop();
     return;
   }
@@ -1578,6 +1650,7 @@ const handleSopAudioFile = (event: Event) => {
 const transcribeSopRecording = async (blob: Blob, filename = 'sop.webm') => {
   sopAsrBusy.value = true;
   sopMessage.value = '';
+  let shouldSearch = false;
   try {
     const form = new FormData();
     form.append('file', blob, filename);
@@ -1587,16 +1660,21 @@ const transcribeSopRecording = async (blob: Blob, filename = 'sop.webm') => {
     sopQuery.value = data.text?.trim() || '';
     if (!sopQuery.value) {
       sopMessage.value = '语音识别失败,请改用文字输入';
+    } else {
+      shouldSearch = sopAutoSearchAfterTranscribe;
     }
   } catch {
     sopMessage.value = '语音识别失败,请改用文字输入';
   } finally {
+    sopAutoSearchAfterTranscribe = false;
     sopAsrBusy.value = false;
   }
+  if (shouldSearch) void searchSopKnowledge();
 };
 
 const openUserPracticePanel = () => {
-  activeTabLabel.value = '训练';
+  activeTabLabel.value = '练';
+  userBuildingOpen.value = false;
   activeUserPanel.value = 'tasks';
   userReviewDetail.value = null;
   userReviewMessage.value = '';
@@ -1698,6 +1776,84 @@ const searchSopKnowledge = async () => {
   }
 };
 
+const askMentorChip = (query: string) => {
+  openSopPanel();
+  sopQuery.value = query;
+  void searchSopKnowledge();
+};
+
+const openMentorTextAsk = () => {
+  openSopPanel();
+  void nextTick(() => sopTextInput.value?.focus());
+};
+
+const supportsSopVoiceRecording = () => !sopUseAudioFileFallback.value && !!navigator.mediaDevices?.getUserMedia && typeof MediaRecorder !== 'undefined';
+
+const cleanupMentorVoicePress = () => {
+  mentorVoicePressing = false;
+  window.removeEventListener('pointerup', stopMentorVoicePress);
+  window.removeEventListener('pointercancel', stopMentorVoicePress);
+  window.removeEventListener('touchend', stopMentorVoicePress);
+  window.removeEventListener('touchcancel', stopMentorVoicePress);
+};
+
+const stopMentorVoicePress = (event?: Event) => {
+  event?.preventDefault();
+  if (!mentorVoicePressing) return;
+  cleanupMentorVoicePress();
+  if (sopUseAudioFileFallback.value) return;
+  if (sopRecording.value) {
+    sopAutoSearchAfterTranscribe = true;
+    sopMediaRecorder?.stop();
+  }
+};
+
+const startMentorVoicePress = async (event: Event) => {
+  if (event.type === 'touchstart' && 'PointerEvent' in window) return;
+  event.preventDefault();
+  if (mentorVoicePressing || sopAsrBusy.value || sopLoading.value) return;
+  mentorVoicePressing = true;
+  window.addEventListener('pointerup', stopMentorVoicePress);
+  window.addEventListener('pointercancel', stopMentorVoicePress);
+  window.addEventListener('touchend', stopMentorVoicePress);
+  window.addEventListener('touchcancel', stopMentorVoicePress);
+  openSopPanel();
+  await nextTick();
+  if (!supportsSopVoiceRecording()) {
+    cleanupMentorVoicePress();
+    sopUseAudioFileFallback.value = true;
+    sopAudioInput.value?.click();
+    return;
+  }
+  await toggleSopRecording();
+  if (!sopRecording.value) cleanupMentorVoicePress();
+};
+
+const startAgendaPractice = () => {
+  openUserPracticePanel();
+  void startMobilePractice();
+};
+
+const openPendingReview = () => {
+  if (pendingPracticeReview.value) void openUserHistory(pendingPracticeReview.value);
+};
+
+const openMentorMapAction = (key: MentorMapActionKey) => {
+  if (key === 'ask') {
+    openSopPanel();
+    return;
+  }
+  if (key === 'practice') {
+    openUserPracticePanel();
+    return;
+  }
+  if (key === 'learn') {
+    openBuildingPage('岗前课程');
+    return;
+  }
+  openUserAction('submit');
+};
+
 const searchKnowledge = async (query = knowledgeQuery.value, category = activeUserPanel.value === 'cases' ? 'case' : 'sop') => {
   const cleaned = query.trim();
   if (!cleaned) {
@@ -1725,7 +1881,7 @@ const searchKnowledge = async (query = knowledgeQuery.value, category = activeUs
 };
 
 const switchKnowledgePanel = (panel: Extract<UserPanelKey, 'sop' | 'cases'>) => {
-  activeTabLabel.value = '知识';
+  activeTabLabel.value = roleKey.value === 'user' ? '问' : '知识';
   activeUserPanel.value = panel;
   navigatePath(roleKey.value === 'candidate' ? candidatePanelPath(panel) : userPanelPath(panel));
   knowledgeQuery.value =
@@ -1799,7 +1955,8 @@ const openUserAction = (panel: UserPanelKey) => {
   }
 
   activeTabLabel.value =
-    ({ tasks: '训练', sop: '知识', cases: '知识', submit: '知识', profile: '我的', history: '我的', recommend: '知识' } as Partial<Record<UserPanelKey, string>>)[panel] || '首页';
+    ({ tasks: '练', sop: '问', cases: '问', submit: '我', profile: '我', history: '我', recommend: '问' } as Partial<Record<UserPanelKey, string>>)[panel] || '今日';
+  userBuildingOpen.value = false;
   activeUserPanel.value = panel;
   userReviewDetail.value = null;
   userReviewMessage.value = '';
@@ -1921,6 +2078,15 @@ const openSupervisorTool = (item: ToolItem) => {
   tap(item.title);
 };
 
+const isTabActive = (label: string) => {
+  if (roleKey.value !== 'user') return activeTabLabel.value === label;
+  if (label === '今日') return activeTabLabel.value === '今日' || activeTabLabel.value === '首页';
+  if (label === '练') return activeTabLabel.value === '练' || activeTabLabel.value === '训练';
+  if (label === '问') return sopPanelOpen.value || activeTabLabel.value === '问' || activeTabLabel.value === '知识';
+  if (label === '我') return activeTabLabel.value === '我' || activeTabLabel.value === '我的';
+  return activeTabLabel.value === label;
+};
+
 const openTab = (label: string) => {
   scrollToTop();
   activeTabLabel.value = label;
@@ -1972,22 +2138,23 @@ const openTab = (label: string) => {
     return;
   }
 
-  if (label === '首页') {
+  if (label === '首页' || label === '今日') {
     activeUserPanel.value = '';
     userReviewDetail.value = null;
     userReviewMessage.value = '';
+    userBuildingOpen.value = false;
     syncPath();
     return;
   }
-  if (label === '训练') {
+  if (label === '训练' || label === '练') {
     openUserAction('tasks');
     return;
   }
-  if (label === '知识') {
-    switchKnowledgePanel('sop');
+  if (label === '知识' || label === '问') {
+    openSopPanel();
     return;
   }
-  if (label === '我的') {
+  if (label === '我的' || label === '我') {
     openUserAction('profile');
     return;
   }
@@ -2034,7 +2201,8 @@ const reviewDetailPlaceholder = (id: number): PracticeReviewDetail => ({
 
 
 const openUserHistory = async (item: PracticeRecord) => {
-  activeTabLabel.value = '我的';
+  activeTabLabel.value = '我';
+  userBuildingOpen.value = false;
   if (!item.id) {
     activeUserPanel.value = 'history';
     userReviewMessage.value = '这条训练记录暂无复盘详情';
@@ -2428,10 +2596,10 @@ const loginBySms = async () => {
 };
 
 const employeeTabs: TabItem[] = [
-  { label: '首页', icon: 'home', active: true },
-  { label: '训练', icon: 'graduation', active: false },
-  { label: '知识', icon: 'book', active: false },
-  { label: '我的', icon: 'user', active: false }
+  { label: '今日', icon: 'home', active: true },
+  { label: '练', icon: 'graduation', active: false },
+  { label: '问', icon: 'book', active: false },
+  { label: '我', icon: 'user', active: false }
 ];
 
 const fallbackHomes: Record<RoleKey, RoleHome> = {
@@ -2624,9 +2792,10 @@ const applyRouteFromLocation = () => {
   const route = readRoute();
   applyingRoute = true;
   roleKey.value = route.role;
-  activeTabLabel.value = '首页';
+  activeTabLabel.value = homeTabLabel();
   activeUserPanel.value = '';
   activeSupervisorPanel.value = '';
+  userBuildingOpen.value = false;
   selectedReview.value = null;
   userReviewDetail.value = null;
   reviewMessage.value = '';
@@ -2635,39 +2804,40 @@ const applyRouteFromLocation = () => {
 
   if (route.role === 'user') {
     if (route.page === 'training') {
-      activeTabLabel.value = '训练';
+      activeTabLabel.value = '练';
       activeUserPanel.value = 'tasks';
       void fetchPracticeData();
     } else if (route.page === 'knowledge') {
-      activeTabLabel.value = '知识';
-      activeUserPanel.value = 'sop';
-      knowledgeQuery.value = '住宅投诉处理流程';
-      void searchKnowledge(knowledgeQuery.value, 'sop');
+      activeTabLabel.value = '今日';
+      sopReturnTabLabel.value = '今日';
+      sopReturnPath.value = rolePaths.user;
+      sopPanelOpen.value = true;
     } else if (route.page === 'cases') {
-      activeTabLabel.value = '知识';
+      activeTabLabel.value = '问';
       activeUserPanel.value = 'cases';
       knowledgeQuery.value = '投诉接待优秀案例';
       void searchKnowledge(knowledgeQuery.value, 'case');
     } else if (route.page === 'submit') {
-      activeTabLabel.value = '知识';
+      activeTabLabel.value = '我';
       activeUserPanel.value = 'submit';
     } else if (route.page === 'profile') {
-      activeTabLabel.value = '我的';
+      activeTabLabel.value = '我';
       activeUserPanel.value = 'profile';
       void fetchPracticeData();
     } else if (route.page === 'history') {
-      activeTabLabel.value = '我的';
+      activeTabLabel.value = '我';
       activeUserPanel.value = 'history';
       void fetchPracticeData();
       const id = Number(route.detail);
       if (Number.isFinite(id) && id > 0) void loadUserReviewDetail(id);
     } else if (route.page === 'recommend') {
-      activeTabLabel.value = '知识';
-      activeUserPanel.value = 'sop';
-      knowledgeQuery.value = '催费沟通专项';
-      void searchKnowledge(knowledgeQuery.value, 'sop');
+      activeTabLabel.value = '今日';
+      sopReturnTabLabel.value = '今日';
+      sopReturnPath.value = rolePaths.user;
+      sopQuery.value = '催费沟通专项';
+      sopPanelOpen.value = true;
     } else if (route.page === 'sop') {
-      sopReturnTabLabel.value = '首页';
+      sopReturnTabLabel.value = '今日';
       sopReturnPath.value = rolePaths.user;
       sopPanelOpen.value = true;
     }
@@ -2747,8 +2917,9 @@ watch(
     apiHome.value = null;
     reviewMessage.value = '';
     userReviewMessage.value = '';
-    activeTabLabel.value = '首页';
+    activeTabLabel.value = homeTabLabel();
     sopPanelOpen.value = false;
+    userBuildingOpen.value = false;
     if (roleKey.value !== 'user') {
       activeUserPanel.value = '';
       userReviewDetail.value = null;
@@ -2772,6 +2943,8 @@ watch(
 applyRouteFromLocation();
 
 const role = computed(() => (apiHome.value?.role === roleKey.value ? apiHome.value : fallbackHomes[roleKey.value]));
+// 员工端 tab 由 P1 设计钉死(今日/练/问/我),不跟随后端 home 接口的旧文案;其余端沿用 role.tabs
+const visibleTabs = computed<TabItem[]>(() => (roleKey.value === 'user' ? employeeTabs : role.value.tabs));
 const workerRole = computed(
   () =>
     role.value as RoleHome & {
@@ -2825,6 +2998,63 @@ const userPrimaryTask = computed<PrimaryTask>(() => {
   };
 });
 const latestPracticeReview = computed(() => practiceHistory.value[0] || null);
+const pendingPracticeReview = computed(() => practiceHistory.value.find((item) => item.status === '待复盘') || latestPracticeReview.value || null);
+const todayTrainingTask = computed(() => ({
+  title: practiceDataReady.value && userPrimaryTask.value.title ? userPrimaryTask.value.title : '每日小训:催费沟通 8分钟',
+  desc: practiceDataReady.value && userPrimaryTask.value.desc ? userPrimaryTask.value.desc : '学一学更专业，说一说更有效'
+}));
+const reviewAgendaTitle = computed(() => (pendingPracticeReview.value ? `待复盘:${pendingPracticeReview.value.scene || '昨天的投诉对练'}` : '待复盘:昨天的投诉对练'));
+const reviewAgendaDesc = computed(() =>
+  pendingPracticeReview.value ? pendingPracticeReview.value.summary || '复盘提升能力，服务更有底气' : '练完第一场,师傅在这里等你复盘'
+);
+const mentorAgendaCount = computed(() => Math.max(1, 1 + (pendingPracticeReview.value ? 1 : 0)));
+const mentorBubbleText = computed(() => (userPrimaryTask.value?.title ? `王敏,今天先做 ${mentorAgendaCount.value} 件事` : '王敏,今天想练点什么?'));
+const mentorState = computed<MentorState>(() => {
+  if (sopRecording.value) return 'listening';
+  if (sopLoading.value) return 'thinking';
+  if (sopSpeaking.value) return 'speaking';
+  return 'idle';
+});
+const mentorFloatVisible = computed(() => roleKey.value === 'user' && isHomeTab.value && mentorCollapsed.value && !sopPanelOpen.value && !userBuildingOpen.value);
+const restoreMentorHero = () => {
+  mentorCollapsed.value = false;
+  scrollToTop();
+};
+const updateMentorCollapse = () => {
+  mentorScrollRaf = 0;
+  mentorCollapsed.value = roleKey.value === 'user' && isHomeTab.value && !sopPanelOpen.value && !userBuildingOpen.value && window.scrollY > 120;
+};
+const onMentorScroll = () => {
+  if (mentorScrollRaf) return;
+  mentorScrollRaf = window.requestAnimationFrame(updateMentorCollapse);
+};
+const setMentorScrollListening = (enabled: boolean) => {
+  if (enabled && !mentorScrollListening) {
+    window.addEventListener('scroll', onMentorScroll, { passive: true });
+    mentorScrollListening = true;
+    updateMentorCollapse();
+    return;
+  }
+  if (!enabled && mentorScrollListening) {
+    window.removeEventListener('scroll', onMentorScroll);
+    mentorScrollListening = false;
+  }
+  if (!enabled) mentorCollapsed.value = false;
+  if (!enabled && mentorScrollRaf) {
+    window.cancelAnimationFrame(mentorScrollRaf);
+    mentorScrollRaf = 0;
+  }
+};
+watch(
+  () => roleKey.value === 'user' && isHomeTab.value && !sopPanelOpen.value && !userBuildingOpen.value,
+  (enabled) => setMentorScrollListening(enabled),
+  { immediate: true }
+);
+onBeforeUnmount(() => {
+  setMentorScrollListening(false);
+  cleanupMentorVoicePress();
+  window.removeEventListener('popstate', applyRouteFromLocation);
+});
 const ringStyle = (value: number) => ({ '--value': value } as Record<string, string | number>);
 
 const iconPaths: Record<IconName, Array<[string, Record<string, string | number>?]>> = {
@@ -3064,6 +3294,9 @@ const ProgressTile = defineComponent({
   --accent-blue: #2c7ded;
   --accent-blue-light: rgba(87, 154, 255, 0.08);
   --accent-blue-glow: rgba(87, 154, 255, 0.15);
+  --mentor-blue: #2e6be6;
+  --mentor-blue-dark: #1554d1;
+  --mentor-page-bg: #f3f7ff;
 
   --accent-purple: #7367df;
   --accent-purple-light: rgba(144, 131, 245, 0.08);
@@ -3722,6 +3955,608 @@ p {
   margin-top: 0;
 }
 
+.user-redesign {
+  background: var(--mentor-page-bg);
+}
+
+.user-redesign .tabbar button.active {
+  color: var(--mentor-blue);
+  background: rgba(46, 107, 230, 0.1);
+}
+
+.mentor-hero {
+  margin-top: 0;
+  padding: 12px;
+  border: 1px solid rgba(255, 255, 255, 0.8);
+  border-radius: 20px;
+  background: linear-gradient(135deg, #e9f2ff 0%, #ffffff 76%);
+  box-shadow: 0 12px 30px rgba(46, 107, 230, 0.1);
+  display: grid;
+  gap: 10px;
+}
+
+.mentor-topline {
+  min-height: 30px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  color: #102a5c;
+  font-size: 14px;
+  font-weight: 850;
+}
+
+.mentor-role-pill {
+  color: var(--mentor-blue);
+  border-color: rgba(46, 107, 230, 0.15);
+  background: rgba(255, 255, 255, 0.82);
+}
+
+.mentor-main {
+  display: grid;
+  grid-template-columns: 72px minmax(0, 1fr);
+  align-items: center;
+  gap: 10px;
+}
+
+.mentor-avatar {
+  width: 64px;
+  height: 64px;
+  border-radius: 999px;
+  position: relative;
+  border: 3px solid #ffffff;
+  background: #dfeaff;
+  box-shadow: 0 8px 22px rgba(46, 107, 230, 0.18);
+}
+
+.mentor-avatar img {
+  position: relative;
+  z-index: 1;
+  width: 100%;
+  height: 100%;
+  border-radius: inherit;
+  object-fit: cover;
+  display: block;
+}
+
+.mentor-avatar.is-idle img {
+  animation: mentor-breathe 3s ease-in-out infinite;
+}
+
+.mentor-avatar::before,
+.mentor-avatar::after {
+  content: '';
+  position: absolute;
+  inset: -8px;
+  border: 2px solid rgba(46, 107, 230, 0.28);
+  border-radius: inherit;
+  opacity: 0;
+  pointer-events: none;
+}
+
+.mentor-avatar.is-listening::before {
+  animation: mentor-ripple 1.35s ease-out infinite;
+}
+
+.mentor-avatar.is-listening::after {
+  animation: mentor-ripple 1.35s ease-out 0.45s infinite;
+}
+
+.mentor-eyelid {
+  position: absolute;
+  z-index: 2;
+  top: 27px;
+  width: 12px;
+  height: 2px;
+  border-radius: 999px;
+  background: rgba(14, 32, 68, 0.42);
+  transform: scaleY(0);
+  transform-origin: center;
+  pointer-events: none;
+}
+
+.mentor-eyelid-left {
+  left: 21px;
+}
+
+.mentor-eyelid-right {
+  right: 17px;
+}
+
+.mentor-avatar.is-idle .mentor-eyelid {
+  animation: mentor-blink 4s ease-in-out infinite;
+}
+
+.mentor-thinking {
+  position: absolute;
+  z-index: 3;
+  left: 50%;
+  top: -14px;
+  transform: translateX(-50%);
+  display: none;
+  gap: 4px;
+}
+
+.mentor-thinking i {
+  width: 6px;
+  height: 6px;
+  border-radius: 999px;
+  background: var(--mentor-blue);
+  animation: mentor-dot 0.9s ease-in-out infinite;
+}
+
+.mentor-thinking i:nth-child(2) {
+  animation-delay: 0.15s;
+}
+
+.mentor-thinking i:nth-child(3) {
+  animation-delay: 0.3s;
+}
+
+.mentor-avatar.is-thinking .mentor-thinking {
+  display: flex;
+}
+
+.mentor-waves {
+  position: absolute;
+  z-index: 3;
+  right: -28px;
+  top: 18px;
+  display: none;
+  align-items: center;
+  gap: 3px;
+}
+
+.mentor-waves i {
+  width: 4px;
+  height: 15px;
+  border-radius: 999px;
+  background: var(--mentor-blue);
+  transform-origin: center;
+  animation: mentor-wave 0.8s ease-in-out infinite;
+}
+
+.mentor-waves i:nth-child(2) {
+  height: 24px;
+  animation-delay: 0.12s;
+}
+
+.mentor-waves i:nth-child(3) {
+  height: 20px;
+  animation-delay: 0.24s;
+}
+
+.mentor-waves i:nth-child(4) {
+  height: 13px;
+  animation-delay: 0.36s;
+}
+
+.mentor-avatar.is-speaking .mentor-waves {
+  display: flex;
+}
+
+.mentor-copy {
+  min-width: 0;
+  padding: 11px 13px;
+  border-radius: 16px;
+  background: #ffffff;
+  box-shadow: 0 8px 22px rgba(18, 31, 49, 0.07);
+  position: relative;
+}
+
+.mentor-copy::before {
+  content: '';
+  position: absolute;
+  left: -8px;
+  top: 26px;
+  border: 8px solid transparent;
+  border-right-color: #ffffff;
+  border-left: 0;
+}
+
+.mentor-greeting {
+  display: block;
+  color: var(--text-secondary);
+  font-size: 12px;
+  line-height: 1.2;
+  font-weight: 750;
+}
+
+.mentor-copy p {
+  margin-top: 4px;
+  color: var(--text-primary);
+  font-size: 18px;
+  line-height: 1.32;
+  font-weight: 850;
+}
+
+.mentor-actions {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) 118px;
+  gap: 10px;
+}
+
+.mentor-actions button {
+  min-height: 48px;
+  border-radius: 16px;
+  font-size: 15px;
+  font-weight: 850;
+}
+
+.mentor-talk {
+  color: #ffffff;
+  background: linear-gradient(135deg, var(--mentor-blue), var(--mentor-blue-dark));
+  box-shadow: 0 8px 18px rgba(46, 107, 230, 0.24);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 9px;
+  touch-action: none;
+}
+
+.mentor-talk span {
+  width: 34px;
+  height: 34px;
+  border-radius: 999px;
+  display: grid;
+  place-items: center;
+  background: rgba(255, 255, 255, 0.18);
+  font-size: 19px;
+}
+
+.mentor-type {
+  color: var(--text-primary);
+  background: #ffffff;
+  border: 1px solid rgba(46, 107, 230, 0.12);
+  box-shadow: var(--shadow-sm);
+}
+
+.mentor-chip-row {
+  margin-top: 12px;
+  display: flex;
+  gap: 9px;
+  overflow-x: auto;
+  padding: 1px 2px 6px;
+  scrollbar-width: none;
+}
+
+.mentor-chip-row::-webkit-scrollbar {
+  display: none;
+}
+
+.mentor-chip-row button {
+  min-width: max-content;
+  min-height: 42px;
+  padding: 0 12px;
+  border-radius: 999px;
+  color: var(--text-primary);
+  background: #ffffff;
+  box-shadow: 0 7px 18px rgba(18, 31, 49, 0.06);
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 14px;
+  font-weight: 800;
+}
+
+.mentor-chip-row button span {
+  width: 18px;
+  height: 18px;
+  border-radius: 999px;
+  background: rgba(46, 107, 230, 0.14);
+}
+
+.mentor-chip-row button b {
+  color: var(--text-muted);
+  font-size: 18px;
+  line-height: 1;
+}
+
+.home-card {
+  margin-top: 12px;
+  padding: 16px;
+  border: 1px solid rgba(220, 228, 235, 0.72);
+  border-radius: 18px;
+  background: #ffffff;
+  box-shadow: 0 10px 28px rgba(18, 31, 49, 0.06);
+}
+
+.home-card-head {
+  margin-bottom: 12px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+}
+
+.home-card-head h2 {
+  margin: 0;
+  color: var(--text-primary);
+  font-size: 20px;
+  line-height: 1.2;
+  font-weight: 850;
+}
+
+.home-card-head button {
+  min-height: 32px;
+  color: var(--text-secondary);
+  font-size: 13px;
+  font-weight: 800;
+}
+
+.agenda-list {
+  display: grid;
+  gap: 9px;
+}
+
+.agenda-row {
+  min-height: 76px;
+  padding: 12px;
+  border-radius: 14px;
+  background: #f7faff;
+  display: grid;
+  grid-template-columns: 28px minmax(0, 1fr) 76px;
+  align-items: center;
+  gap: 9px;
+}
+
+.agenda-index {
+  width: 26px;
+  height: 26px;
+  border-radius: 999px;
+  color: #ffffff;
+  display: grid;
+  place-items: center;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 900;
+}
+
+.agenda-index.blue {
+  background: var(--mentor-blue);
+}
+
+.agenda-index.orange {
+  background: #ff7a1a;
+}
+
+.agenda-row span {
+  min-width: 0;
+}
+
+.agenda-row b {
+  display: block;
+  color: var(--text-primary);
+  font-size: 15px;
+  line-height: 1.25;
+  font-weight: 850;
+}
+
+.agenda-row small {
+  display: block;
+  margin-top: 5px;
+  color: var(--text-secondary);
+  font-size: 12px;
+  line-height: 1.35;
+  font-weight: 650;
+}
+
+.agenda-action {
+  min-height: 42px;
+  border-radius: 12px;
+  color: #ffffff;
+  font-size: 14px;
+  font-weight: 850;
+}
+
+.agenda-action.blue {
+  background: var(--mentor-blue);
+  box-shadow: 0 7px 16px rgba(46, 107, 230, 0.2);
+}
+
+.agenda-action.orange {
+  background: #ff7a1a;
+  box-shadow: 0 7px 16px rgba(255, 122, 26, 0.18);
+}
+
+.agenda-action:disabled {
+  color: #97a3b6;
+  background: #e9eef7;
+  box-shadow: none;
+  transform: none;
+}
+
+.map-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 10px;
+}
+
+.map-grid button {
+  min-height: 104px;
+  border-radius: 16px;
+  padding: 16px 14px;
+  color: #ffffff;
+  text-align: left;
+  position: relative;
+  overflow: hidden;
+  box-shadow: 0 10px 22px rgba(18, 31, 49, 0.12);
+}
+
+.map-grid button::before {
+  content: '';
+  position: absolute;
+  left: 14px;
+  top: 16px;
+  width: 38px;
+  height: 38px;
+  border-radius: 999px;
+  background: rgba(255, 255, 255, 0.22);
+}
+
+.map-grid span,
+.map-grid small,
+.map-grid b {
+  position: relative;
+  z-index: 1;
+}
+
+.map-grid span {
+  display: block;
+  margin-top: 35px;
+  font-size: 30px;
+  line-height: 1;
+  font-weight: 900;
+}
+
+.map-grid small {
+  display: block;
+  margin-top: 7px;
+  font-size: 13px;
+  line-height: 1.35;
+  font-weight: 750;
+}
+
+.map-grid b {
+  position: absolute;
+  right: 14px;
+  top: 50%;
+  transform: translateY(-50%);
+  font-size: 28px;
+  line-height: 1;
+}
+
+.map-grid .tone-blue {
+  background: linear-gradient(135deg, #2e79ff, #1458dd);
+}
+
+.map-grid .tone-green {
+  background: linear-gradient(135deg, #35c76b, #159a49);
+}
+
+.map-grid .tone-orange {
+  background: linear-gradient(135deg, #ffae2b, #ff7416);
+}
+
+.map-grid .tone-red {
+  background: linear-gradient(135deg, #ff685b, #f1352c);
+}
+
+.building-page {
+  min-height: calc(100vh - 190px);
+  display: grid;
+  place-items: center;
+  align-content: center;
+  gap: 12px;
+  text-align: center;
+}
+
+.building-icon {
+  width: 72px;
+  height: 72px;
+  border-radius: 24px;
+  background: #ffffff;
+  box-shadow: 0 12px 30px rgba(46, 107, 230, 0.12);
+  display: grid;
+  place-items: center;
+  font-size: 34px;
+}
+
+.building-page h2 {
+  margin: 4px 0 0;
+  color: var(--text-primary);
+  font-size: 28px;
+  line-height: 1.15;
+  font-weight: 900;
+}
+
+.building-page p {
+  max-width: 280px;
+  color: var(--text-secondary);
+  font-size: 15px;
+  line-height: 1.45;
+  font-weight: 650;
+}
+
+.building-page button {
+  min-width: 144px;
+  min-height: 46px;
+  border-radius: 999px;
+  color: #ffffff;
+  background: var(--mentor-blue);
+  box-shadow: 0 8px 18px rgba(46, 107, 230, 0.22);
+  font-weight: 850;
+}
+
+.mentor-float {
+  position: fixed;
+  right: max(18px, calc((100vw - 426px) / 2 + 18px));
+  bottom: calc(92px + env(safe-area-inset-bottom));
+  z-index: 110;
+  width: 56px;
+  height: 56px;
+  padding: 0;
+}
+
+@keyframes mentor-breathe {
+  0%,
+  100% {
+    transform: scale(1);
+  }
+  50% {
+    transform: scale(1.03);
+  }
+}
+
+@keyframes mentor-blink {
+  0%,
+  92%,
+  100% {
+    transform: scaleY(0);
+    opacity: 0;
+  }
+  94%,
+  96% {
+    transform: scaleY(1);
+    opacity: 1;
+  }
+}
+
+@keyframes mentor-ripple {
+  0% {
+    transform: scale(0.85);
+    opacity: 0.55;
+  }
+  100% {
+    transform: scale(1.45);
+    opacity: 0;
+  }
+}
+
+@keyframes mentor-dot {
+  0%,
+  100% {
+    transform: translateY(0);
+    opacity: 0.45;
+  }
+  50% {
+    transform: translateY(-5px);
+    opacity: 1;
+  }
+}
+
+@keyframes mentor-wave {
+  0%,
+  100% {
+    transform: scaleY(0.45);
+    opacity: 0.55;
+  }
+  50% {
+    transform: scaleY(1);
+    opacity: 1;
+  }
+}
+
 .practice-panel {
   margin-top: 14px;
   padding: 16px;
@@ -5138,6 +5973,23 @@ p {
   display: block;
 }
 
+@media (prefers-reduced-motion: reduce) {
+  .mentor-avatar,
+  .mentor-avatar::before,
+  .mentor-avatar::after,
+  .mentor-avatar img,
+  .mentor-eyelid,
+  .mentor-thinking i,
+  .mentor-waves i {
+    animation: none !important;
+    transition: none !important;
+  }
+
+  .mentor-avatar img {
+    transform: none !important;
+  }
+}
+
 @media (max-width: 380px) {
   .page {
     padding-inline: 10px;
@@ -5163,6 +6015,54 @@ p {
     display: none;
   }
 
+  .mentor-hero {
+    padding: 11px;
+    border-radius: 18px;
+  }
+
+  .mentor-main {
+    grid-template-columns: 64px minmax(0, 1fr);
+  }
+
+  .mentor-avatar {
+    width: 58px;
+    height: 58px;
+  }
+
+  .mentor-copy p {
+    font-size: 16px;
+  }
+
+  .mentor-actions {
+    grid-template-columns: minmax(0, 1fr) 108px;
+  }
+
+  .mentor-actions button {
+    min-height: 46px;
+  }
+
+  .agenda-row {
+    grid-template-columns: 26px minmax(0, 1fr);
+  }
+
+  .agenda-action {
+    grid-column: 2;
+    width: 84px;
+  }
+
+  .map-grid {
+    gap: 8px;
+  }
+
+  .map-grid button {
+    min-height: 96px;
+    padding: 14px 12px;
+  }
+
+  .map-grid small {
+    font-size: 12px;
+  }
+
   .task-card > button {
     position: static;
     margin-top: 8px;