Improve quiz note and navigation layout

frontend/src/components/MyNote.jsx

@@ -30,6 +30,7 @@ export default function MyNote({ variant = 'tab' }) {
   const loadedRef = useRef(false)
   const dragRef = useRef(null)
   const draggedRef = useRef(false)
+  const textareaRef = useRef(null)
 
   const loadNote = async () => {
     if (loadedRef.current) return
@@ -107,6 +108,18 @@ export default function MyNote({ variant = 'tab' }) {
     return () => clearTimeout(saveRef.current)
   }, [content])
 
+  useEffect(() => {
+    if (!open || loading) return
+    requestAnimationFrame(() => {
+      const textarea = textareaRef.current
+      if (!textarea) return
+      const end = textarea.value.length
+      textarea.focus()
+      textarea.setSelectionRange(end, end)
+      textarea.scrollTop = textarea.scrollHeight
+    })
+  }, [open, loading])
+
   const openNote = () => {
     setOpen(true)
     loadNote()
@@ -184,6 +197,7 @@ export default function MyNote({ variant = 'tab' }) {
       </div>
       {error && <div className="mynote-error">{error}</div>}
       <textarea
+        ref={textareaRef}
         value={content}
         onChange={e => setContent(e.target.value)}
         placeholder={loading ? 'Loading MyNote...' : 'Capture one running note across all quizzes...'}

frontend/src/pages/QuizPage.jsx

@@ -974,12 +974,12 @@ const timerStarted = timeLeft !== null
         <div className="fill" style={{ width: `${((currentIdx + 1) / totalCount) * 100}%` }} />
       </div>
 
-      {quizNavigation('top')}
-
       {/* Two-column layout: content + desktop sidebar */}
       <div className="quiz-layout">
         {/* Main content */}
         <div style={{ flex: 1, minWidth: 0 }}>
+          {quizNavigation('top')}
+
           {current && (
             <div className="question-card" style={{
               boxShadow: activeReadForCurrent ? '0 0 0 3px rgba(59, 130, 246, 0.22)' : undefined,