[Enhancement] Storyline page: move title, info, stats, and CTA next to Moleskine cover

[realproject7]

Problem

The current 3-zone layout separates the header (Zone 1: cover + identity) from the stats (Zone 2: bordered card below). This wastes the large empty space to the right of the Moleskine cover — especially on desktop. On mobile, the title/info section sits below the cover as a separate block with a divider line, unlike Ridibooks where everything flows naturally next to the cover.

Design Reference

Ridibooks places ALL info next to the cover on both mobile and desktop — title, author, episode count, action button, then info rows below. No separation line. Everything feels unified.

Reference images available in issue comments (PlotLink current vs Ridibooks mobile + desktop).

Solution

Mobile Layout

Everything flows next to the cover in a side-by-side layout (like Ridibooks mobile):

┌──────────────────────────────────┐
│ ┌──────────┐  Title              │
│ │          │  ★★★★★ 5.0 (1) · 40│
│ │ MYSTERY  │  Writer  @project7  │
│ │          │  Genre   Sci-Fi     │
│ │  Book    │                     │
│ │  Title   │                     │
│ │          │                     │
│ │  3 plots │                     │
│ └──────────┘                     │
├──────────────────────────────────┤
│ $124.13 +301%  │  560,445        │
│ Market Cap     │  Supply Minted  │
│────────────────┼─────────────────│
│ 21m 12s        │  0.0133 PLOT    │
│ Deadline       │  Token Price    │
│────────────────┼─────────────────│
│ 3              │  Mar 26, 2026   │
│ Plots          │  Created        │
├──────────────────────────────────┤
│       + Add a new Plot           │
└──────────────────────────────────┘

Key changes from current:

• Title + rating + writer + genre sit NEXT TO the cover (side-by-side), not below it
• No centered cover on mobile — cover is left-aligned with info to the right (like Ridibooks)
• Stats card and button below the cover+info row
• Remove the border-b separation line between hero and stats

Desktop Layout

Same side-by-side, but with more space the stats + button also fit next to the cover:

┌────────────────────────────────────────────────────────────────┐
│ ┌──────────┐  Title                                            │
│ │          │  ★★★★★ 5.0 (1) · 40                              │
│ │ SCI-FI   │  Writer   @project7                               │
│ │          │  Genre    Science Fiction                          │
│ │  Book    │                                                    │
│ │  Title   │  ┌──────────┐ ┌──────────┐ ┌──────────┐          │
│ │          │  │ $124.13  │ │ 560,445  │ │ 21m 12s  │          │
│ │          │  │ +301.2%  │ │ Supply   │ │ Deadline │          │
│ │  3 plots │  │ Mkt Cap  │ │ Minted   │ │          │          │
│ └──────────┘  ├──────────┤ ├──────────┤ ├──────────┤          │
│               │ 0.0133   │ │ 3        │ │ Mar 26   │          │
│               │ Token $  │ │ Plots    │ │ Created  │          │
│               └──────────┘ └──────────┘ └──────────┘          │
│                                                                │
│               ┌──────────────────────────┐                     │
│               │    + Add a new Plot      │                     │
│               └──────────────────────────┘                     │
└────────────────────────────────────────────────────────────────┘

Key changes from current:

• Stats grid sits in the right column, below the info rows but next to the cover
• "Add a new Plot" button is NOT full-width — fits naturally in the right column below stats
• No border-b separation line — the whole header is one unified section
• The right column fills available space via flex-1

Changes Summary

1. Mobile: Cover + info side-by-side (flex-row), not stacked. Cover left-aligned, smaller (~100px wide) to leave room for info
2. Desktop: Stats grid + CTA button move INTO the right column next to the cover (not a separate full-width section below)
3. Remove the border-b divider line between hero and stats sections
4. "Add a new Plot" button: auto-width (not full-width), sits in the right column below stats
5. Remove the separate Zone 2 section — merge everything into one unified header area

Acceptance Criteria

• Mobile: cover + info are side-by-side (cover left, info right)
• Mobile: stats grid (2-col) below the cover+info row
• Desktop: stats grid (3-col) in the right column next to cover, below info rows
• Desktop: button in the right column, not full-width
• No border-b separation line between hero and stats
• Cover left-aligned on mobile (not centered)
• All existing data and logic preserved (deadline, has_deadline, sunset, etc.)

Branch

task/<issue>-storyline-header-unified