Writer tab v6 — Moleskine left + info right layout (Korean bookstore style)

[realproject7]

Overview

Rename "Stories" tab to "Writer". Redesign with Moleskine book on left + info on right, similar to Korean bookstore app layout (Image 236 in the ticket discussion).

Exact layout specification

Section 1: WRITER STATS (title outside the box)

```
WRITER STATS ← section title, outside/above the box

┌──────────────────────────────────┐
│ Stories: 1 · Plots: 4 │
│ Holders: 2 · Views: 26 │
│ Received: 150.00 PLOT ($2.64) │
└──────────────────────────────────┘
```

• "WRITER STATS" as section title outside the bordered box (not inside)
• "Donated" renamed to "Received" (it's total received donations)
• Remove "Claimable" from stats — not needed here (shown in royalties section per story)

Section 2: STORIES (section title)

```
STORIES ← section title

┌──────────────────────────────────┐
│ ┌─────────┐ │
│ │ SCIENCE │ Straton │
│ │ FICTION │ Plots: 4 · active │
│ │ │ Holders: 2 │
│ │ Straton │ Views: 26 │
│ │ │ Created: Mar 26 │
│ │ 4 plots │ │
│ └─────────┘ │
│ TVL: 528.61 PLOT ($9.30) │
│ Donations: 150 PLOT ($2.64) ×1 │
│──────────────────────────────────│
│ Deadline: 2d 0h 21m 10s │
│──────────────────────────────────│
│ ROYALTIES │
│ Claimable: 4.2289 PLOT ($0.074) │
│ [Claim] │
│ Claimed: 4.2289 PLOT ($0.074) │
└──────────────────────────────────┘
```

Layout details:

Moleskine book (left) + Info (right) — side by side:

• Left: Moleskine book card (same design as home page — genre tag top, title center, plot count bottom)
• Right: stats stacked vertically — title (Lora bold accent), plots + active tag, holders, views, created
• This is a `flex flex-row` or `grid grid-cols-[auto_1fr]` layout

Below the book+info row:

• TVL and Donations on the same level as main page (below Moleskine, like the home page shows TVL/rating below the book)
• Remove Price — not important here

Deadline section:

• Separated by a divider line within the same outer card
• Just the countdown text, no white box

Royalties section:

• Separated by a divider line within the same outer card
• ROYALTIES as sub-header
• Claimable row + Claim button
• Claimed row
• Truncated to 4 decimals
• Own profile only

All sections within ONE bordered card per storyline — use `divide-y` for internal separation.

Mobile behavior (375px):

On very narrow screens, the Moleskine book + info can stack vertically:
```
┌──────────────────────────────────┐
│ ┌─────────────────────────┐ │
│ │ SCIENCE FICTION │ │
│ │ Straton │ │
│ │ 4 plots │ │
│ └─────────────────────────┘ │
│ Plots: 4 · active │
│ Holders: 2 · Views: 26 │
│ Created: Mar 26 │
│ ... │
└──────────────────────────────────┘
```

Use `flex-col sm:flex-row` so it stacks on mobile, side-by-side on tablet+.

Use `/frontend-design` skill

Files to modify

• `src/app/profile/[address]/page.tsx` — rename tab, redesign Stories/Writer section

Branch

`task/730-writer-tab-v6`

Self-Verification (T3)

• Tab renamed from "Stories" to "Writer"
• "WRITER STATS" title is outside/above the box
• "Donated" renamed to "Received"
• "Claimable" removed from Writer Stats
• "STORIES" section title above storyline cards
• Each storyline: Moleskine left + info right (side-by-side on sm+, stacked on mobile)
• TVL + Donations below the book row (no Price)
• Deadline as a separate divider section within the card
• Royalties as a separate divider section (Claimable + Claimed, 4 decimals)
• All within one bordered card per storyline with `divide-y`
• Mobile (375px): stacks gracefully
• `npm run build` passes