> ## Documentation Index
> Fetch the complete documentation index at: https://help.helloazhenweb.top/llms.txt
> Use this file to discover all available pages before exploring further.

# Birthday recap report with music stats

> The /report page combines your birthday countdown and music library into a three-tab recap, including a full-screen snap-scrollable song-by-song music report.

The report page at `/report` brings together your birthday countdown and your full music library into a single shareable experience. It is organized into three tabs — Overview, Birthday, and Music Report — each offering a different lens on the same data. The active tab is saved in `sessionStorage` so it persists across page refreshes.

## Tabs

### Overview

The Overview tab is the default landing view. It contains two sections stacked vertically:

**Birthday countdown** — the same days-until-birthday figure from the home page, displayed as a large number in emerald green. If today is the birthday, this reads **生日快乐！** instead.

**Music stats grid** — a 2×2 card grid (4×1 on wider screens) pulled from `lib/music-config.ts`:

| Stat card       | Value source                            | Accent color |
| --------------- | --------------------------------------- | ------------ |
| Total songs     | Count of all songs across playlists     | Emerald      |
| Total playlists | Number of playlists                     | Purple       |
| Favorite genre  | `musicConfig.preferences.favoriteGenre` | Amber        |
| Mood            | `musicConfig.preferences.mood`          | Pink         |

A **进入听歌报告 →** button in the music stats section takes you directly to the Music Report tab.

### Birthday tab

The Birthday tab displays a full-screen, vertically centered countdown — the same component as the one in the Overview section, but presented without any surrounding content so it fills the viewport. This is useful for sharing or displaying on a large screen.

### Music report tab

The Music Report tab is a full-screen, vertically snap-scrolling experience. The navbar and tab bar are hidden so nothing distracts from the content.

Each song in your library gets its own full-viewport section. Inside each section you will find:

* A **full-bleed background image** from the song's `backgroundUrl`, overlaid with a dark gradient
* **Floating lyric lines** drifting across the background (up to five lines from the song's `lyrics` field)
* The **song index** (e.g. `01 / 08`) in the top center
* The **song title** in a large display font
* The **artist name** in emerald
* A **personal description** card — the song's `description` field, or a default message if none is set
* Up to four **lyric cards** arranged in an alternating left/right grid below the main content

A back arrow in the bottom-left corner of each section returns you to the `/report` page.

<Tip>
  On mobile, snap-scroll means swiping up moves cleanly to the next song section. On desktop, use the mouse wheel or trackpad. A subtle animated down-arrow at the bottom of each section (except the last) signals that there is more content below.
</Tip>

## Session persistence

The report remembers which tab you last viewed within the same browser session. If you navigate away and return, you land back on the same tab. Opening a fresh browser tab always starts on the Overview tab.

## Configuring the report content

The songs, descriptions, background images, and lyrics shown in the Music Report all come from `lib/music-config.ts`. See [Configuring music](/customization/music-config) for details on how to add songs, write descriptions, and set background images.