🎨 style(sidebar-log): 将SQL执行日志入口调整为悬浮胶囊样式

- 移除侧栏底部整条日志入口容器
- 新增悬浮按钮阴影/边框/透明背景并适配明暗主题
- 为树区域预留底部空间避免入口遮挡内容

frontend/src/App.tsx

@@ -238,6 +238,14 @@ function App() {
   // Specific colors
   const bgMain = getBg('#141414', '#ffffff');
   const bgContent = getBg('#1d1d1d', '#ffffff');
+  const floatingLogButtonBorderColor = darkMode ? 'rgba(255,255,255,0.20)' : 'rgba(0,0,0,0.16)';
+  const floatingLogButtonTextColor = darkMode ? 'rgba(255,255,255,0.92)' : 'rgba(0,0,0,0.82)';
+  const floatingLogButtonBgColor = darkMode
+      ? `rgba(34, 34, 34, ${Math.max(effectiveOpacity, 0.82)})`
+      : `rgba(255, 255, 255, ${Math.max(effectiveOpacity, 0.9)})`;
+  const floatingLogButtonShadow = darkMode
+      ? '0 8px 22px rgba(0,0,0,0.38)'
+      : '0 8px 20px rgba(0,0,0,0.16)';
   
   const addTab = useStore(state => state.addTab);
   const activeContext = useStore(state => state.activeContext);
@@ -1059,17 +1067,42 @@ function App() {
                 </div>
             </div>
                 
-                <div style={{ flex: 1, overflow: 'hidden' }}>
+                <div style={{ flex: 1, overflow: 'hidden', paddingBottom: 58 }}>
                     <Sidebar onEditConnection={handleEditConnection} />
                 </div>
 
-                {/* Sidebar Footer for Log Toggle */}
-                <div style={{ padding: '8px', borderTop: 'none', display: 'flex', justifyContent: 'center', flexShrink: 0 }}>
-                    <Button 
-                        type={isLogPanelOpen ? "primary" : "text"}  
-                        icon={<BugOutlined />} 
+                {/* Floating SQL Log Toggle */}
+                <div
+                    style={{
+                        position: 'absolute',
+                        left: 10,
+                        right: 14,
+                        bottom: 10,
+                        zIndex: 20,
+                        pointerEvents: 'none'
+                    }}
+                >
+                    <Button
+                        type={isLogPanelOpen ? "primary" : "text"}
+                        icon={<BugOutlined />}
                         onClick={() => setIsLogPanelOpen(!isLogPanelOpen)}
-                        block
+                        style={isLogPanelOpen ? {
+                            width: '100%',
+                            height: 34,
+                            borderRadius: 999,
+                            boxShadow: floatingLogButtonShadow,
+                            pointerEvents: 'auto'
+                        } : {
+                            width: '100%',
+                            height: 34,
+                            borderRadius: 999,
+                            border: `1px solid ${floatingLogButtonBorderColor}`,
+                            color: floatingLogButtonTextColor,
+                            background: floatingLogButtonBgColor,
+                            boxShadow: floatingLogButtonShadow,
+                            backdropFilter: blurFilter,
+                            pointerEvents: 'auto'
+                        }}
                     >
                         SQL 执行日志
                     </Button>

frontend/src/components/DataGrid.tsx

@@ -593,6 +593,11 @@ const DataGrid: React.FC<DataGridProps> = ({
   const rowModHover = darkMode ? getRowBg(29, 53, 94) : getRowBg(186, 231, 255);
   const selectionAccentHex = darkMode ? '#f6c453' : '#1890ff';
   const selectionAccentRgb = darkMode ? '246, 196, 83' : '24, 144, 255';
+  const darkHighlightTextColor = 'rgba(255, 236, 179, 0.98)';
+  const lightMetaHintColor = '#595959';
+  const lightMetaTooltipColor = '#262626';
+  const columnMetaHintColor = darkMode ? darkHighlightTextColor : lightMetaHintColor;
+  const columnMetaTooltipColor = darkMode ? darkHighlightTextColor : lightMetaTooltipColor;
   
   const [form] = Form.useForm();
   const [modal, contextHolder] = Modal.useModal();
@@ -849,7 +854,7 @@ const DataGrid: React.FC<DataGridProps> = ({
                       style={{
                           marginTop: 2,
                           fontSize: 11,
-                          color: '#8c8c8c',
+                          color: columnMetaHintColor,
                           overflow: 'hidden',
                           textOverflow: 'ellipsis',
                           whiteSpace: 'nowrap',
@@ -864,7 +869,7 @@ const DataGrid: React.FC<DataGridProps> = ({
                       style={{
                           marginTop: 2,
                           fontSize: 11,
-                          color: '#8c8c8c',
+                          color: columnMetaHintColor,
                           overflow: 'hidden',
                           textOverflow: 'ellipsis',
                           whiteSpace: 'nowrap',
@@ -880,13 +885,13 @@ const DataGrid: React.FC<DataGridProps> = ({
       if (hoverLines.length === 0) return titleNode;
       return (
           <Tooltip
-              title={<pre style={{ maxHeight: 260, overflow: 'auto', margin: 0, fontSize: 12, whiteSpace: 'pre-wrap' }}>{hoverLines.join('\n')}</pre>}
+              title={<pre style={{ maxHeight: 260, overflow: 'auto', margin: 0, fontSize: 12, whiteSpace: 'pre-wrap', color: columnMetaTooltipColor }}>{hoverLines.join('\n')}</pre>}
               styles={{ root: { maxWidth: 640 } }}
           >
               <span style={{ display: 'inline-flex', maxWidth: '100%' }}>{titleNode}</span>
           </Tooltip>
       );
-  }, [columnMetaMap, columnMetaMapByLowerName, showColumnComment, showColumnType]);
+  }, [columnMetaHintColor, columnMetaTooltipColor, columnMetaMap, columnMetaMapByLowerName, showColumnComment, showColumnType]);
 
   const closeCellEditor = useCallback(() => {
       setCellEditorOpen(false);

frontend/src/components/LogPanel.tsx

@@ -27,8 +27,9 @@ const LogPanel: React.FC<LogPanelProps> = ({ height, onClose, onResizeStart }) =
         const b = parseInt(hex.substring(4, 6), 16);
         return `rgba(${r}, ${g}, ${b}, ${opacity})`;
     };
-    const bgMain = getBg('#1f1f1f');
-    const bgToolbar = getBg('#2a2a2a');
+    const bgMain = getBg('#1d1d1d');
+    const panelDividerColor = darkMode ? 'rgba(255,255,255,0.08)' : 'rgba(0,0,0,0.08)';
+    const panelMutedTextColor = darkMode ? 'rgba(255,255,255,0.62)' : 'rgba(0,0,0,0.58)';
     const logScrollbarThumb = darkMode ? 'rgba(255, 255, 255, 0.34)' : 'rgba(0, 0, 0, 0.26)';
     const logScrollbarThumbHover = darkMode ? 'rgba(255, 255, 255, 0.5)' : 'rgba(0, 0, 0, 0.36)';
 
@@ -37,7 +38,7 @@ const LogPanel: React.FC<LogPanelProps> = ({ height, onClose, onResizeStart }) =
             title: 'Time',
             dataIndex: 'timestamp',
             width: 80,
-            render: (ts: number) => <span style={{ color: '#888', fontSize: '12px' }}>{new Date(ts).toLocaleTimeString()}</span>
+            render: (ts: number) => <span style={{ color: panelMutedTextColor, fontSize: '12px' }}>{new Date(ts).toLocaleTimeString()}</span>
         },
         {
             title: 'Status',
@@ -62,7 +63,7 @@ const LogPanel: React.FC<LogPanelProps> = ({ height, onClose, onResizeStart }) =
                 <div style={{ fontFamily: 'monospace', wordBreak: 'break-all', fontSize: '12px', lineHeight: '1.2' }}>
                     <div style={{ color: darkMode ? '#a6e22e' : '#005cc5' }}>{text}</div>
                     {record.message && <div style={{ color: '#ff4d4f', marginTop: 2 }}>{record.message}</div>}
-                    {record.affectedRows !== undefined && <div style={{ color: '#888', marginTop: 1 }}>Affected: {record.affectedRows}</div>}
+                    {record.affectedRows !== undefined && <div style={{ color: panelMutedTextColor, marginTop: 1 }}>Affected: {record.affectedRows}</div>}
                 </div>
             )
         }
@@ -71,7 +72,7 @@ const LogPanel: React.FC<LogPanelProps> = ({ height, onClose, onResizeStart }) =
     return (
         <div style={{ 
             height, 
-            borderTop: 'none', 
+            borderTop: `1px solid ${panelDividerColor}`,
             background: bgMain,
             display: 'flex',
             flexDirection: 'column',
@@ -95,7 +96,7 @@ const LogPanel: React.FC<LogPanelProps> = ({ height, onClose, onResizeStart }) =
             {/* Toolbar */}
             <div style={{ 
                 padding: '4px 8px', 
-                borderBottom: 'none',
+                borderBottom: `1px solid ${panelDividerColor}`,
                 display: 'flex',
                 justifyContent: 'space-between',
                 alignItems: 'center',