diff --git a/web/native/android/app/src/main/AndroidManifest.xml b/web/native/android/app/src/main/AndroidManifest.xml
index 5156edb..8dd2642 100644
--- a/web/native/android/app/src/main/AndroidManifest.xml
+++ b/web/native/android/app/src/main/AndroidManifest.xml
@@ -37,7 +37,8 @@
 
         <receiver
             android:name=".ScheduleWidgetProvider"
-            android:exported="false"
+            android:enabled="true"
+            android:exported="true"
             android:label="@string/widget_schedule_name">
             <intent-filter>
                 <action android:name="android.appwidget.action.APPWIDGET_UPDATE" />
@@ -49,7 +50,8 @@
 
         <receiver
             android:name=".ExamWidgetProvider"
-            android:exported="false"
+            android:enabled="true"
+            android:exported="true"
             android:label="@string/widget_exam_name">
             <intent-filter>
                 <action android:name="android.appwidget.action.APPWIDGET_UPDATE" />
@@ -59,6 +61,32 @@
                 android:resource="@xml/exam_widget_info" />
         </receiver>
 
+        <receiver
+            android:name=".AttendanceWidgetProvider"
+            android:enabled="true"
+            android:exported="true"
+            android:label="@string/widget_attendance_name">
+            <intent-filter>
+                <action android:name="android.appwidget.action.APPWIDGET_UPDATE" />
+            </intent-filter>
+            <meta-data
+                android:name="android.appwidget.provider"
+                android:resource="@xml/attendance_widget_info" />
+        </receiver>
+
+        <receiver
+            android:name=".NotificationsWidgetProvider"
+            android:enabled="true"
+            android:exported="true"
+            android:label="@string/widget_notifications_name">
+            <intent-filter>
+                <action android:name="android.appwidget.action.APPWIDGET_UPDATE" />
+            </intent-filter>
+            <meta-data
+                android:name="android.appwidget.provider"
+                android:resource="@xml/notifications_widget_info" />
+        </receiver>
+
         <provider
             android:name="androidx.core.content.FileProvider"
             android:authorities="${applicationId}.fileprovider"
diff --git a/web/native/android/app/src/main/java/edu/mingxu/jiaowu/AttendanceWidgetProvider.java b/web/native/android/app/src/main/java/edu/mingxu/jiaowu/AttendanceWidgetProvider.java
new file mode 100644
index 0000000..d06f710
--- /dev/null
+++ b/web/native/android/app/src/main/java/edu/mingxu/jiaowu/AttendanceWidgetProvider.java
@@ -0,0 +1,12 @@
+package edu.mingxu.jiaowu;
+
+import android.appwidget.AppWidgetManager;
+import android.appwidget.AppWidgetProvider;
+import android.content.Context;
+
+public class AttendanceWidgetProvider extends AppWidgetProvider {
+    @Override
+    public void onUpdate(Context context, AppWidgetManager manager, int[] appWidgetIds) {
+        WidgetRenderer.updateAttendance(context, manager, appWidgetIds);
+    }
+}
diff --git a/web/native/android/app/src/main/java/edu/mingxu/jiaowu/NotificationsWidgetProvider.java b/web/native/android/app/src/main/java/edu/mingxu/jiaowu/NotificationsWidgetProvider.java
new file mode 100644
index 0000000..b08b59d
--- /dev/null
+++ b/web/native/android/app/src/main/java/edu/mingxu/jiaowu/NotificationsWidgetProvider.java
@@ -0,0 +1,12 @@
+package edu.mingxu.jiaowu;
+
+import android.appwidget.AppWidgetManager;
+import android.appwidget.AppWidgetProvider;
+import android.content.Context;
+
+public class NotificationsWidgetProvider extends AppWidgetProvider {
+    @Override
+    public void onUpdate(Context context, AppWidgetManager manager, int[] appWidgetIds) {
+        WidgetRenderer.updateNotifications(context, manager, appWidgetIds);
+    }
+}
diff --git a/web/native/android/app/src/main/java/edu/mingxu/jiaowu/WidgetRenderer.java b/web/native/android/app/src/main/java/edu/mingxu/jiaowu/WidgetRenderer.java
index 12391d9..270f047 100644
--- a/web/native/android/app/src/main/java/edu/mingxu/jiaowu/WidgetRenderer.java
+++ b/web/native/android/app/src/main/java/edu/mingxu/jiaowu/WidgetRenderer.java
@@ -47,8 +47,14 @@ final class WidgetRenderer {
             new ComponentName(context, ScheduleWidgetProvider.class));
         int[] examIds = manager.getAppWidgetIds(
             new ComponentName(context, ExamWidgetProvider.class));
