OWB Staking Final 5

Production design system / Yellow buttons / Jura font / 3 multipliers / All 5 states
Based on existing project code + Mike's UX feedback
F1 Evolution
Refined Current
Evolution of existing 2-column layout. Same familiar structure, improved multiplier display, Stake/Unstake toggle, expandable breakdown, gamification hints.
2-Column GridFamiliarProgressive
F2 Gamified
Gamified Progress
SVG progress ring for APY, RPG-style stat cards, duration timeline bar, "level up" messaging. Makes staking feel like character progression.
Progress RingRPG StatsLevel Up
F3 Focused
Story Card
Single centered card (~580px) with narrative top-to-bottom flow. Position, APY, multipliers, rewards, action — all in one focused column. Clean, no clutter.
Single CardNarrativeMinimal
F4 Interactive
Simulator + Action
Two sliders (Amount + Duration) with live APY preview at top, position card in middle, action panel at bottom. Discovery tool meets execution.
SlidersLive PreviewDiscovery
F5 Mobile-First
Mobile-First Multiplier Hero
Max 520px, optimized for CoC audience (PH, ID, NG, UA). APY is the hero, 56px touch targets, everything in thumb zone. Looks great at 375px and 1440px.
Mobile-FirstTouch-FriendlyHero APY