🎨 style(driver): 重做驱动管理页面布局与交互

- 页面结构：将驱动表格改为卡片列表，移除横向滚动依赖
- 信息展示：新增顶部状态统计，清晰区分全部、已启用、需重装、未启用
- 重装提示：将长原因文案收敛为摘要展示，并支持展开查看完整原因
- 操作优化：集中展示版本、进度、安装、重装、移除、本地导入和日志入口
- 响应式适配：窄屏下驱动卡片自动堆叠，避免内容挤压

frontend/src/App.css

@@ -326,35 +326,194 @@ body[data-theme='light'] .redis-viewer-workbench .ant-radio-button-wrapper-check
     color: #fff !important;
 }
 
-/* 驱动管理：统一关闭 antd sticky 横向条，仅保留自定义独立横向条 */
-.driver-manager-table .ant-table-sticky-scroll {
-    display: none !important;
+.driver-manager-modal .ant-modal-body {
+    background: var(--ant-color-bg-layout, #f5f5f5);
 }
 
-/* 仅在独立横向条激活时隐藏表格自身横向滚动条，避免出现双横向条 */
-.driver-manager-table-wrap.driver-manager-table-wrap-external-active .driver-manager-table .ant-table-content,
-.driver-manager-table-wrap.driver-manager-table-wrap-external-active .driver-manager-table .ant-table-body {
-    overflow-x: auto !important;
-    -ms-overflow-style: none;
-    scrollbar-width: none;
-}
-
-.driver-manager-table-wrap.driver-manager-table-wrap-external-active .driver-manager-table .ant-table-content::-webkit-scrollbar:horizontal,
-.driver-manager-table-wrap.driver-manager-table-wrap-external-active .driver-manager-table .ant-table-body::-webkit-scrollbar:horizontal {
-    height: 0 !important;
-}
-
-.driver-manager-table-wrap {
-    width: 100%;
-    max-width: 100%;
-    overflow-x: hidden;
-}
-
-.driver-manager-footer {
-    width: 100%;
+.driver-manager-shell {
     display: flex;
     flex-direction: column;
+    gap: 14px;
+}
+
+.driver-manager-header {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr) auto;
+    gap: 16px;
+    align-items: stretch;
+    padding: 14px 16px;
+    border: 1px solid rgba(5, 5, 5, 0.08);
+    border-radius: 8px;
+    background: var(--ant-color-bg-container, #fff);
+}
+
+.driver-manager-heading {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+    min-width: 0;
+}
+
+.driver-manager-stats {
+    display: grid;
+    grid-template-columns: repeat(4, minmax(64px, 1fr));
     gap: 8px;
+    min-width: 360px;
+}
+
+.driver-manager-stat {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    justify-content: center;
+    min-height: 58px;
+    padding: 8px 10px;
+    border: 1px solid rgba(5, 5, 5, 0.08);
+    border-radius: 8px;
+    background: rgba(5, 5, 5, 0.02);
+}
+
+.driver-manager-stat span:first-child {
+    font-size: 20px;
+    font-weight: 700;
+    line-height: 1.2;
+}
+
+.driver-manager-stat-warning span:first-child {
+    color: #d48806;
+}
+
+.driver-manager-directory-panel {
+    border: 1px solid rgba(5, 5, 5, 0.08);
+    border-radius: 8px;
+    background: var(--ant-color-bg-container, #fff);
+}
+
+.driver-manager-toolbar {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 10px;
+    align-items: center;
+    justify-content: space-between;
+}
+
+.driver-manager-search {
+    min-width: 280px;
+    flex: 1 1 360px;
+}
+
+.driver-manager-toolbar-actions {
+    justify-content: flex-end;
+}
+
+.driver-manager-list-head {
+    display: flex;
+    justify-content: space-between;
+    gap: 12px;
+    min-height: 24px;
+}
+
+.driver-manager-list {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+}
+
+.driver-manager-card {
+    border: 1px solid rgba(5, 5, 5, 0.08);
+    border-radius: 8px;
+    background: var(--ant-color-bg-container, #fff);
+    overflow: hidden;
+}
+
+.driver-manager-card-warning {
+    border-color: rgba(250, 173, 20, 0.35);
+}
+
+.driver-manager-card-ready {
+    border-color: rgba(82, 196, 26, 0.22);
+}
+
+.driver-manager-card-main {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr) minmax(300px, 38%);
+    gap: 16px;
+    padding: 16px;
+}
+
+.driver-manager-card-info {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    min-width: 0;
+}
+
+.driver-manager-title-row,
+.driver-manager-meta-row {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    align-items: center;
+    min-width: 0;
+}
+
+.driver-manager-driver-name {
+    font-size: 16px;
+}
+
+.driver-manager-meta-row {
+    row-gap: 4px;
+}
+
+.driver-manager-update-note {
+    display: grid;
+    gap: 4px;
+    padding: 10px 12px;
+    border-radius: 8px;
+    background: rgba(250, 173, 20, 0.1);
+}
+
+.driver-manager-note-text,
+.driver-manager-muted-message {
+    margin-bottom: 0 !important;
+}
+
+.driver-manager-muted-message {
+    color: var(--ant-color-text-secondary);
+}
+
+.driver-manager-card-controls {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    min-width: 0;
+}
+
+.driver-manager-control-block {
+    display: grid;
+    gap: 4px;
+}
+
+.driver-manager-control-label,
+.driver-manager-small-text {
+    font-size: 12px;
+}
+
+.driver-manager-version-control {
+    display: grid;
+    gap: 4px;
+}
+
+.driver-manager-version-lock {
+    line-height: 24px;
+}
+
+.driver-manager-card-actions {
+    justify-content: flex-end;
+}
+
+.driver-manager-card-actions .ant-btn {
+    min-width: 88px;
 }
 
 .driver-manager-footer-actions {
@@ -363,17 +522,20 @@ body[data-theme='light'] .redis-viewer-workbench .ant-radio-button-wrapper-check
     justify-content: flex-end;
 }
 
-.driver-manager-hscroll {
-    width: 100%;
-    height: 12px;
-    overflow-x: auto;
-    overflow-y: hidden;
-    scrollbar-gutter: stable;
-    background: transparent;
-}
+@media (max-width: 900px) {
+    .driver-manager-header,
+    .driver-manager-card-main {
+        grid-template-columns: 1fr;
+    }
 
-.driver-manager-hscroll-inner {
-    height: 1px;
+    .driver-manager-stats {
+        min-width: 0;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+    }
+
+    .driver-manager-card-actions {
+        justify-content: flex-start;
+    }
 }
 
 .security-update-action-btn.ant-btn,