優化自動匯入手機任務列表

config.py

@@ -320,7 +320,7 @@ YOUTUBE_API_KEY = os.getenv('YOUTUBE_API_KEY', '')
 # ==========================================
 # 系統版本與路徑
 # ==========================================
-SYSTEM_VERSION = "V10.132"
+SYSTEM_VERSION = "V10.133"
 LOG_FILE_PATH = os.path.join(BASE_DIR, 'logs/system.log')
 public_url = PUBLIC_URL  # 用於模板顯示
 

web/static/css/page-auto-import-bem.css

@@ -234,6 +234,12 @@
     padding: var(--momo-space-3);
   }
 
+  .ai-notice,
+  .ai-notice__body,
+  .ai-notice code {
+    overflow-wrap: anywhere;
+  }
+
   .ai-toolbar {
     display: grid;
     grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -291,8 +297,10 @@
   display: inline-flex;
   align-items: center;
   gap: var(--momo-space-2);
+  min-width: 0;
   font-family: var(--momo-font-mono);
   color: var(--momo-ink-primary);
+  overflow-wrap: anywhere;
 }
 
 .ai-jobtable__file i { color: var(--momo-warm-olive); }
@@ -408,3 +416,107 @@
   color: var(--momo-ink-tertiary);
   font-size: var(--momo-text-sm);
 }
+
+@media (max-width: 768px) {
+  .auto-import-page .container {
+    max-width: 100%;
+    padding-right: var(--momo-space-3);
+    padding-left: var(--momo-space-3);
+  }
+
+  .ai-card__head {
+    align-items: flex-start;
+    flex-direction: column;
+    gap: var(--momo-space-3);
+  }
+
+  .ai-card__head .btn {
+    width: 100%;
+    min-height: 42px;
+  }
+
+  #jobsTableContainer .table-responsive {
+    overflow: visible;
+  }
+
+  .ai-jobtable,
+  .ai-jobtable thead,
+  .ai-jobtable tbody,
+  .ai-jobtable tr,
+  .ai-jobtable td {
+    display: block;
+    width: 100%;
+  }
+
+  .ai-jobtable thead {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+  }
+
+  .ai-jobtable tbody {
+    display: grid;
+    gap: var(--momo-space-3);
+  }
+
+  .ai-jobtable tr {
+    display: grid;
+    gap: var(--momo-space-2);
+    padding: var(--momo-space-3);
+    background: var(--momo-surface-0);
+    border: 1px solid var(--momo-border-light);
+    border-radius: var(--momo-radius-md);
+    box-shadow: var(--momo-shadow-soft);
+  }
+
+  .ai-jobtable tr:hover td {
+    background: transparent;
+  }
+
+  .ai-jobtable td {
+    display: grid;
+    grid-template-columns: 86px minmax(0, 1fr);
+    gap: var(--momo-space-2);
+    align-items: start;
+    padding: 0;
+    border-bottom: 0;
+    white-space: normal;
+    overflow-wrap: anywhere;
+    text-align: left !important;
+  }
+
+  .ai-jobtable td::before {
+    content: "";
+    color: var(--momo-ink-tertiary);
+    font-family: var(--momo-font-mono);
+    font-size: var(--momo-text-xs);
+    font-weight: var(--momo-font-semibold);
+    line-height: 1.45;
+  }
+
+  .ai-jobtable td:nth-child(1)::before { content: "ID"; }
+  .ai-jobtable td:nth-child(2)::before { content: "檔案"; }
+  .ai-jobtable td:nth-child(3)::before { content: "狀態"; }
+  .ai-jobtable td:nth-child(4)::before { content: "進度"; }
+  .ai-jobtable td:nth-child(5)::before { content: "成功/總"; }
+  .ai-jobtable td:nth-child(6)::before { content: "開始"; }
+  .ai-jobtable td:nth-child(7)::before { content: "完成"; }
+  .ai-jobtable td:nth-child(8)::before { content: "錯誤"; }
+  .ai-jobtable td:nth-child(9)::before { content: "操作"; }
+
+  .ai-jobtable__file {
+    align-items: flex-start;
+    line-height: 1.45;
+  }
+
+  .ai-jobtable__error {
+    max-width: none;
+  }
+
+  .ai-progress {
+    min-width: 0;
+  }
+}