Sequence editor. Layout fixes

index.html

@@ -46,28 +46,27 @@
         Input Text
       </a>
 
+      <a class="sidebar-nav-item" id="nav-sequence-editor" href="#sequence-editor" data-route="sequence-editor" role="button"
+        aria-label="Go to Sequence Editor">
+        <svg class="nav-icon"><use href="web/assets/icons.svg#icon-sequence"></use></svg>
+        Sequence Editor
+      </a>
+
       <a class="sidebar-nav-item" id="nav-stepper-test" href="#stepper-test" data-route="stepper-test" role="button"
         aria-label="Go to Stepper Test">
         <svg class="nav-icon"><use href="web/assets/icons.svg#icon-stepper"></use></svg>
         Stepper Test
       </a>
 
-      <!-- Spacer + coming soon -->
+      <!-- Spacer -->
       <div style="flex:1"></div>
-      <div class="divider"></div>
-      <span class="sidebar-section-label">Coming Soon</span>
-
-      <div class="sidebar-nav-item" style="opacity:0.35;cursor:default" aria-disabled="true">
-        <svg class="nav-icon"><use href="web/assets/icons.svg#icon-sequence"></use></svg>
-        Sequence Editor
-      </div>
     </nav>
 
     <!-- ── Main area ──────────────────────────────────────────────── -->
     <div style="display:flex;flex-direction:column;flex:1;overflow:hidden">
 
       <!-- Top bar -->
-      <header class="topbar" role="banner">
+      <header class="top-bar" style="display:flex; justify-content:space-between; align-items:center; padding: 12px 10px; background: var(--surface-1); border-bottom: 1px solid var(--border);" role="banner">
         <!-- Hamburger -->
         <button class="hamburger" id="hamburger-btn" aria-label="Toggle sidebar" aria-expanded="true"
           aria-controls="sidebar">
@@ -117,12 +116,14 @@
     import StepperSection from './web/js/sections/stepper-test.js';
     import BoardControlSection from './web/js/sections/board-control.js';
     import InputTextSection from './web/js/sections/input-text.js';
+    import SequenceEditorSection from './web/js/sections/sequence-editor.js';
 
     // ── Register routes ────────────────────────────────────────────
     Router.register('home', HomeSection);
     Router.register('stepper-test', StepperSection);
     Router.register('board-control', BoardControlSection);
     Router.register('input-text', InputTextSection);
+    Router.register('sequence-editor', SequenceEditorSection);
 
     // ── Sidebar toggle logic ───────────────────────────────────────
     const sidebar = document.getElementById('sidebar');