✨ hover highlighted sections for feedback

src/renderer/App.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from 'react'
+import { useEffect, useState } from 'react'
 import { FileTree } from './components/FileTree/FileTree'
 import { MarkdownEditor } from './components/Editor/MarkdownEditor'
 import { ChatPanel } from './components/AIChat/ChatPanel'
@@ -9,6 +9,8 @@ import './styles/app.css'
 export default function App(): JSX.Element {
   const { setFileTree, activeFilePath, isDirty, markSaved, activeFileContent, theme, toggleTheme } =
     useEditorStore()
+  const [sidebarOpen, setSidebarOpen] = useState(true)
+  const [chatOpen, setChatOpen] = useState(true)
 
   // Load file tree on mount and apply persisted theme
   useEffect(() => {
@@ -32,16 +34,35 @@ export default function App(): JSX.Element {
   }, [activeFilePath, isDirty, activeFileContent])
 
   return (
-    <div className="app-layout">
+    <div
+      className="app-layout"
+      data-sidebar={sidebarOpen ? 'open' : 'closed'}
+      data-chat={chatOpen ? 'open' : 'closed'}
+    >
       <div className="app-titlebar">
         <span className="app-titlebar-title">Hohoff Editor</span>
-        <button
-          className="app-titlebar-theme-btn"
-          onClick={toggleTheme}
-          title={theme === 'dark' ? 'Switch to light mode' : 'Switch to dark mode'}
-        >
-          {theme === 'dark' ? '☀' : '☾'}
-        </button>
+        <div className="app-titlebar-right">
+          <div className="app-layout-toggle">
+            <button
+              className={`app-layout-toggle-seg${sidebarOpen ? ' active' : ''}`}
+              onClick={() => setSidebarOpen((v) => !v)}
+              title={sidebarOpen ? 'Hide file tree' : 'Show file tree'}
+            />
+            <div className="app-layout-toggle-seg app-layout-toggle-seg--mid" />
+            <button
+              className={`app-layout-toggle-seg${chatOpen ? ' active' : ''}`}
+              onClick={() => setChatOpen((v) => !v)}
+              title={chatOpen ? 'Hide AI chat' : 'Show AI chat'}
+            />
+          </div>
+          <button
+            className="app-titlebar-theme-btn"
+            onClick={toggleTheme}
+            title={theme === 'dark' ? 'Switch to light mode' : 'Switch to dark mode'}
+          >
+            {theme === 'dark' ? '☀' : '☾'}
+          </button>
+        </div>
       </div>
       <aside className="sidebar">
         <FileTree />