+        int[] attendanceIds = manager.getAppWidgetIds(
+            new ComponentName(context, AttendanceWidgetProvider.class));
+        int[] notificationIds = manager.getAppWidgetIds(
+            new ComponentName(context, NotificationsWidgetProvider.class));
         updateSchedule(context, manager, scheduleIds);
         updateExams(context, manager, examIds);
+        updateAttendance(context, manager, attendanceIds);
+        updateNotifications(context, manager, notificationIds);
     }
 
     static void updateSchedule(
@@ -90,6 +96,46 @@ final class WidgetRenderer {
             1201);
     }
 
+    static void updateAttendance(
+        Context context,
+        AppWidgetManager manager,
+        int[] appWidgetIds
+    ) {
+        JSONObject payload = payload(context);
+        render(
+            context,
+            manager,
+            appWidgetIds,
+            payload,
+            payload.optJSONArray("attendance"),
+            "课堂签到",
+            "当前没有待签到课程",
+            "attendance",
+            1301);
+    }
+
+    static void updateNotifications(
+        Context context,
+        AppWidgetManager manager,
+        int[] appWidgetIds
+    ) {
+        JSONObject payload = payload(context);
+        int unreadCount = payload.optInt("unreadNotificationCount", 0);
+        String emptyText = unreadCount > 0
+            ? unreadCount + " 条未读通知，打开 App 查看"
+            : "当前没有未读通知";
+        render(
+            context,
+            manager,
+            appWidgetIds,
+            payload,
+            payload.optJSONArray("notifications"),
+            "教务通知",
+            emptyText,
+            "notifications",
+            1401);
+    }
+
     private static void render(
         Context context,
         AppWidgetManager manager,
diff --git a/web/native/android/app/src/main/res/layout/widget_academic.xml b/web/native/android/app/src/main/res/layout/widget_academic.xml
index 915f3d4..c2b0493 100644
--- a/web/native/android/app/src/main/res/layout/widget_academic.xml
+++ b/web/native/android/app/src/main/res/layout/widget_academic.xml
@@ -3,7 +3,7 @@
     android:id="@+id/widget_root"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    android:background="@drawable/widget_background"
+    android:background="#F8FBFF"
     android:clickable="true"
     android:focusable="true"
     android:orientation="vertical"
@@ -15,12 +15,6 @@
         android:gravity="center_vertical"
         android:orientation="horizontal">
 
-        <View
-            android:layout_width="5dp"
-            android:layout_height="22dp"
-            android:layout_marginEnd="9dp"
-            android:background="@drawable/widget_accent" />
-
         <TextView
             android:id="@+id/widget_title"
             android:layout_width="0dp"
@@ -29,7 +23,7 @@
             android:ellipsize="end"
             android:maxLines="1"
             android:text="今日课表"
-            android:textColor="#102652"
+            android:textColor="#152848"
             android:textSize="16sp"
             android:textStyle="bold" />
 
@@ -45,8 +39,8 @@
     <TextView
         android:id="@+id/widget_empty"
         android:layout_width="match_parent"
-        android:layout_height="0dp"
-        android:layout_weight="1"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="20dp"
         android:gravity="center"
         android:text="登录 App 后同步教务数据"
         android:textColor="#61718D"
@@ -54,49 +48,121 @@
 
     <LinearLayout
         android:id="@+id/widget_row_one"
-        style="@style/WidgetAcademicRow">
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="12dp"
+        android:orientation="horizontal">
         <TextView
             android:id="@+id/widget_time_one"
-            style="@style/WidgetAcademicTime" />
-        <LinearLayout style="@style/WidgetAcademicCopy">
+            android:layout_width="76dp"
+            android:layout_height="wrap_content"
+            android:ellipsize="end"
+            android:maxLines="1"
+            android:textColor="#2F8F89"
+            android:textSize="11sp"
+            android:textStyle="bold" />
+        <LinearLayout
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_weight="1"
+            android:orientation="vertical">
             <TextView
                 android:id="@+id/widget_item_title_one"
-                style="@style/WidgetAcademicTitle" />
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:ellipsize="end"
+                android:maxLines="1"
+                android:textColor="#152848"
+                android:textSize="13sp"
+                android:textStyle="bold" />
             <TextView
                 android:id="@+id/widget_item_subtitle_one"
-                style="@style/WidgetAcademicSubtitle" />
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:ellipsize="end"
+                android:maxLines="1"
+                android:textColor="#74839E"
+                android:textSize="10sp" />
         </LinearLayout>
     </LinearLayout>
 
     <LinearLayout
         android:id="@+id/widget_row_two"
-        style="@style/WidgetAcademicRow">
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="10dp"
+        android:orientation="horizontal">
         <TextView
             android:id="@+id/widget_time_two"
-            style="@style/WidgetAcademicTime" />
-        <LinearLayout style="@style/WidgetAcademicCopy">
+            android:layout_width="76dp"
+            android:layout_height="wrap_content"
+            android:ellipsize="end"
+            android:maxLines="1"
+            android:textColor="#2F8F89"
+            android:textSize="11sp"
+            android:textStyle="bold" />
+        <LinearLayout
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_weight="1"
+            android:orientation="vertical">
             <TextView
                 android:id="@+id/widget_item_title_two"
-                style="@style/WidgetAcademicTitle" />
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:ellipsize="end"
+                android:maxLines="1"
+                android:textColor="#152848"
+                android:textSize="13sp"
+                android:textStyle="bold" />
             <TextView
                 android:id="@+id/widget_item_subtitle_two"
-                style="@style/WidgetAcademicSubtitle" />
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:ellipsize="end"
+                android:maxLines="1"
+                android:textColor="#74839E"
+                android:textSize="10sp" />
         </LinearLayout>
     </LinearLayout>
 
     <LinearLayout
         android:id="@+id/widget_row_three"
-        style="@style/WidgetAcademicRow">
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="10dp"
+        android:orientation="horizontal">
         <TextView
             android:id="@+id/widget_time_three"
-            style="@style/WidgetAcademicTime" />
-        <LinearLayout style="@style/WidgetAcademicCopy">
+            android:layout_width="76dp"
+            android:layout_height="wrap_content"
+            android:ellipsize="end"
+            android:maxLines="1"
+            android:textColor="#2F8F89"
+            android:textSize="11sp"
+            android:textStyle="bold" />
+        <LinearLayout
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_weight="1"
+            android:orientation="vertical">
             <TextView
                 android:id="@+id/widget_item_title_three"
-                style="@style/WidgetAcademicTitle" />
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:ellipsize="end"
+                android:maxLines="1"
+                android:textColor="#152848"
+                android:textSize="13sp"
+                android:textStyle="bold" />
             <TextView
                 android:id="@+id/widget_item_subtitle_three"
-                style="@style/WidgetAcademicSubtitle" />
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:ellipsize="end"
+                android:maxLines="1"
+                android:textColor="#74839E"
+                android:textSize="10sp" />
         </LinearLayout>
     </LinearLayout>
 </LinearLayout>
diff --git a/web/native/android/app/src/main/res/values/strings.xml b/web/native/android/app/src/main/res/values/strings.xml
index 4d3c5d9..2a84d9b 100644
--- a/web/native/android/app/src/main/res/values/strings.xml
+++ b/web/native/android/app/src/main/res/values/strings.xml
@@ -14,4 +14,6 @@
     <string name="shortcut_notifications_long">查看教务通知和待办</string>
     <string name="widget_schedule_name">明序今日课表</string>
     <string name="widget_exam_name">明序近期考试</string>
+    <string name="widget_attendance_name">明序课堂签到</string>
+    <string name="widget_notifications_name">明序教务通知</string>
 </resources>
diff --git a/web/native/android/app/src/main/res/xml/attendance_widget_info.xml b/web/native/android/app/src/main/res/xml/attendance_widget_info.xml
new file mode 100644
index 0000000..6ad4607
--- /dev/null
+++ b/web/native/android/app/src/main/res/xml/attendance_widget_info.xml
@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
+    android:description="@string/widget_attendance_name"
+    android:initialLayout="@layout/widget_academic"
+    android:targetCellWidth="3"
+    android:targetCellHeight="2"
+    android:minWidth="180dp"
+    android:minHeight="110dp"
+    android:minResizeWidth="180dp"
+    android:minResizeHeight="110dp"
+    android:maxResizeWidth="530dp"
+    android:maxResizeHeight="450dp"
+    android:resizeMode="horizontal|vertical"
+    android:updatePeriodMillis="1800000"
+    android:widgetCategory="home_screen" />
diff --git a/web/native/android/app/src/main/res/xml/exam_widget_info.xml b/web/native/android/app/src/main/res/xml/exam_widget_info.xml
index cefc9a0..c7957e7 100644
--- a/web/native/android/app/src/main/res/xml/exam_widget_info.xml
+++ b/web/native/android/app/src/main/res/xml/exam_widget_info.xml
@@ -2,9 +2,14 @@
 <appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
     android:description="@string/widget_exam_name"
     android:initialLayout="@layout/widget_academic"
-    android:minWidth="250dp"
-    android:minHeight="120dp"
-    android:previewLayout="@layout/widget_academic"
+    android:targetCellWidth="3"
+    android:targetCellHeight="2"
+    android:minWidth="180dp"
+    android:minHeight="110dp"
+    android:minResizeWidth="180dp"
+    android:minResizeHeight="110dp"
+    android:maxResizeWidth="530dp"
+    android:maxResizeHeight="450dp"
     android:resizeMode="horizontal|vertical"
     android:updatePeriodMillis="1800000"
     android:widgetCategory="home_screen" />
diff --git a/web/native/android/app/src/main/res/xml/notifications_widget_info.xml b/web/native/android/app/src/main/res/xml/notifications_widget_info.xml
new file mode 100644
index 0000000..32c922a
--- /dev/null
+++ b/web/native/android/app/src/main/res/xml/notifications_widget_info.xml
@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
+    android:description="@string/widget_notifications_name"
+    android:initialLayout="@layout/widget_academic"
+    android:targetCellWidth="3"
+    android:targetCellHeight="2"
+    android:minWidth="180dp"
+    android:minHeight="110dp"
+    android:minResizeWidth="180dp"
+    android:minResizeHeight="110dp"
+    android:maxResizeWidth="530dp"
+    android:maxResizeHeight="450dp"
+    android:resizeMode="horizontal|vertical"
+    android:updatePeriodMillis="1800000"
+    android:widgetCategory="home_screen" />
diff --git a/web/native/android/app/src/main/res/xml/schedule_widget_info.xml b/web/native/android/app/src/main/res/xml/schedule_widget_info.xml
index bed285e..8c581e4 100644
--- a/web/native/android/app/src/main/res/xml/schedule_widget_info.xml
+++ b/web/native/android/app/src/main/res/xml/schedule_widget_info.xml
@@ -2,9 +2,14 @@
 <appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android"
     android:description="@string/widget_schedule_name"
     android:initialLayout="@layout/widget_academic"
-    android:minWidth="250dp"
-    android:minHeight="120dp"
-    android:previewLayout="@layout/widget_academic"
+    android:targetCellWidth="3"
+    android:targetCellHeight="2"
+    android:minWidth="180dp"
+    android:minHeight="110dp"
+    android:minResizeWidth="180dp"
+    android:minResizeHeight="110dp"
+    android:maxResizeWidth="530dp"
+    android:maxResizeHeight="450dp"
     android:resizeMode="horizontal|vertical"
     android:updatePeriodMillis="1800000"
     android:widgetCategory="home_screen" />
diff --git a/web/src/services/nativeHome.ts b/web/src/services/nativeHome.ts
index 0c6ceed..79a36f9 100644
--- a/web/src/services/nativeHome.ts
+++ b/web/src/services/nativeHome.ts
@@ -13,6 +13,9 @@ interface WidgetPayload {
   scheduleDate: string
   schedule: WidgetItem[]
   exams: WidgetItem[]
+  attendance: WidgetItem[]
+  notifications: WidgetItem[]
+  unreadNotificationCount: number
   updatedAt: string
 }
 
@@ -128,6 +131,26 @@ function examItems(exams: any[], now: Date): WidgetItem[] {
     }))
 }
 
