Samsung-style edge panel for CMS — swipe to reveal, 2-col grid, expandable

The full picture — how all the pieces fit together

1. The single entry point: the edge handle (4px wide)

• Sits on the right edge of the viewport, vertically centered
• Dark background, thin green line through the middle (the hint)
• Drag it → opens the panel. Tap it → opens. Or just swipe from the edge
• When the panel is open, the handle merges with it (no double visual)

2. The panel itself — slide-in sheet

• 280px wide, full height of viewport
• Dark background (rgba(10,13,16,0.95)) with backdrop-blur — Samsung-style glass
• Slides in from the right with a 300ms cubic-bezier (overshoots slightly, settles)
• Scrim fades in behind (40% black) so the page is dimmed but visible

3. Tabs at the top

• Currently 2: Tools (the CMS tool grid) and Recent (recently-touched sections)
• Future: Saved (the operator's pinned tools), AI (LLM actions), History (undo stack)
• Active tab has green underline + tinted background
• Swipe horizontally inside the body to flip tabs (the second-swipe gesture)

4. The 2-column icon grid (the body)

• 12 tools visible in Tools tab. Each cell: icon + name, rounded 8px card, dark background
• Hover/active state: green border + tinted background
• Badges for "you have history to undo" (the ↶ History cell shows "3")
• Each cell tap → opens that tool as a panel (Structure, Inspector, Media, etc.) on the left dock, sliding the edge panel out

5. The footer (always reachable)

• Bottom-bar items: + Section / + Container / + Widget
• These are the "what to add next" actions — the operator uses them constantly
• Always visible at the bottom of the panel, never scrollable away
• The arrow ▼ next to "Bottom bar" hints that tapping it expands into a fuller bottom-bar view (the same as before, but in a sheet instead of a docked bar)

6. Why this is better than the old approach

• Cleaner default state — only the 4px handle is visible. Visitor mode (Dev OFF) hides even that. Page looks like a normal app
• More tools in less space — 12 tools in a 280px panel vs 4 strips of pills eating 32-64px of viewport
• Tabbed for organization — Tools / Recent / Saved / AI in the future. Each tab is one swipe away
• Bottom-bar footer is persistent — operator never has to scroll to find the + Widget button
• Samsung-familiar gesture — most people know edge swipe from their phone. The mental model is already there
• The Dev icon is still the entry point — clicking also opens the panel. The handle and the icon do the same thing

7. Future — the second-swipe reveal

• Swipe right once → Tools tab. Swipe right again (while panel is open) → opens a SECOND panel on the left side (paired mode, Samsung-style)
• Use case: Structure on the right, Inspector on the left. Operator can edit while seeing the structure
• Or: Tools on the right, Media library on the left while picking an image
• The two panels can be different sizes (e.g. 220px + 280px) — operator can resize the divider