diff --git a/src/App.vue b/src/App.vue
index b80ad57..e0da75e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -156,6 +156,25 @@ const logicalMinutesToTime = (min: number) => {
   return `${String(h).padStart(2, '0')}:${String(m).padStart(2, '0')}`;
 };
 
+const logicalMinutesFromTime = (timeStr: string) => {
+  const [h, m] = timeStr.split(":").map(Number);
+  let total = h * 60 + m;
+  // If hour < 3, it belongs to the "late night" part of our logical day (03:00 to 03:00)
+  if (h < 3) total += 1440;
+  return total - TIME_OFFSET_MINUTES;
+};
+
+// Computed properties for time inputs in the modal
+const startTimeInput = computed({
+  get: () => logicalMinutesToTime(editingEvent.value.start_minute),
+  set: (val) => { editingEvent.value.start_minute = logicalMinutesFromTime(val); }
+});
+
+const endTimeInput = computed({
+  get: () => logicalMinutesToTime(editingEvent.value.end_minute),
+  set: (val) => { editingEvent.value.end_minute = logicalMinutesFromTime(val); }
+});
+
 const updatePreview = async (img: TimelineItem | null) => {
   if (!img || (selectedImage.value?.path === img.path && previewSrc.value)) return;
   selectedImage.value = img;
@@ -319,8 +338,14 @@ const resetTagForm = () => { newTagName.value = ""; newTagParent.value = null; n
         <div class="p-8 border-b flex justify-between items-center"><h2 class="text-2xl font-bold">{{ editingEvent.id ? '编辑事件' : '新增记录' }}</h2><button @click="isEventModalOpen = false"><X :size="24" /></button></div>
         <div class="p-10 space-y-8">
           <div class="flex gap-4">
-            <div class="flex-1 space-y-1"><label class="text-[10px] font-bold text-[#86868B]">开始</label><div class="bg-[#F2F2F7] rounded-xl p-3 text-sm font-bold text-center">{{ logicalMinutesToTime(editingEvent.start_minute) }}</div></div>
-            <div class="flex-1 space-y-1"><label class="text-[10px] font-bold text-[#86868B]">结束</label><div class="bg-[#F2F2F7] rounded-xl p-3 text-sm font-bold text-center">{{ logicalMinutesToTime(editingEvent.end_minute) }}</div></div>
+            <div class="flex-1 space-y-1">
+              <label class="text-[10px] font-bold text-[#86868B]">开始时间</label>
+              <input type="time" v-model="startTimeInput" class="w-full bg-[#F2F2F7] rounded-xl p-3 text-sm font-bold text-center outline-none focus:ring-2 focus:ring-[#007AFF]/20 transition-all" />
+            </div>
+            <div class="flex-1 space-y-1">
+              <label class="text-[10px] font-bold text-[#86868B]">结束时间</label>
+              <input type="time" v-model="endTimeInput" class="w-full bg-[#F2F2F7] rounded-xl p-3 text-sm font-bold text-center outline-none focus:ring-2 focus:ring-[#007AFF]/20 transition-all" />
+            </div>
           </div>
           <div class="space-y-4">
             <div class="space-y-2"><label class="text-[10px] font-bold text-[#86868B]">主标签</label>