Make lesson editor header and toolbar sticky on scroll

Both the controls bar (Save button, publish toggle) and the formatting
toolbar now stick to the top of the viewport while editing long lessons.
Header sticks at top: 0, toolbar sticks just below it at top: 62px.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/components/admin/lesson-editor.tsx

@@ -154,7 +154,22 @@ export function LessonEditor({
   return (
     <div className="space-y-5">
       {/* Header controls */}
-      <div className="flex items-center justify-between gap-2 flex-wrap">
+      <div
+        className="flex items-center justify-between gap-2 flex-wrap"
+        style={{
+          position: "sticky",
+          top: 0,
+          zIndex: 30,
+          background: "var(--background)",
+          marginLeft: "-1.5rem",
+          marginRight: "-1.5rem",
+          paddingLeft: "1.5rem",
+          paddingRight: "1.5rem",
+          paddingTop: "0.75rem",
+          paddingBottom: "0.75rem",
+          borderBottom: "2px solid var(--border)",
+        }}
+      >
         {/* Left: published toggle + prev/next */}
         <div className="flex items-center gap-3">
           <button
@@ -289,7 +304,14 @@ export function LessonEditor({
         {/* Toolbar */}
         <div
           className="flex flex-wrap gap-0.5 p-2"
-          style={{ border: "2px solid var(--border)", borderBottom: "1px solid var(--border)", background: "var(--color-surface)" }}
+          style={{
+            position: "sticky",
+            top: "62px",
+            zIndex: 20,
+            border: "2px solid var(--border)",
+            borderBottom: "1px solid var(--border)",
+            background: "var(--color-surface)",
+          }}
         >
           {/* Text style */}
           <ToolBtn onClick={() => editor?.chain().focus().toggleBold().run()} active={editor?.isActive("bold")}><strong>Ж</strong></ToolBtn>