+function attendanceItems(activities: any[]): WidgetItem[] {
+  return activities.slice(0, 3).map((activity: any) => ({
+    title: String(activity.courseName ?? '待签到课程'),
+    subtitle: [activity.courseCode, activity.sheetName].filter(Boolean).join(' · '),
+    time: activity.checkInAt ? '已签到' : activity.checkInEndsAt
+      ? `截止 ${new Intl.DateTimeFormat('zh-CN', { hour: '2-digit', minute: '2-digit', hour12: false }).format(new Date(activity.checkInEndsAt))}`
+      : '签到进行中',
+  }))
+}
+
+function notificationItems(notifications: any[]): WidgetItem[] {
+  return notifications.filter((item: any) => !item.isRead).slice(0, 3).map((item: any) => ({
+    title: String(item.title ?? '教务通知'),
+    subtitle: String(item.senderName ?? '教务系统'),
+    time: item.createdAt ? new Intl.DateTimeFormat('zh-CN', {
+      month: 'numeric', day: 'numeric', hour: '2-digit', minute: '2-digit', hour12: false,
+    }).format(new Date(item.createdAt)) : '未读',
+  }))
+}
+
 export async function clearNativeWidgets() {
   if (!native) return
   try {
@@ -154,9 +177,13 @@ export async function syncNativeWidgets(force = false) {
       return
     }
 
-    const [timetableResult, examResult] = await Promise.allSettled([
+    const [timetableResult, examResult, notificationResult, attendanceResult] = await Promise.allSettled([
       http.get('/timetables/mine'),
       http.get('/exams/my-schedule'),
+      http.get('/notifications', { params: { page: 1, pageSize: 3, unreadOnly: true } }),
+      roles.includes('Student')
+        ? http.get('/attendance/open-check-ins')
+        : Promise.resolve({ data: [] }),
     ])
     const now = new Date()
     const payload: WidgetPayload = {
@@ -168,6 +195,15 @@ export async function syncNativeWidgets(force = false) {
       exams: examResult.status === 'fulfilled'
         ? examItems(examResult.value.data, now)
         : [],
+      attendance: attendanceResult.status === 'fulfilled'
+        ? attendanceItems(attendanceResult.value.data)
+        : [],
+      notifications: notificationResult.status === 'fulfilled'
+        ? notificationItems(notificationResult.value.data.items ?? [])
+        : [],
+      unreadNotificationCount: notificationResult.status === 'fulfilled'
+        ? Number(notificationResult.value.data.unreadCount ?? 0)
+        : 0,
       updatedAt: now.toISOString(),
     }
     await NativeHome.updateWidgets({ payload })
diff --git a/web/src/style.css b/web/src/style.css
index 9e65cd0..42162bf 100644
--- a/web/src/style.css
+++ b/web/src/style.css
@@ -16,8 +16,9 @@
   --el-color-primary: #233876;
   --el-color-success: #087f73;
   --el-border-radius-base: 7px;
-  --safe-area-top: env(safe-area-inset-top, 0px);
-  --safe-area-bottom: env(safe-area-inset-bottom, 0px);
+  /* Capacitor 8 injects these Android values; env() alone stays at zero in WebView. */
+  --safe-area-top: max(env(safe-area-inset-top, 0px), var(--safe-area-inset-top, 0px));
+  --safe-area-bottom: max(env(safe-area-inset-bottom, 0px), var(--safe-area-inset-bottom, 0px));
 }
 
 * { box-sizing: border-box; }
diff --git a/web/src/views/ExperimentsView.vue b/web/src/views/ExperimentsView.vue
index 32c684b..3b5e93f 100644
--- a/web/src/views/ExperimentsView.vue
+++ b/web/src/views/ExperimentsView.vue
@@ -917,7 +917,7 @@ onMounted(async () => {
               </template>
             </el-table-column>
           </el-table>
-          <el-table v-else :data="group.projects" class="project-table student-project-table" size="small">
+          <el-table v-else :data="group.projects" class="project-table student-project-table desktop-project-table" size="small">
             <el-table-column type="expand" width="44">
               <template #default="{ row }">
                 <div class="student-project-detail">
@@ -988,6 +988,43 @@ onMounted(async () => {
               </template>
             </el-table-column>
           </el-table>
+          <div v-if="isStudent" class="mobile-project-cards">
+            <article v-for="row in group.projects" :key="row.id" class="mobile-project-card">
+              <header>
+                <div>
+                  <span>{{ row.code }}</span>
+                  <h4>{{ row.name }}</h4>
+                </div>
+                <el-tag :type="row.arrangementMode === 'Centralized' ? 'primary' : 'success'" size="small" effect="plain">
+                  {{ modeMeta[row.arrangementMode].label }}
+                </el-tag>
+              </header>
+              <p>{{ row.description || modeMeta[row.arrangementMode].note }}</p>
+              <div class="mobile-project-arrangement">
+                <template v-if="row.arrangementMode === 'Centralized' && row.scheduleEntry">
+                  <b>统一安排</b>
+                  <span>第 {{ row.scheduleEntry.projectWeek ?? `${row.scheduleEntry.startWeek}–${row.scheduleEntry.endWeek}` }} 周 · 星期 {{ row.scheduleEntry.dayOfWeek }} · 第 {{ row.scheduleEntry.startPeriod }}–{{ row.scheduleEntry.startPeriod + row.scheduleEntry.periodCount - 1 }} 节</span>
+                  <small>{{ row.scheduleEntry.campusName }} · {{ row.scheduleEntry.buildingName }} {{ row.scheduleEntry.classroomName }}</small>
+                </template>
+                <template v-else-if="row.arrangementMode === 'SelfScheduled'">
+                  <b>{{ row.myBooking ? '已预约场次' : '选择实验场次' }}</b>
+                  <div v-if="row.sessions.length" class="mobile-session-list">
+                    <article v-for="session in row.sessions" :key="session.id" :class="{ 'is-selected': row.myBooking?.experimentSessionId === session.id }">
+                      <div>
+                        <strong>{{ formatSessionTime(session) }}</strong>
+                        <small>{{ session.campusName }} · {{ session.buildingName }} {{ session.classroomName }}</small>
+                      </div>
+                      <el-tag :type="sessionTagType(session)" size="small" effect="plain">余 {{ session.remainingCount }} / {{ session.capacity }}</el-tag>
+                      <el-button v-if="row.myBooking?.experimentSessionId === session.id" size="small" type="success" disabled>已预约</el-button>
+                      <el-button v-else size="small" type="primary" plain :disabled="row.status !== 'Published' || !!row.myBooking || session.remainingCount <= 0" @click="book(row, session)">预约</el-button>
+                    </article>
+                  </div>
+                  <span v-else class="table-muted">暂无有效实验场次</span>
+                  <el-button v-if="row.myBooking && row.status === 'Published'" class="mobile-cancel-booking" size="small" text type="danger" @click="cancelBooking(row)">取消预约</el-button>
+                </template>
+              </div>
+            </article>
+          </div>
         </div>
       </section>
 
@@ -1593,6 +1630,7 @@ onMounted(async () => {
 .batch-project-cell b, .batch-project-cell small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .batch-project-cell b { color: var(--lab-ink); font-size: 12px; }
 .batch-project-cell small { color: var(--muted); font-size: 10px; }
+.mobile-project-cards { display: none; }
 @media (prefers-reduced-motion: reduce) {
   .session-ticket { transition: none; }
 }
@@ -1611,5 +1649,26 @@ onMounted(async () => {
   .student-project-detail { grid-template-columns: 1fr; }
   .mode-choice { grid-template-columns: 1fr; }
   .intro-actions { flex-wrap: wrap; justify-content: flex-end; }
+  .desktop-project-table { display: none; }
+  .mobile-project-cards { display: grid; gap: 1px; background: #dce5ea; }
+  .mobile-project-card { padding: 15px 14px; background: #fff; }
+  .mobile-project-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
+  .mobile-project-card > header > div { min-width: 0; }
+  .mobile-project-card > header span { color: #68808d; font: 700 10px/1.2 Consolas, monospace; letter-spacing: .06em; }
+  .mobile-project-card h4 { margin: 4px 0 0; color: var(--lab-ink); font-size: 15px; line-height: 1.45; }
+  .mobile-project-card > p { margin: 9px 0 0; color: #667f8d; font-size: 12px; line-height: 1.6; }
+  .mobile-project-arrangement { display: grid; gap: 5px; margin-top: 13px; padding: 11px 12px; border-left: 3px solid #a6bbc6; background: #f6fafb; }
+  .mobile-project-arrangement > b { color: #365364; font-size: 12px; }
+  .mobile-project-arrangement > span { color: #405d6c; font-size: 12px; line-height: 1.5; }
+  .mobile-project-arrangement > small { color: #718792; font-size: 11px; line-height: 1.45; }
+  .mobile-session-list { display: grid; gap: 7px; margin-top: 3px; }
+  .mobile-session-list > article { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding: 9px; border: 1px solid #dce6e9; background: #fff; }
+  .mobile-session-list > article.is-selected { border-color: #69a99d; box-shadow: inset 3px 0 0 var(--lab-teal); }
+  .mobile-session-list > article > div { display: grid; gap: 3px; min-width: 0; }
+  .mobile-session-list strong { color: #304d5d; font-size: 12px; }
+  .mobile-session-list small { overflow: hidden; color: #718792; font-size: 10px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
+  .mobile-session-list .el-button { grid-column: 2; grid-row: 1 / span 2; align-self: center; min-height: 34px; }
+  .mobile-session-list .el-tag { grid-column: 1; width: fit-content; }
+  .mobile-cancel-booking { justify-self: start; margin-top: 2px; }
 }
 </style>
diff --git a/web/src/views/FreeClassroomsView.vue b/web/src/views/FreeClassroomsView.vue
index 8cec236..e8c35bb 100644
--- a/web/src/views/FreeClassroomsView.vue
+++ b/web/src/views/FreeClassroomsView.vue
@@ -535,5 +535,23 @@ h2 {
   .result-panel {
     padding: 16px;
   }
+
+  .building-groups {
+    gap: 14px;
+    margin-top: 16px;
+  }
+
+  .building-groups article > header {
+    padding: 12px;
+  }
+
+  .room-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .room-item {
+    min-height: 76px;
+    padding: 13px 14px;
+  }
 }
 </style>