Refactor Studio + landing layout system for stable navigation, spacing, and decision-first usability

[Ankit6149]

Problem

The current SignalFlow Studio still feels visually broken, cramped, difficult to scan, and harder to use than the product direction requires. Landing and workspace pages also have inconsistent padding/margin rhythm. The shared side navigation currently scrolls with content, which undermines orientation and makes the shell feel unstable.

Goal

Refactor the shared visual/layout system so the product feels like one calm, professional, decision-first operating system rather than a collection of stacked panels.

Scope

Shared workspace shell

• diagnose and fix the side-nav scroll behavior at the layout root
• desktop nav should remain stable within the viewport while the workspace content scrolls independently
• avoid nested/duplicate scrollbars
• preserve accessible keyboard/focus behavior and mobile drawer behavior
• verify sticky/fixed behavior against viewport height, browser zoom, and long nav groups

Studio / Create

• audit the full Source → Destinations → Review compatibility flow for visual hierarchy and ease of use
• remove cramped/squeezed layouts and unnecessary nested boxes
• establish clear max widths/min widths and use available horizontal space intentionally
• make each stage obvious without exposing irrelevant future/later-stage controls
• reduce visual noise and chunky panels/buttons
• ensure pasted/uploaded media affordances remain understandable
• improve empty/loading/error/review states
• preserve functionality and exact approval semantics

Landing + all workspace surfaces

• establish one spacing scale for page gutters, section gaps, card padding, control spacing, and responsive breakpoints
• fix sections that visually touch edges or have inconsistent top/bottom breathing room
• align landing visual rhythm with WorkspaceShell rather than maintaining two unrelated spacing systems
• maintain warm paper/night palette, restrained gold accent, typography hierarchy, thin borders, compact controls, and low-radius surfaces

Decision-first UX

• Today remains the primary judgment surface
• Signals should emphasize Prepare for review, with manual Find ideas as secondary
• Plan should explain/escalate ambiguity, not become another configuration dashboard
• Create/Studio remains a compatibility/manual path, but must still feel coherent and easy
• no dashboard-card spam and no heavy SaaS admin aesthetic

Acceptance

• side nav no longer scrolls with main content on desktop
• no accidental double-scroll containers
• landing and workspace share consistent gutters/spacing rhythm across desktop/tablet/mobile
• Source, Destinations, Review each use the available width cleanly and are not squeezed
• hierarchy is understandable without instructions: current decision/action is visually obvious
• responsive layout does not overflow or collapse awkwardly
• existing functional tests remain green; add layout/static regression guards for shell scrolling and spacing invariants
• changes are implemented through shared tokens/layout primitives where possible, not per-page margin hacks

Non-goals

• no redesign of product architecture
• no publishing/media/memory scope inside this issue
• no fake future capabilities
• no logo change

This issue should be implemented in small mergeable slices: (1) shell scroll + spacing primitives, (2) Studio stage refactor, (3) landing/workspace spacing alignment, each with tests and CI before merge.