Item 13b — Login visual redesign directions

Current: centered shadcn <Card> on bg-gray-50, "Nexus" text title, tooltip-wrapped labels, no brand mark. Goal: lift visual polish to match the rest of the app while keeping login fast + a11y solid. All variants assume PR-1a's Turnstile widget + autofill cleanup is in place. Brand mark = the N gradient badge already used in the sidebar (blue→indigo).

ARecommended

Refined minimal centered

Iterate on what exists. Drop tooltips, add brand badge + product name, raise contrast.

Pros

  • Lowest risk; smallest diff
  • Mobile = unchanged shape, just brand-polished
  • Plays well with TOTP step (replaces fields, card stays)

Cons

  • Doesn't feel "new"
  • Background stays flat
B

Dark gradient, brand-led

Full-bleed dark canvas matching sidebar palette. Card stays on top, dark-mode-styled.

Pros

  • Cohesive w/ sidebar dark surface
  • Feels premium, recent
  • Branding signal is strong at first impression

Cons

  • Dark inputs require careful focus rings + a11y contrast pass
  • Diverges from the rest of the app's white surfaces
C

Split panel (brand left, form right)

Two-column on lg+. Left = brand + pitch line. Right = form. Mobile collapses to centered card.

N
Nexus
Sales dialer + lead pools + softphone. One place to call, book, and close.
v0.4.0 · build aef812d

Pros

  • Most "product launch" look
  • Room for marketing/onboarding copy
  • Distinct identity

Cons

  • Highest LOC + breakpoint complexity
  • Internal tool — pitch copy reads as marketing fluff to agents
  • Mobile collapse = mostly the brand badge wasted
D

Full-bleed gradient, card overlay

Light theme stays; background swaps to sky→indigo→violet gradient. Same card as A.

Pros

  • Splashy without going dark
  • Card stays light = familiar inputs

Cons

  • Generic SaaS gradient — not Nexus-specific
  • Less brand cohesion than B