diff --git a/hunliji-api/hl-api b/hunliji-api/hl-api
index f4aa63d..431f24c 100644
Binary files a/hunliji-api/hl-api and b/hunliji-api/hl-api differ
diff --git a/hunliji-api/main.go b/hunliji-api/main.go
index 3821a55..f0973b4 100644
--- a/hunliji-api/main.go
+++ b/hunliji-api/main.go
@@ -37,6 +37,8 @@ func migrateSchema(db *gorm.DB) {
 		{&models.SiteGift{}, "站点礼物", "site_gifts"},
 		{&models.GiftConfig{}, "礼物兑换配置", "gift_configs"},
 		{&models.AiModerationCache{}, "AI审核缓存", "ai_moderation_caches"},
+		{&models.CashGift{}, "礼金记录", "cash_gifts"},
+		{&models.CashGiftConfig{}, "礼金配置", "cash_gift_configs"},
 		{&visit.SiteVisit{}, "访客记录", "site_visits"},
 	}
 	for _, t := range tables {
diff --git a/hunliji-api/models/models.go b/hunliji-api/models/models.go
index e85d3a5..d58299a 100644
--- a/hunliji-api/models/models.go
+++ b/hunliji-api/models/models.go
@@ -98,3 +98,26 @@ type AiModerationCache struct {
 }
 
 func (AiModerationCache) TableName() string { return "ai_moderation_caches" }
+
+// CashGift 礼金记录
+type CashGift struct {
+	ID        uint      `gorm:"primaryKey;comment:主键ID" json:"id"`
+	Name      string    `gorm:"column:name;size:50;not null;default:'';index;comment:宾客姓名" json:"name"`
+	Amount    int       `gorm:"column:amount;not null;default:0;comment:礼金金额（元）" json:"amount"`
+	Note      string    `gorm:"column:note;size:255;not null;default:'';comment:备注" json:"note"`
+	CreatedAt time.Time `gorm:"column:created_at;not null;index;comment:登记时间" json:"created_at"`
+	UpdatedAt time.Time `gorm:"column:updated_at;comment:更新时间" json:"updated_at"`
+}
+
+func (CashGift) TableName() string { return "cash_gifts" }
+
+// CashGiftConfig 礼金备注快捷选项等配置
+type CashGiftConfig struct {
+	ID        uint      `gorm:"primaryKey;comment:主键ID" json:"id"`
+	NotesData string    `gorm:"type:json;column:notes_data;not null;comment:备注快捷选项JSON数组" json:"notes_data"`
+	ViewPass  string    `gorm:"column:view_pass;size:64;not null;default:'';comment:前台查看全部口令" json:"view_pass"`
+	EntryPass string    `gorm:"column:entry_pass;size:64;not null;default:'';comment:前台记账登记口令" json:"entry_pass"`
+	UpdatedAt time.Time `gorm:"column:updated_at;comment:更新时间" json:"updated_at"`
+}
+
+func (CashGiftConfig) TableName() string { return "cash_gift_configs" }
diff --git a/hunliji-api/router/routers.go b/hunliji-api/router/routers.go
index 7fbc051..a652c55 100644
--- a/hunliji-api/router/routers.go
+++ b/hunliji-api/router/routers.go
@@ -10,6 +10,7 @@ import (
 	"mime/multipart"
 	"net/url"
 	"path/filepath"
+	"strconv"
 	"strings"
 	"time"
 
@@ -204,6 +205,7 @@ func registerAPI(api *gin.RouterGroup) {
 	api.POST("/ai/blessing", handleAIBlessing)
 	api.POST("/rsvp", handleCreateRsvp)
 	api.GET("/rsvp/list", handleRsvpList)
+	api.DELETE("/rsvp/:id", handleDeleteRsvp)
 	api.GET("/danmaku", handlePublicDanmaku)
 	api.POST("/danmaku", handleCreateDanmaku)
 	api.GET("/danmaku/list", handleDanmakuList)
@@ -215,6 +217,20 @@ func registerAPI(api *gin.RouterGroup) {
 	api.GET("/gift/stats", handleGiftStats)
 	api.GET("/gift/costs", handleGetGiftCosts)
 	api.POST("/gift/costs", handleSaveGiftCosts)
+	api.POST("/cash-gift", handleCreateCashGift)
+	api.GET("/cash-gift/recent", handleCashGiftRecent)
+	api.GET("/cash-gift/notes", handleGetCashGiftNotes)
+	api.POST("/cash-gift/notes", handleSaveCashGiftNotes)
+	api.GET("/cash-gift/view-pass", handleGetCashGiftViewPass)
+	api.POST("/cash-gift/view-pass", handleSaveCashGiftViewPass)
+	api.POST("/cash-gift/view/unlock", handleCashGiftViewUnlock)
+	api.GET("/cash-gift/view/list", handleCashGiftViewList)
+	api.GET("/cash-gift/entry-pass", handleGetCashGiftEntryPass)
+	api.POST("/cash-gift/entry-pass", handleSaveCashGiftEntryPass)
+	api.POST("/cash-gift/entry/unlock", handleCashGiftEntryUnlock)
+	api.GET("/cash-gift/list", handleCashGiftList)
+	api.PUT("/cash-gift/:id", handleUpdateCashGift)
+	api.DELETE("/cash-gift/:id", handleDeleteCashGift)
 
 	visit.Register(api, db, utils.RequireAdmin)
 	configsection.Register(api, db, utils.RequireAdmin)
@@ -416,6 +432,27 @@ func handleRsvpList(c *gin.Context) {
 	c.JSON(200, gin.H{"code": 200, "data": list})
 }
 
+func handleDeleteRsvp(c *gin.Context) {
+	if !utils.RequireAdmin(c) {
+		return
+	}
+	id := strings.TrimSpace(c.Param("id"))
+	if id == "" {
+		c.JSON(400, gin.H{"error": "缺少 ID"})
+		return
+	}
+	res := db.Delete(&models.Rsvp{}, id)
+	if res.Error != nil {
+		c.JSON(500, gin.H{"error": "删除失败"})
+		return
+	}
+	if res.RowsAffected == 0 {
+		c.JSON(404, gin.H{"error": "记录不存在"})
+		return
+	}
+	c.JSON(200, gin.H{"code": 200, "msg": "已删除"})
+}
+
 func handlePublicDanmaku(c *gin.Context) {
 	q := db.Where("status = ?", "approved")
 	if after := strings.TrimSpace(c.Query("after_id")); after != "" {
@@ -960,3 +997,526 @@ func collectAlbumImages(configData string) []string {
 	}
 	return images
 }
+
+func handleCreateCashGift(c *gin.Context) {
+	if !requireCashGiftEntryAccess(c) {
+		return
+	}
+	var body struct {
+		Name   string `json:"name"`
+		Amount int    `json:"amount"`
+		Note   string `json:"note"`
+	}
+	if err := c.ShouldBindJSON(&body); err != nil {
+		c.JSON(400, gin.H{"error": "参数错误"})
+		return
+	}
+	name := strings.TrimSpace(body.Name)
+	note := strings.TrimSpace(body.Note)
+	if name == "" {
+		c.JSON(400, gin.H{"error": "请填写姓名"})
+		return
+	}
+	if len([]rune(name)) > 50 {
+		c.JSON(400, gin.H{"error": "姓名过长"})
+		return
+	}
+	if body.Amount <= 0 {
+		c.JSON(400, gin.H{"error": "请填写正确金额"})
+		return
+	}
+	if body.Amount > 10000000 {
+		c.JSON(400, gin.H{"error": "金额过大"})
+		return
+	}
+	if len([]rune(note)) > 200 {
+		c.JSON(400, gin.H{"error": "备注过长"})
+		return
+	}
+	item := models.CashGift{
+		Name:   name,
+		Amount: body.Amount,
+		Note:   note,
+	}
+	if err := db.Create(&item).Error; err != nil {
+		c.JSON(500, gin.H{"error": "保存失败"})
+		return
+	}
+	c.JSON(200, gin.H{"code": 200, "msg": "已登记", "data": item})
+}
+
+func handleCashGiftRecent(c *gin.Context) {
+	if !requireCashGiftEntryAccess(c) {
+		return
+	}
+	limit := 3
+	if v := strings.TrimSpace(c.Query("limit")); v != "" {
+		if n, err := strconv.Atoi(v); err == nil && n > 0 && n <= 20 {
+			limit = n
+		}
+	}
+	var list []models.CashGift
+	db.Order("created_at desc, id desc").Limit(limit).Find(&list)
+	c.JSON(200, gin.H{"code": 200, "data": list})
+}
+
+func defaultCashGiftNotes() []string {
+	return []string{
+		"男方亲戚", "女方亲戚",
+		"男方朋友", "女方朋友",
+		"男方同学", "女方同学",
+		"男方同事", "女方同事",
+		"男方邻居", "女方邻居",
+		"其他",
+	}
+}
+
+func normalizeCashGiftNotes(raw []string) []string {
+	seen := map[string]bool{}
+	out := make([]string, 0, len(raw))
+	for _, s := range raw {
+		s = strings.TrimSpace(s)
+		if s == "" || seen[s] {
+			continue
+		}
+		if len([]rune(s)) > 30 {
+			s = string([]rune(s)[:30])
+		}
+		seen[s] = true
+		out = append(out, s)
+		if len(out) >= 40 {
+			break
+		}
+	}
+	return out
+}
+
+func loadCashGiftNotes() []string {
+	var cfg models.CashGiftConfig
+	if err := db.First(&cfg, 1).Error; err != nil || strings.TrimSpace(cfg.NotesData) == "" {
+		return defaultCashGiftNotes()
+	}
+	var notes []string
+	if err := json.Unmarshal([]byte(cfg.NotesData), &notes); err != nil {
+		return defaultCashGiftNotes()
+	}
+	notes = normalizeCashGiftNotes(notes)
+	if len(notes) == 0 {
+		return defaultCashGiftNotes()
+	}
+	return notes
+}
+
+func saveCashGiftNotes(notes []string) error {
+	notes = normalizeCashGiftNotes(notes)
+	if len(notes) == 0 {
+		notes = defaultCashGiftNotes()
+	}
+	raw, err := json.Marshal(notes)
+	if err != nil {
+		return err
+	}
+	var cfg models.CashGiftConfig
+	if err := db.First(&cfg, 1).Error; err != nil {
+		cfg = models.CashGiftConfig{ID: 1, NotesData: string(raw)}
+		return db.Create(&cfg).Error
+	}
+	cfg.NotesData = string(raw)
+	return db.Save(&cfg).Error
+}
+
+func loadCashGiftViewPass() string {
+	var cfg models.CashGiftConfig
+	if err := db.First(&cfg, 1).Error; err != nil {
+		return ""
+	}
+	return strings.TrimSpace(cfg.ViewPass)
+}
+
+func loadCashGiftEntryPass() string {
+	var cfg models.CashGiftConfig
+	if err := db.First(&cfg, 1).Error; err != nil {
+		return ""
+	}
+	return strings.TrimSpace(cfg.EntryPass)
+}
+
+func saveCashGiftViewPass(pass string) error {
+	pass = strings.TrimSpace(pass)
+	if len([]rune(pass)) > 64 {
+		pass = string([]rune(pass)[:64])
+	}
+	var cfg models.CashGiftConfig
+	if err := db.First(&cfg, 1).Error; err != nil {
+		notes, _ := json.Marshal(defaultCashGiftNotes())
+		cfg = models.CashGiftConfig{ID: 1, NotesData: string(notes), ViewPass: pass}
+		return db.Create(&cfg).Error
+	}
+	cfg.ViewPass = pass
+	return db.Save(&cfg).Error
+}
+
+func saveCashGiftEntryPass(pass string) error {
+	pass = strings.TrimSpace(pass)
+	if len([]rune(pass)) > 64 {
+		pass = string([]rune(pass)[:64])
+	}
+	var cfg models.CashGiftConfig
+	if err := db.First(&cfg, 1).Error; err != nil {
+		notes, _ := json.Marshal(defaultCashGiftNotes())
+		cfg = models.CashGiftConfig{ID: 1, NotesData: string(notes), EntryPass: pass}
+		return db.Create(&cfg).Error
+	}
+	cfg.EntryPass = pass
+	return db.Save(&cfg).Error
+}
+
+func cashGiftViewTokenFromRequest(c *gin.Context) string {
+	if t := strings.TrimSpace(c.GetHeader("X-Cash-Gift-Token")); t != "" {
+		return t
+	}
+	return utils.BearerToken(c)
+}
+
+func cashGiftEntryTokenFromRequest(c *gin.Context) string {
+	if t := strings.TrimSpace(c.GetHeader("X-Cash-Gift-Entry-Token")); t != "" {
+		return t
+	}
+	return utils.BearerToken(c)
+}
+
+func requireCashGiftViewAccess(c *gin.Context) bool {
+	token := cashGiftViewTokenFromRequest(c)
+	if utils.VerifyCashGiftViewToken(token) {
+		return true
+	}
+	if utils.VerifyToken(token) {
+		return true
+	}
+	c.JSON(403, gin.H{"error": "请先输入查看口令"})
+	return false
+}
+
+func requireCashGiftEntryAccess(c *gin.Context) bool {
+	token := cashGiftEntryTokenFromRequest(c)
+	if utils.VerifyCashGiftEntryToken(token) {
+		return true
+	}
+	if utils.VerifyToken(token) {
+		return true
+	}
+	c.JSON(403, gin.H{"error": "请先输入记账口令"})
+	return false
+}
+
+func handleGetCashGiftViewPass(c *gin.Context) {
+	if !utils.RequireAdmin(c) {
+		return
+	}
+	pass := loadCashGiftViewPass()
+	c.JSON(200, gin.H{
+		"code": 200,
+		"data": gin.H{
+			"has_pass": pass != "",
+			"password": pass,
+		},
+	})
+}
+
+func handleSaveCashGiftViewPass(c *gin.Context) {
+	if !utils.RequireAdmin(c) {
+		return
+	}
+	var body struct {
+		Password string `json:"password"`
+	}
+	if err := c.ShouldBindJSON(&body); err != nil {
+		c.JSON(400, gin.H{"error": "参数错误"})
+		return
+	}
+	pass := strings.TrimSpace(body.Password)
+	if pass == "" {
+		c.JSON(400, gin.H{"error": "请设置查看口令"})
+		return
+	}
+	if err := saveCashGiftViewPass(pass); err != nil {
+		c.JSON(500, gin.H{"error": "保存失败"})
+		return
+	}
+	c.JSON(200, gin.H{"code": 200, "msg": "口令已保存", "data": gin.H{"has_pass": true}})
+}
+
+func handleCashGiftViewUnlock(c *gin.Context) {
+	var body struct {
+		Password string `json:"password"`
+	}
+	if err := c.ShouldBindJSON(&body); err != nil {
+		c.JSON(400, gin.H{"error": "参数错误"})
+		return
+	}
+	pass := loadCashGiftViewPass()
+	if pass == "" {
+		c.JSON(403, gin.H{"error": "尚未配置查看口令，请先在后台设置"})
+		return
+	}
+	if strings.TrimSpace(body.Password) != pass {
+		c.JSON(403, gin.H{"error": "口令错误"})
+		return
+	}
+	c.JSON(200, gin.H{
+		"code": 200,
+		"msg":  "已解锁",
+		"data": gin.H{"token": utils.SignCashGiftViewToken()},
+	})
+}
+
+func handleGetCashGiftEntryPass(c *gin.Context) {
+	if !utils.RequireAdmin(c) {
+		return
+	}
+	pass := loadCashGiftEntryPass()
+	c.JSON(200, gin.H{
+		"code": 200,
+		"data": gin.H{
+			"has_pass": pass != "",
+			"password": pass,
+		},
+	})
+}
+
+func handleSaveCashGiftEntryPass(c *gin.Context) {
+	if !utils.RequireAdmin(c) {
+		return
+	}
+	var body struct {
+		Password string `json:"password"`
+	}
+	if err := c.ShouldBindJSON(&body); err != nil {
+		c.JSON(400, gin.H{"error": "参数错误"})
+		return
+	}
+	pass := strings.TrimSpace(body.Password)
+	if pass == "" {
+		c.JSON(400, gin.H{"error": "请设置记账口令"})
+		return
+	}
+	if err := saveCashGiftEntryPass(pass); err != nil {
+		c.JSON(500, gin.H{"error": "保存失败"})
+		return
+	}
+	c.JSON(200, gin.H{"code": 200, "msg": "口令已保存", "data": gin.H{"has_pass": true}})
+}
+
+func handleCashGiftEntryUnlock(c *gin.Context) {
+	var body struct {
+		Password string `json:"password"`
+	}
+	if err := c.ShouldBindJSON(&body); err != nil {
+		c.JSON(400, gin.H{"error": "参数错误"})
+		return
+	}
+	pass := loadCashGiftEntryPass()
+	if pass == "" {
+		c.JSON(403, gin.H{"error": "尚未配置记账口令，请先在后台设置"})
+		return
+	}
+	if strings.TrimSpace(body.Password) != pass {
+		c.JSON(403, gin.H{"error": "口令错误"})
+		return
+	}
+	c.JSON(200, gin.H{
+		"code": 200,
+		"msg":  "已解锁",
+		"data": gin.H{"token": utils.SignCashGiftEntryToken()},
+	})
+}
+
+func handleCashGiftViewList(c *gin.Context) {
+	if !requireCashGiftViewAccess(c) {
+		return
+	}
+	q := strings.TrimSpace(c.Query("q"))
+	note := strings.TrimSpace(c.Query("note"))
+	side := strings.TrimSpace(c.Query("side")) // male | female | other | ""
+	sortKey := strings.TrimSpace(c.Query("sort"))
+	minAmount := 0
+	maxAmount := 0
+	if v := strings.TrimSpace(c.Query("min")); v != "" {
+		if n, err := strconv.Atoi(v); err == nil && n > 0 {
+			minAmount = n
+		}
+	}
+	if v := strings.TrimSpace(c.Query("max")); v != "" {
+		if n, err := strconv.Atoi(v); err == nil && n > 0 {
+			maxAmount = n
+		}
+	}
+
+	tx := db.Model(&models.CashGift{})
+	if q != "" {
+		like := "%" + q + "%"
+		tx = tx.Where("name LIKE ? OR note LIKE ?", like, like)
+	}
+	if note != "" {
+		tx = tx.Where("note = ?", note)
+	}
+	switch side {
+	case "male":
+		tx = tx.Where("note LIKE ?", "男方%")
+	case "female":
+		tx = tx.Where("note LIKE ?", "女方%")
+	case "other":
+		tx = tx.Where("note NOT LIKE ? AND note NOT LIKE ? AND note <> ''", "男方%", "女方%")
+	}
+	if minAmount > 0 {
+		tx = tx.Where("amount >= ?", minAmount)
+	}
+	if maxAmount > 0 {
+		tx = tx.Where("amount <= ?", maxAmount)
+	}
+
+	order := "created_at desc, id desc"
+	switch sortKey {
+	case "time_asc":
+		order = "created_at asc, id asc"
+	case "amount_desc":
+		order = "amount desc, created_at desc"
+	case "amount_asc":
+		order = "amount asc, created_at desc"
+	case "name_asc":
+		order = "name asc, created_at desc"
+	}
+
+	var list []models.CashGift
+	tx.Order(order).Find(&list)
+	total := 0
+	for _, it := range list {
+		total += it.Amount
+	}
+	c.JSON(200, gin.H{
+		"code": 200,
+		"data": gin.H{
+			"list":  list,
+			"total": total,
+			"count": len(list),
+			"notes": loadCashGiftNotes(),
+		},
+	})
+}
+
+func handleGetCashGiftNotes(c *gin.Context) {
+	c.JSON(200, gin.H{
+		"code": 200,
+		"data": gin.H{
+			"notes":    loadCashGiftNotes(),
+			"defaults": defaultCashGiftNotes(),
+		},
+	})
+}
+
+func handleSaveCashGiftNotes(c *gin.Context) {
+	if !utils.RequireAdmin(c) {
+		return
+	}
+	var body struct {
+		Notes []string `json:"notes"`
+	}
+	if err := c.ShouldBindJSON(&body); err != nil {
+		c.JSON(400, gin.H{"error": "参数错误"})
+		return
+	}
+	notes := normalizeCashGiftNotes(body.Notes)
+	if len(notes) == 0 {
+		c.JSON(400, gin.H{"error": "至少保留一个快捷备注"})
+		return
+	}
+	if err := saveCashGiftNotes(notes); err != nil {
+		c.JSON(500, gin.H{"error": "保存失败"})
+		return
+	}
+	c.JSON(200, gin.H{"code": 200, "msg": "已保存", "data": gin.H{"notes": notes}})
+}
+
+func handleCashGiftList(c *gin.Context) {
+	if !utils.RequireAdmin(c) {
+		return
+	}
+	var list []models.CashGift
+	db.Order("created_at desc, id desc").Find(&list)
+	total := 0
+	for _, it := range list {
+		total += it.Amount
+	}
+	c.JSON(200, gin.H{
+		"code": 200,
+		"data": gin.H{
+			"list":  list,
+			"total": total,
+			"count": len(list),
+		},
+	})
+}
+
+func handleUpdateCashGift(c *gin.Context) {
+	if !utils.RequireAdmin(c) {
+		return
+	}
+	id, err := strconv.ParseUint(strings.TrimSpace(c.Param("id")), 10, 64)
+	if err != nil || id == 0 {
+		c.JSON(400, gin.H{"error": "无效 ID"})
+		return
+	}
+	var body struct {
+		Name   string `json:"name"`
+		Amount int    `json:"amount"`
+		Note   string `json:"note"`
+	}
+	if err := c.ShouldBindJSON(&body); err != nil {
+		c.JSON(400, gin.H{"error": "参数错误"})
+		return
+	}
+	name := strings.TrimSpace(body.Name)
+	note := strings.TrimSpace(body.Note)
+	if name == "" {
+		c.JSON(400, gin.H{"error": "请填写姓名"})
+		return
+	}
+	if body.Amount <= 0 {
+		c.JSON(400, gin.H{"error": "请填写正确金额"})
+		return
+	}
+	var item models.CashGift
+	if err := db.First(&item, id).Error; err != nil {
+		c.JSON(404, gin.H{"error": "记录不存在"})
+		return
+	}
+	item.Name = name
+	item.Amount = body.Amount
+	item.Note = note
+	if err := db.Save(&item).Error; err != nil {
+		c.JSON(500, gin.H{"error": "保存失败"})
+		return
+	}
+	c.JSON(200, gin.H{"code": 200, "msg": "已更新", "data": item})
+}
+
+func handleDeleteCashGift(c *gin.Context) {
+	if !utils.RequireAdmin(c) {
+		return
+	}
+	id := strings.TrimSpace(c.Param("id"))
+	if id == "" {
+		c.JSON(400, gin.H{"error": "缺少 ID"})
+		return
+	}
+	res := db.Delete(&models.CashGift{}, id)
+	if res.Error != nil {
+		c.JSON(500, gin.H{"error": "删除失败"})
+		return
+	}
+	if res.RowsAffected == 0 {
+		c.JSON(404, gin.H{"error": "记录不存在"})
+		return
+	}
+	c.JSON(200, gin.H{"code": 200, "msg": "已删除"})
+}
diff --git a/hunliji-api/utils/utils.go b/hunliji-api/utils/utils.go
index 906a66a..21a371d 100644
--- a/hunliji-api/utils/utils.go
+++ b/hunliji-api/utils/utils.go
@@ -38,29 +38,65 @@ func SignToken(account string) string {
 	return b64 + "." + sig
 }
 
-func VerifyToken(token string) bool {
+func SignCashGiftViewToken() string {
+	payload := fmt.Sprintf(`{"account":%q,"exp":%d}`, "cash-gift-view", time.Now().Add(7*24*time.Hour).Unix())
+	b64 := base64.StdEncoding.EncodeToString([]byte(payload))
+	mac := hmac.New(sha256.New, []byte(adminSecret))
+	mac.Write([]byte(b64))
+	sig := base64.StdEncoding.EncodeToString(mac.Sum(nil))
+	return b64 + "." + sig
+}
+
+func SignCashGiftEntryToken() string {
+	payload := fmt.Sprintf(`{"account":%q,"exp":%d}`, "cash-gift-entry", time.Now().Add(7*24*time.Hour).Unix())
+	b64 := base64.StdEncoding.EncodeToString([]byte(payload))
+	mac := hmac.New(sha256.New, []byte(adminSecret))
+	mac.Write([]byte(b64))
+	sig := base64.StdEncoding.EncodeToString(mac.Sum(nil))
+	return b64 + "." + sig
+}
+
+func parseTokenClaims(token string) (account string, exp int64, ok bool) {
 	parts := strings.Split(token, ".")
 	if len(parts) != 2 {
-		return false
+		return "", 0, false
 	}
 	mac := hmac.New(sha256.New, []byte(adminSecret))
 	mac.Write([]byte(parts[0]))
 	expected := base64.StdEncoding.EncodeToString(mac.Sum(nil))
 	if !hmac.Equal([]byte(expected), []byte(parts[1])) {
-		return false
+		return "", 0, false
 	}
 	raw, err := base64.StdEncoding.DecodeString(parts[0])
 	if err != nil {
-		return false
+		return "", 0, false
 	}
 	var claims struct {
 		Account string `json:"account"`
 		Exp     int64  `json:"exp"`
 	}
 	if err := json.Unmarshal(raw, &claims); err != nil {
-		return false
+		return "", 0, false
 	}
-	return time.Now().Unix() <= claims.Exp
+	if time.Now().Unix() > claims.Exp {
+		return "", 0, false
+	}
+	return claims.Account, claims.Exp, true
+}
+
+func VerifyToken(token string) bool {
+	_, _, ok := parseTokenClaims(token)
+	return ok
+}
+
+func VerifyCashGiftViewToken(token string) bool {
+	account, _, ok := parseTokenClaims(token)
+	return ok && account == "cash-gift-view"
+}
+
+func VerifyCashGiftEntryToken(token string) bool {
+	account, _, ok := parseTokenClaims(token)
+	return ok && account == "cash-gift-entry"
 }
 
 func BearerToken(c *gin.Context) string {
@@ -79,7 +115,7 @@ func CORSMiddleware() gin.HandlerFunc {
 	return func(c *gin.Context) {
 		c.Writer.Header().Set("Access-Control-Allow-Origin", "*")
 		c.Writer.Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT")
-		c.Writer.Header().Set("Access-Control-Allow-Headers", "Content-Type, Authorization")
+		c.Writer.Header().Set("Access-Control-Allow-Headers", "Content-Type, Authorization, X-Cash-Gift-Token, X-Cash-Gift-Entry-Token")
 		if c.Request.Method == "OPTIONS" {
 			c.AbortWithStatus(204)
 			return
diff --git a/vite-tailwindcss/index.html b/vite-tailwindcss/index.html
index 66bd934..c02fc21 100644
--- a/vite-tailwindcss/index.html
+++ b/vite-tailwindcss/index.html
@@ -2,7 +2,8 @@
 <html lang="zh-CN">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="https://xiaokang88.oss-cn-hangzhou.aliyuncs.com/liqi/20260731/1774761336736_compressed_compressed.webp" />
+<!--    <link rel="icon" type="image/svg+xml" href="https://xiaokang88.oss-cn-hangzhou.aliyuncs.com/liqi/20260731/1774761336736_compressed_compressed.webp" />-->
+    <link rel="icon" type="image/svg+xml" href="https://xiaokang88.oss-cn-hangzhou.aliyuncs.com/liqi/20260803/132743000000000_%E6%AF%9B%E7%AC%94%E5%9B%8D%E5%AD%97%E8%AE%BE%E8%AE%A1%20%281%29.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
     <meta name="description" content="💍（公历2026年9月4日）岁在丙午，仲秋之吉，四日佳期。谨订良缘，敢邀台驾。" />
     <meta property="og:type" content="website" />
diff --git a/vite-tailwindcss/src/api/wedding.js b/vite-tailwindcss/src/api/wedding.js
index 60adaf6..56f4838 100644
--- a/vite-tailwindcss/src/api/wedding.js
+++ b/vite-tailwindcss/src/api/wedding.js
@@ -162,6 +162,72 @@ export function saveGiftCosts(costs) {
   return service.post('/gift/costs', { costs })
 }
 
+export function submitCashGift(form, entryToken = '') {
+  const headers = {}
+  if (entryToken) headers['X-Cash-Gift-Entry-Token'] = entryToken
+  return service.post('/cash-gift', form, { headers })
+}
+
+export function getCashGiftRecent(limit = 3, entryToken = '') {
+  const headers = {}
+  if (entryToken) headers['X-Cash-Gift-Entry-Token'] = entryToken
+  return service.get('/cash-gift/recent', { params: { limit }, headers })
+}
+
+export function getCashGiftNotes() {
+  return service.get('/cash-gift/notes')
+}
+
+export function saveCashGiftNotes(notes) {
+  return service.post('/cash-gift/notes', { notes })
+}
+
+export function getCashGiftViewPass() {
+  return service.get('/cash-gift/view-pass')
+}
+
+export function saveCashGiftViewPass(password) {
+  return service.post('/cash-gift/view-pass', { password })
+}
+
+export function unlockCashGiftView(password) {
+  return service.post('/cash-gift/view/unlock', { password })
+}
+
+export function getCashGiftEntryPass() {
+  return service.get('/cash-gift/entry-pass')
+}
+
+export function saveCashGiftEntryPass(password) {
+  return service.post('/cash-gift/entry-pass', { password })
+}
+
+export function unlockCashGiftEntry(password) {
+  return service.post('/cash-gift/entry/unlock', { password })
+}
+
+export function getCashGiftViewList(params = {}, token = '') {
+  const headers = {}
+  if (token) headers['X-Cash-Gift-Token'] = token
+  return service.get('/cash-gift/view/list', { params, headers })
+}
+
+export function getCashGiftList() {
+  return service.get('/cash-gift/list')
+}
+
+export function updateCashGift(id, form) {
+  return service.put(`/cash-gift/${id}`, form)
+}
+
+export function deleteCashGift(id) {
+  return service.delete(`/cash-gift/${id}`)
+}
+
+export function deleteRsvp(id) {
+  return service.delete(`/rsvp/${id}`)
+}
+
 export function adminLogin(credentials) {
   return service.post('/admin/login', credentials)
 }
diff --git a/vite-tailwindcss/src/components/DanmakuLayer.vue b/vite-tailwindcss/src/components/DanmakuLayer.vue
index eac121a..f884a60 100644
--- a/vite-tailwindcss/src/components/DanmakuLayer.vue
+++ b/vite-tailwindcss/src/components/DanmakuLayer.vue
@@ -1,6 +1,11 @@
 <template>
   <!-- 始终挂载，用 v-show 隐藏，避免关闭时 v-if 拆树与清空列表打架 -->
-  <div v-show="enabled" class="danmaku-layer" aria-hidden="true">
+  <div
+    v-show="enabled"
+    class="danmaku-layer"
+    :style="layerBoxStyle"
+    aria-hidden="true"
+  >
     <div
       v-for="row in rows"
       :key="row.id"
@@ -29,15 +34,18 @@
 </template>
 
 <script setup>
-import { ref, watch, onMounted, onUnmounted } from 'vue'
+import { ref, watch, computed, onMounted, onUnmounted } from 'vue'
 import { getDanmaku } from '@/api/wedding'
 import { formatRelativeTime } from '@/utils/relativeTime'
 import { resolveDanmakuColor, resolveDanmakuTint } from '@/utils/danmakuColors'
+import { DANMAKU_AREA_BOX } from '@/utils/danmakuArea'
 
 const props = defineProps({
   enabled: { type: Boolean, default: true },
   showTime: { type: Boolean, default: true },
   active: { type: Boolean, default: true },
+  /** top30 | top | bottom | full */
+  area: { type: String, default: 'top30' },
 })
 
 const POLL_MS = 30000
@@ -46,6 +54,15 @@ const TRACKS = 5
 /** 同轨占用结束前不可再发，避免重叠 */
 const TRACK_GAP_MS = 420
 
+const layerBoxStyle = computed(() => {
+  const box = DANMAKU_AREA_BOX[props.area] || DANMAKU_AREA_BOX.top30
+  return {
+    top: box.top,
+    height: box.height,
+    bottom: 'auto',
+  }
+})
+
 const items = ref([])
 const rows = ref([])
 let cursor = 0
@@ -154,7 +171,8 @@ const buildRow = (item, { force = false } = {}) => {
   const tint = resolveDanmakuTint(item.color)
   const id = ++uid
   const totalDelay = delay + slot.extraDelay
-  const topPct = 7 + slot.track * 14
+  // 轨道分布在当前弹幕层内部（由 area 控制层高度）
+  const topPct = TRACKS <= 1 ? 50 : 12 + (slot.track / (TRACKS - 1)) * 70
   const isGradient = typeof tint.background === 'string' && tint.background.includes('gradient')
 
   const timeLabel = force
@@ -319,6 +337,15 @@ watch(
   },
 )
 
+watch(
+  () => props.area,
+  () => {
+    if (!props.enabled) return
+    clearFlying()
+    syncSpawn()
+  },
+)
+
 onMounted(async () => {
   if (!props.enabled) return
   await fetchList()
@@ -336,7 +363,10 @@ defineExpose({ refresh: fetchList, pushItem })
 <style scoped>
 .danmaku-layer {
   position: fixed;
-  inset: 0;
+  left: 0;
+  right: 0;
+  top: 0;
+  height: 30%;
   z-index: 40;
   pointer-events: none;
   overflow: hidden;
diff --git a/vite-tailwindcss/src/router/index.js b/vite-tailwindcss/src/router/index.js
index 20ac881..dc04d54 100644
--- a/vite-tailwindcss/src/router/index.js
+++ b/vite-tailwindcss/src/router/index.js
@@ -30,6 +30,16 @@ const routes = [
     component: () => import('@/views/hb/index.vue'),
     meta: { posterSide: 3 },
   },
+  {
+    path: '/lijin',
+    name: 'CashGift',
+    component: () => import('@/views/lijin/index.vue'),
+  },
+  {
+    path: '/lijin/list',
+    name: 'CashGiftList',
+    component: () => import('@/views/lijin/list.vue'),
+  },
   {
     path: '/login',
     name: 'Login',
diff --git a/vite-tailwindcss/src/utils/danmakuArea.js b/vite-tailwindcss/src/utils/danmakuArea.js
new file mode 100644
index 0000000..adcf1cc
--- /dev/null
+++ b/vite-tailwindcss/src/utils/danmakuArea.js
@@ -0,0 +1,16 @@
+/** 弹幕出现范围选项（图标选择） */
+export const DANMAKU_AREA_OPTIONS = [
+  { value: 'top30', label: '上半屏 30%', title: '上半 30%' },
+  { value: 'top', label: '上半屏', title: '上半屏' },
+  { value: 'bottom', label: '下半屏', title: '下半屏' },
+  { value: 'full', label: '全屏', title: '全屏' },
+]
+
+export const DANMAKU_AREA_BOX = {
+  top30: { top: '0%', height: '30%' },
+  top: { top: '0%', height: '50%' },
+  bottom: { top: '50%', height: '50%' },
+  full: { top: '0%', height: '100%' },
+}
+
+export const DEFAULT_DANMAKU_AREA = 'top30'
diff --git a/vite-tailwindcss/src/views/admin/AdminEditor.vue b/vite-tailwindcss/src/views/admin/AdminEditor.vue
index c3a5c0a..ad36732 100644
--- a/vite-tailwindcss/src/views/admin/AdminEditor.vue
+++ b/vite-tailwindcss/src/views/admin/AdminEditor.vue
@@ -1054,11 +1054,176 @@
                 <template v-else-if="column.key==='created_at'">
                   <span class="text-[12px] text-[#8A8680]">{{ formatTime(record.created_at) }}</span>
                 </template>
+                <template v-else-if="column.key==='actions'">
+                  <a-button size="small" danger type="text" @click="onDeleteRsvp(record)">删除</a-button>
+                </template>
               </template>
             </a-table>
           </div>
         </section>
 
+        <!-- 礼金 -->
+        <section v-if="activeTab === 'cash'">
+          <div class="admin-panel">
+            <div class="flex justify-between items-center mb-4 gap-3 flex-wrap">
+              <div>
+                <div class="text-sm text-[#2c2c2c]">礼金记录</div>
+                <div class="text-[11px] text-[#8A8680] mt-0.5">
+                  共 {{ cashGiftCount }} 笔 · 合计 ¥{{ cashGiftTotal }}
+                  · 前台录入 <a class="text-[#a88c6b]" href="/lijin" target="_blank">/lijin</a>
+                  · 明细 <a class="text-[#a88c6b]" href="/lijin/list" target="_blank">/lijin/list</a>
+                </div>
+              </div>
+              <div class="flex gap-2">
+                <a-button size="small" @click="openCashGiftCreate">新增</a-button>
+                <a-button size="small" :loading="cashGiftLoading" @click="loadCashGifts">
+                  <i class="fa-solid fa-rotate-right mr-1"></i>刷新
+                </a-button>
+              </div>
+            </div>
+            <a-table
+              class="admin-table"
+              :columns="cashGiftColumns"
+              :data-source="cashGiftList"
+              :loading="cashGiftLoading"
+              row-key="id"
+              size="middle"
+              :pagination="{ pageSize: 10, hideOnSinglePage: true }"
+            >
+              <template #bodyCell="{ column, record }">
+                <template v-if="column.key==='amount'">
+                  <span class="text-[#a88c6b] font-medium">¥{{ record.amount }}</span>
+                </template>
+                <template v-else-if="column.key==='created_at'">
+                  <span class="text-[12px] text-[#8A8680]">{{ formatTime(record.created_at) }}</span>
+                </template>
+                <template v-else-if="column.key==='actions'">
+                  <a-space>
+                    <a-button size="small" type="link" class="!text-[#a88c6b] !px-1" @click="openCashGiftEdit(record)">编辑</a-button>
+                    <a-button size="small" danger type="text" @click="onDeleteCashGift(record)">删除</a-button>
+                  </a-space>
+                </template>
+              </template>
+            </a-table>
+          </div>
+
+          <div class="admin-panel mt-4">
+            <div class="flex justify-between items-center mb-3 gap-3 flex-wrap">
+              <div>
+                <div class="text-sm text-[#2c2c2c]">记账口令</div>
+                <div class="text-[11px] text-[#8A8680] mt-0.5">
+                  前台 <a class="text-[#a88c6b]" href="/lijin" target="_blank">/lijin</a> 登记礼金前需输入此口令
+                </div>
+              </div>
+              <a-button
+                size="small"
+                type="primary"
+                class="!bg-[#a88c6b] !border-[#a88c6b]"
+                :loading="cashEntryPassSaving"
+                @click="saveCashEntryPass"
+              >保存口令</a-button>
+            </div>
+            <a-input-password
+              v-model:value="cashEntryPass"
+              placeholder="设置记账口令"
+              class="!max-w-[320px]"
+              :maxlength="64"
+            />
+          </div>
+
+          <div class="admin-panel mt-4">
+            <div class="flex justify-between items-center mb-3 gap-3 flex-wrap">
+              <div>
+                <div class="text-sm text-[#2c2c2c]">查看全部口令</div>
+                <div class="text-[11px] text-[#8A8680] mt-0.5">
+                  前台 <a class="text-[#a88c6b]" href="/lijin/list" target="_blank">/lijin/list</a> 需输入口令后查看完整礼金列表
+                </div>
+              </div>
+              <a-button
+                size="small"
+                type="primary"
+                class="!bg-[#a88c6b] !border-[#a88c6b]"
+                :loading="cashViewPassSaving"
+                @click="saveCashViewPass"
+              >保存口令</a-button>
+            </div>
+            <a-input-password
+              v-model:value="cashViewPass"
+              placeholder="设置查看口令"
+              class="!max-w-[320px]"
+              :maxlength="64"
+            />
+          </div>
+
+          <div class="admin-panel mt-4">
+            <div class="flex justify-between items-center mb-3 gap-3 flex-wrap">
+              <div>
+                <div class="text-sm text-[#2c2c2c]">备注快捷选项</div>
+                <div class="text-[11px] text-[#8A8680] mt-0.5">前台礼金页可一键点选；男方 / 女方分开配置</div>
+              </div>
+              <div class="flex gap-2">
+                <a-button size="small" @click="resetCashNotePresets">恢复默认</a-button>
+                <a-button
+                  size="small"
+                  type="primary"
+                  class="!bg-[#a88c6b] !border-[#a88c6b]"
+                  :loading="cashNotesSaving"
+                  @click="saveCashNotePresets"
+                >保存选项</a-button>
+              </div>
+            </div>
+            <div class="flex flex-wrap gap-2 mb-3">
+              <a-tag
+                v-for="(n, i) in cashNotePresets"
+                :key="`${n}-${i}`"
+                closable
+                color="gold"
+                @close.prevent="removeCashNotePreset(i)"
+              >{{ n }}</a-tag>
+            </div>
+            <div class="flex gap-2 items-center flex-wrap">
+              <a-input
+                v-model:value="cashNoteDraft"
+                placeholder="新增快捷备注，如：男方亲戚"
+                class="!max-w-[280px]"
+                :maxlength="30"
+                @pressEnter="addCashNotePreset"
+              />
+              <a-button size="small" @click="addCashNotePreset">添加</a-button>
+            </div>
+          </div>
+
+          <a-modal
+            v-model:open="cashGiftModalOpen"
+            :title="cashGiftEditingId ? '编辑礼金' : '新增礼金'"
+            ok-text="保存"
+            cancel-text="取消"
+            :confirm-loading="cashGiftSaving"
+            @ok="saveCashGiftModal"
+          >
+            <a-form layout="vertical" class="mt-2">
+              <a-form-item label="姓名" required>
+                <a-input v-model:value="cashGiftForm.name" placeholder="宾客姓名" :maxlength="20" />
+              </a-form-item>
+              <a-form-item label="金额（元）" required>
+                <a-input-number v-model:value="cashGiftForm.amount" :min="1" :max="10000000" class="w-full" />
+              </a-form-item>
+              <a-form-item label="备注">
+                <div class="flex flex-wrap gap-1.5 mb-2">
+                  <a-tag
+                    v-for="n in cashNotePresets"
+                    :key="'m-' + n"
+                    class="!cursor-pointer"
+                    :color="cashGiftForm.note === n ? 'gold' : undefined"
+                    @click="cashGiftForm.note = n"
+                  >{{ n }}</a-tag>
+                </div>
+                <a-input v-model:value="cashGiftForm.note" placeholder="可选" :maxlength="100" />
+              </a-form-item>
+            </a-form>
+          </a-modal>
+        </section>
+
         <!-- 弹幕审核 -->
         <section v-if="activeTab === 'danmaku'">
           <div class="admin-panel">
@@ -1134,9 +1299,13 @@ import { PieChart } from 'echarts/charts'
 import { TooltipComponent, LegendComponent } from 'echarts/components'
 import { CanvasRenderer } from 'echarts/renderers'
 import {
-  getConfigSection, saveConfigSection, uploadImage, getRsvpList, getUploadConfig, saveUploadConfig,
+  getConfigSection, saveConfigSection, uploadImage, getRsvpList, deleteRsvp, getUploadConfig, saveUploadConfig,
   getDanmakuList, updateDanmakuStatus, getVisitStats, getVisitList,
   getPosterConfig, savePosterConfig, getGiftStats, saveGiftCosts,
+  getCashGiftList, updateCashGift, deleteCashGift, submitCashGift,
+  getCashGiftNotes, saveCashGiftNotes,
+  getCashGiftViewPass, saveCashGiftViewPass,
+  getCashGiftEntryPass, saveCashGiftEntryPass,
 } from '@/api/wedding'
 import { useAdminStore } from '@/stores/admin'
 import ImageField from '@/components/ImageField.vue'
@@ -1158,7 +1327,7 @@ const adminStore = useAdminStore()
 const TAB_KEY = 'wedding_admin_active_tab'
 const MENU_LAYOUT_KEY = 'wedding_admin_menu_layout'
 const CONFIG_SECTIONS = ['basic', 'copy', 'visual', 'music', 'photos', 'schedule']
-const VALID_TABS = ['overview', 'gifts', 'visits', ...CONFIG_SECTIONS, 'upload', 'poster', 'rsvp', 'danmaku']
+const VALID_TABS = ['overview', 'gifts', 'visits', ...CONFIG_SECTIONS, 'upload', 'poster', 'rsvp', 'cash', 'danmaku']
 
 /** 后台菜单分组 */
 const adminMenuGroups = [
@@ -1188,6 +1357,7 @@ const adminMenuGroups = [
     label: '宾客互动',
     items: [
       { key: 'rsvp', label: '出席回执', icon: 'fa-solid fa-envelope-open-text' },
+      { key: 'cash', label: '礼金', icon: 'fa-solid fa-yen-sign' },
       { key: 'danmaku', label: '弹幕审核', icon: 'fa-solid fa-comments' },
     ],
   },
@@ -1258,6 +1428,22 @@ const posterMusicOptions = ref([])
 const tabLoading = ref(false)
 const rsvpLoading = ref(false)
 const rsvpList = ref([])
+const cashGiftLoading = ref(false)
+const cashGiftSaving = ref(false)
+const cashGiftList = ref([])
+const cashGiftTotal = ref(0)
+const cashGiftCount = ref(0)
+const cashGiftModalOpen = ref(false)
+const cashGiftEditingId = ref(0)
+const cashGiftForm = reactive({ name: '', amount: 1000, note: '' })
+const cashNotePresets = ref([])
+const cashNoteDefaults = ref([])
+const cashNoteDraft = ref('')
+const cashNotesSaving = ref(false)
+const cashViewPass = ref('')
+const cashViewPassSaving = ref(false)
+const cashEntryPass = ref('')
+const cashEntryPassSaving = ref(false)
 const danmakuLoading = ref(false)
 const danmakuList = ref([])
 const danmakuFilter = ref('pending')
@@ -2167,6 +2353,10 @@ async function onTabActivate(tab) {
     await loadRsvp()
     return
   }
+  if (tab === 'cash') {
+    await Promise.all([loadCashGifts(), loadCashNotePresets(), loadCashViewPass(), loadCashEntryPass()])
+    return
+  }
   if (tab === 'danmaku') {
     await loadDanmaku()
   }
@@ -2190,6 +2380,7 @@ const rsvpColumns = [
   { title: '出席', dataIndex: 'guest_count', key: 'guest_count' },
   { title: '祝福', dataIndex: 'wishes', key: 'wishes', ellipsis: true },
   { title: '提交时间', dataIndex: 'created_at', key: 'created_at' },
+  { title: '操作', key: 'actions', width: 90 },
 ]
 const rsvpCountLabel = (v) => ({ '1': '1 人出席', '2': '2 人出席', '3': '3 人及以上', '0': '遗憾缺席' }[v] || v)
 function formatTime(t) {
@@ -2204,6 +2395,182 @@ async function loadRsvp() {
   catch (e) { /* 忽略 */ }
   finally { rsvpLoading.value = false }
 }
+async function onDeleteRsvp(record) {
+  if (!record?.id) return
+  try {
+    await deleteRsvp(record.id)
+    message.success('已删除')
+    await loadRsvp()
+  } catch (e) {
+    message.error(e?.message || '删除失败')
+  }
+}
+
+const cashGiftColumns = [
+  { title: '姓名', dataIndex: 'name', key: 'name', width: 120 },
+  { title: '金额', key: 'amount', width: 110 },
+  { title: '备注', dataIndex: 'note', key: 'note', ellipsis: true },
+  { title: '时间', dataIndex: 'created_at', key: 'created_at', width: 170 },
+  { title: '操作', key: 'actions', width: 140 },
+]
+async function loadCashGifts() {
+  cashGiftLoading.value = true
+  try {
+    const res = await getCashGiftList()
+    const data = res.data || {}
+    cashGiftList.value = Array.isArray(data.list) ? data.list : []
+    cashGiftTotal.value = Number(data.total) || 0
+    cashGiftCount.value = Number(data.count) || cashGiftList.value.length
+  } catch {
+    cashGiftList.value = []
+    cashGiftTotal.value = 0
+    cashGiftCount.value = 0
+  } finally {
+    cashGiftLoading.value = false
+  }
+}
+function openCashGiftCreate() {
+  cashGiftEditingId.value = 0
+  cashGiftForm.name = ''
+  cashGiftForm.amount = 1000
+  cashGiftForm.note = ''
+  cashGiftModalOpen.value = true
+}
+function openCashGiftEdit(record) {
+  cashGiftEditingId.value = record.id
+  cashGiftForm.name = record.name || ''
+  cashGiftForm.amount = Number(record.amount) || 0
+  cashGiftForm.note = record.note || ''
+  cashGiftModalOpen.value = true
+}
+async function saveCashGiftModal() {
+  const name = String(cashGiftForm.name || '').trim()
+  const amount = Math.round(Number(cashGiftForm.amount))
+  if (!name) {
+    message.error('请填写姓名')
+    return Promise.reject()
+  }
+  if (!Number.isFinite(amount) || amount <= 0) {
+    message.error('请填写正确金额')
+    return Promise.reject()
+  }
+  cashGiftSaving.value = true
+  try {
+    const payload = { name, amount, note: String(cashGiftForm.note || '').trim() }
+    if (cashGiftEditingId.value) await updateCashGift(cashGiftEditingId.value, payload)
+    else await submitCashGift(payload)
+    message.success('已保存')
+    cashGiftModalOpen.value = false
+    await loadCashGifts()
+  } catch (e) {
+    if (e) message.error(e?.message || '保存失败')
+    return Promise.reject(e)
+  } finally {
+    cashGiftSaving.value = false
+  }
+}
+async function onDeleteCashGift(record) {
+  if (!record?.id) return
+  try {
+    await deleteCashGift(record.id)
+    message.success('已删除')
+    await loadCashGifts()
+  } catch (e) {
+    message.error(e?.message || '删除失败')
+  }
+}
+
+async function loadCashNotePresets() {
+  try {
+    const res = await getCashGiftNotes()
+    cashNotePresets.value = Array.isArray(res.data?.notes) ? [...res.data.notes] : []
+    cashNoteDefaults.value = Array.isArray(res.data?.defaults) ? [...res.data.defaults] : []
+  } catch {
+    cashNotePresets.value = []
+    cashNoteDefaults.value = []
+  }
+}
+
+async function loadCashViewPass() {
+  try {
+    const res = await getCashGiftViewPass()
+    cashViewPass.value = res.data?.password || ''
+  } catch {
+    cashViewPass.value = ''
+  }
+}
+
+async function saveCashViewPass() {
+  const password = String(cashViewPass.value || '').trim()
+  if (!password) return message.error('请设置查看口令')
+  cashViewPassSaving.value = true
+  try {
+    await saveCashGiftViewPass(password)
+    message.success('查看口令已保存')
+  } catch (e) {
+    message.error(e?.message || '保存失败')
+  } finally {
+    cashViewPassSaving.value = false
+  }
+}
+
+async function loadCashEntryPass() {
+  try {
+    const res = await getCashGiftEntryPass()
+    cashEntryPass.value = res.data?.password || ''
+  } catch {
+    cashEntryPass.value = ''
+  }
+}
+
+async function saveCashEntryPass() {
+  const password = String(cashEntryPass.value || '').trim()
+  if (!password) return message.error('请设置记账口令')
+  cashEntryPassSaving.value = true
+  try {
+    await saveCashGiftEntryPass(password)
+    message.success('记账口令已保存')
+  } catch (e) {
+    message.error(e?.message || '保存失败')
+  } finally {
+    cashEntryPassSaving.value = false
+  }
+}
+
+function addCashNotePreset() {
+  const v = String(cashNoteDraft.value || '').trim()
+  if (!v) return
+  if (cashNotePresets.value.includes(v)) {
+    message.warning('已存在该选项')
+    return
+  }
+  cashNotePresets.value.push(v)
+  cashNoteDraft.value = ''
+}
+
+function removeCashNotePreset(index) {
+  cashNotePresets.value.splice(index, 1)
+}
+
+function resetCashNotePresets() {
+  cashNotePresets.value = cashNoteDefaults.value.length
+    ? [...cashNoteDefaults.value]
+    : ['男方亲戚', '女方亲戚', '男方朋友', '女方朋友', '男方同学', '女方同学', '男方同事', '女方同事', '男方邻居', '女方邻居', '其他']
+}
+
+async function saveCashNotePresets() {
+  if (!cashNotePresets.value.length) return message.error('至少保留一个快捷备注')
+  cashNotesSaving.value = true
+  try {
+    const res = await saveCashGiftNotes(cashNotePresets.value)
+    cashNotePresets.value = Array.isArray(res.data?.notes) ? [...res.data.notes] : [...cashNotePresets.value]
+    message.success('备注选项已保存')
+  } catch (e) {
+    message.error(e?.message || '保存失败')
+  } finally {
+    cashNotesSaving.value = false
+  }
+}
 
 const danmakuColumns = [
   { title: '姓名', dataIndex: 'name', key: 'name', width: 100 },
@@ -2353,7 +2720,8 @@ onUnmounted(() => {
   box-sizing: border-box;
 }
 .admin-shell--top {
-  max-width: 1040px;
+  max-width: 80vw;
+  width: 80vw;
 }
 .admin-shell--side {
   max-width: 1220px;
diff --git a/vite-tailwindcss/src/views/index/index.vue b/vite-tailwindcss/src/views/index/index.vue
index 0d3b1ba..429fd16 100644
--- a/vite-tailwindcss/src/views/index/index.vue
+++ b/vite-tailwindcss/src/views/index/index.vue
@@ -40,6 +40,7 @@
       ref="danmakuLayerRef"
       :enabled="!!data.danmakuEnabled && showDanmaku"
       :show-time="!!data.danmakuShowTime"
+      :area="danmakuArea"
       :active="effectsActive"
     />
 
@@ -62,15 +63,43 @@
         <img v-if="isAutoScroll" src="https://api.iconify.design/lucide:pause.svg?color=%23a88c6b" class="w-4 h-4" />
         <img v-else src="https://api.iconify.design/lucide:play.svg?color=%23a88c6b" class="w-4 h-4 ml-0.5" />
       </div>
-      <button
-        type="button"
-        class="control-btn cursor-pointer transition-all duration-300"
-        :class="showDanmaku ? 'bg-[#a88c6b]/15 !border-[#a88c6b]/60 shadow-sm' : 'bg-white/60 shadow-sm border-[#a88c6b]/30 opacity-55'"
-        :title="showDanmaku ? '关闭弹幕' : '开启弹幕'"
-        @click.stop="toggleShowDanmaku"
-      >
-        <i class="fa-solid fa-comment-dots text-[13px]" :class="showDanmaku ? 'text-[#a88c6b]' : 'text-[#a88c6b]/70'"></i>
-      </button>
+      <div class="relative">
+        <button
+          type="button"
+          class="control-btn cursor-pointer transition-all duration-300"
+          :class="showDanmaku ? 'bg-[#a88c6b]/15 !border-[#a88c6b]/60 shadow-sm' : 'bg-white/60 shadow-sm border-[#a88c6b]/30 opacity-55'"
+          :title="showDanmaku ? '关闭弹幕（长按设范围）' : '开启弹幕（长按设范围）'"
+          style="touch-action: manipulation; user-select: none; -webkit-user-select: none;"
+          @click.stop="onDanmakuBtnClick"
+          @touchstart.prevent="onDanmakuPressStart"
+          @touchend="onDanmakuPressEnd"
+          @touchcancel="onDanmakuPressCancel"
+          @mousedown="onDanmakuPressStart"
+          @mouseup="onDanmakuPressEnd"
+          @mouseleave="onDanmakuPressCancel"
+        >
+          <i class="fa-solid fa-comment-dots text-[13px]" :class="showDanmaku ? 'text-[#a88c6b]' : 'text-[#a88c6b]/70'"></i>
+        </button>
+        <div
+          v-if="showDanmakuAreaMenu"
+          class="danmaku-area-menu"
+          @click.stop
+        >
+          <button
+            v-for="opt in danmakuAreaOptions"
+            :key="opt.value"
+            type="button"
+            class="danmaku-area-opt"
+            :class="{ active: danmakuArea === opt.value }"
+            :title="opt.title"
+            @click="selectDanmakuArea(opt.value)"
+          >
+            <span class="danmaku-area-phone" aria-hidden="true">
+              <span class="danmaku-area-zone" :data-area="opt.value" />
+            </span>
+          </button>
+        </div>
+      </div>
       <button
         type="button"
         class="control-btn cursor-pointer transition-all duration-300"
@@ -798,6 +827,7 @@ import { DANMAKU_COLORS, DANMAKU_GRADIENT_COLORS, DEFAULT_DANMAKU_COLOR, BLESSIN
 import { parseLrc, formatAudioTime, findLrcIndex } from '@/utils/parseLrc'
 import CanvasEffects from '@/components/CanvasEffects.vue'
 import DanmakuLayer from '@/components/DanmakuLayer.vue'
+import { DANMAKU_AREA_OPTIONS, DEFAULT_DANMAKU_AREA } from '@/utils/danmakuArea'
 import LikeBurst from '@/components/LikeBurst.vue'
 import GiftEffect from '@/components/GiftEffect.vue'
 import GiftFeed from '@/components/GiftFeed.vue'
@@ -1046,6 +1076,7 @@ const handleQuickLike = (n) => {
 }
 
 const DANMAKU_PREF_KEY = 'wedding_show_danmaku_v1'
+const DANMAKU_AREA_KEY = 'wedding_danmaku_area_v1'
 const GIFT_FX_PREF_KEY = 'wedding_show_gift_fx_v1'
 const readPref = (key, fallback = true) => {
   try {
@@ -1056,9 +1087,91 @@ const readPref = (key, fallback = true) => {
     return fallback
   }
 }
+const readDanmakuArea = () => {
+  try {
+    const v = localStorage.getItem(DANMAKU_AREA_KEY)
+    if (DANMAKU_AREA_OPTIONS.some((o) => o.value === v)) return v
+  } catch { /* ignore */ }
+  return DEFAULT_DANMAKU_AREA
+}
 const showDanmaku = ref(readPref(DANMAKU_PREF_KEY, true))
 const showGiftFx = ref(readPref(GIFT_FX_PREF_KEY, true))
+const danmakuArea = ref(readDanmakuArea())
+const danmakuAreaOptions = DANMAKU_AREA_OPTIONS
+const showDanmakuAreaMenu = ref(false)
+let danmakuPressTimer = null
+let danmakuPressFired = false
+let danmakuSkipClick = false
+let danmakuAreaMenuHideTimer = null
+
+const hideDanmakuAreaMenuSoon = () => {
+  clearTimeout(danmakuAreaMenuHideTimer)
+  danmakuAreaMenuHideTimer = setTimeout(() => {
+    showDanmakuAreaMenu.value = false
+  }, 4500)
+}
+
+const clearDanmakuPressTimer = () => {
+  if (danmakuPressTimer) {
+    clearTimeout(danmakuPressTimer)
+    danmakuPressTimer = null
+  }
+}
+
+const onDanmakuPressStart = (e) => {
+  if (e.type === 'mousedown' && e.button !== 0) return
+  if (e.type === 'touchstart' && e.cancelable) e.preventDefault()
+  danmakuPressFired = false
+  clearDanmakuPressTimer()
+  danmakuPressTimer = setTimeout(() => {
+    danmakuPressFired = true
+    danmakuSkipClick = true
+    showDanmakuAreaMenu.value = true
+    hideDanmakuAreaMenuSoon()
+    if (typeof navigator !== 'undefined' && navigator.vibrate) {
+      try { navigator.vibrate(12) } catch { /* ignore */ }
+    }
+  }, 420)
+}
+
+const onDanmakuPressEnd = (e) => {
+  const longPress = danmakuPressFired
+  clearDanmakuPressTimer()
+  if (e?.type === 'touchend' && !longPress) {
+    danmakuSkipClick = true
+    toggleShowDanmaku()
+    return
+  }
+  if (longPress) danmakuSkipClick = true
+}
+
+const onDanmakuPressCancel = () => {
+  clearDanmakuPressTimer()
+  danmakuPressFired = false
+}
+
+const onDanmakuBtnClick = () => {
+  if (danmakuSkipClick) {
+    danmakuSkipClick = false
+    return
+  }
+  toggleShowDanmaku()
+}
+
+const selectDanmakuArea = (value) => {
+  if (!DANMAKU_AREA_OPTIONS.some((o) => o.value === value)) return
+  danmakuArea.value = value
+  try { localStorage.setItem(DANMAKU_AREA_KEY, value) } catch { /* ignore */ }
+  showDanmakuAreaMenu.value = false
+  // 选了范围后若弹幕关着，顺手打开便于预览
+  if (!showDanmaku.value) {
+    showDanmaku.value = true
+    try { localStorage.setItem(DANMAKU_PREF_KEY, '1') } catch { /* ignore */ }
+  }
+}
+
 const toggleShowDanmaku = () => {
+  showDanmakuAreaMenu.value = false
   showDanmaku.value = !showDanmaku.value
   try { localStorage.setItem(DANMAKU_PREF_KEY, showDanmaku.value ? '1' : '0') } catch { /* ignore */ }
 }
@@ -2045,6 +2158,8 @@ onUnmounted(() => {
   clearTimeout(likePressTimer)
   clearTimeout(likeBubblesHideTimer)
   clearTimeout(likePulseTimer)
+  clearTimeout(danmakuPressTimer)
+  clearTimeout(danmakuAreaMenuHideTimer)
   clearGiftPanelCloseTimer()
   clearBottomReturn()
   clearBlessingAutoClose()
@@ -2106,6 +2221,64 @@ watch(
   width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 9999px;
   backdrop-filter: blur(12px); border: 0.5px solid rgba(168, 140, 107, 0.3); color: #a88c6b; background: rgba(255,255,255,0.6);
 }
+.danmaku-area-menu {
+  position: absolute;
+  top: 0;
+  right: calc(100% + 10px);
+  display: flex;
+  gap: 6px;
+  padding: 8px;
+  border-radius: 14px;
+  background: rgba(255, 252, 247, 0.96);
+  border: 1px solid rgba(168, 140, 107, 0.22);
+  box-shadow: 0 10px 28px rgba(88, 68, 42, 0.14);
+  backdrop-filter: blur(10px);
+  z-index: 5;
+}
+.danmaku-area-opt {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid transparent;
+  background: transparent;
+  padding: 4px;
+  border-radius: 10px;
+  cursor: pointer;
+  transition: background 0.15s, border-color 0.15s;
+}
+.danmaku-area-opt:hover {
+  background: rgba(168, 140, 107, 0.1);
+}
+.danmaku-area-opt.active {
+  background: rgba(168, 140, 107, 0.16);
+  border-color: rgba(168, 140, 107, 0.35);
+}
+.danmaku-area-phone {
+  position: relative;
+  width: 22px;
+  height: 36px;
+  border-radius: 5px;
+  border: 1.5px solid #c4b59e;
+  background: #f7f2ea;
+  overflow: hidden;
+  display: block;
+}
+.danmaku-area-zone {
+  position: absolute;
+  left: 0;
+  right: 0;
+  background: rgba(168, 140, 107, 0.72);
+}
+.danmaku-area-zone[data-area='top30'] { top: 0; height: 30%; }
+.danmaku-area-zone[data-area='top'] { top: 0; height: 50%; }
+.danmaku-area-zone[data-area='bottom'] { bottom: 0; height: 50%; }
+.danmaku-area-zone[data-area='full'] { inset: 0; }
+.danmaku-area-opt.active .danmaku-area-zone {
+  background: #a88c6b;
+}
+.danmaku-area-opt.active .danmaku-area-phone {
+  border-color: #a88c6b;
+}
 .action-dock {
   position: fixed;
   left: 0;
diff --git a/vite-tailwindcss/src/views/lijin/index.vue b/vite-tailwindcss/src/views/lijin/index.vue
new file mode 100644
index 0000000..29fa199
--- /dev/null
+++ b/vite-tailwindcss/src/views/lijin/index.vue
@@ -0,0 +1,781 @@
+<template>
+  <div class="lj-root">
+    <div class="lj-bg" aria-hidden="true">
+      <span class="lj-xi lj-xi-1">囍</span>
+      <span class="lj-xi lj-xi-2">囍</span>
+      <span class="lj-xi lj-xi-3">囍</span>
+      <span class="lj-xi lj-xi-4">囍</span>
+      <i class="lj-spark lj-spark-1"></i>
+      <i class="lj-spark lj-spark-2"></i>
+      <i class="lj-spark lj-spark-3"></i>
+    </div>
+
+    <main class="lj-main">
+      <header class="lj-hero">
+        <div class="lj-seal">囍</div>
+        <h1 class="lj-title calligraphy">礼金登记</h1>
+        <p class="lj-sub">喜结良缘 · 恭贺新禧</p>
+        <div class="lj-divider">
+          <span></span><i>✦</i><span></span>
+        </div>
+      </header>
+
+      <section v-if="!unlocked" class="lj-form-block lj-unlock">
+        <label class="lj-label">记账口令</label>
+        <input
+          v-model="passInput"
+          class="lj-input"
+          type="password"
+          maxlength="64"
+          placeholder="请输入口令"
+          :style="inputStyle"
+          @keyup.enter="onUnlock"
+        />
+        <p v-if="tip" class="lj-tip" :class="tipType">{{ tip }}</p>
+        <button type="button" class="lj-submit" :disabled="busy" @click="onUnlock">
+          {{ busy ? '验证中…' : '进入登记' }}
+        </button>
+      </section>
+
+      <template v-else>
+      <section class="lj-form-block">
+        <div class="lj-form-top">
+          <span class="lj-form-hint">已解锁</span>
+          <button type="button" class="lj-lock-btn" @click="onLock">退出</button>
+        </div>
+        <label class="lj-label">宾客姓名</label>
+        <input
+          v-model="form.name"
+          class="lj-input"
+          type="text"
+          maxlength="20"
+          placeholder="请输入姓名"
+          autocomplete="name"
+          :style="inputStyle"
+        />
+
+        <label class="lj-label">礼金金额</label>
+        <div class="lj-quick">
+          <button
+            v-for="n in quickAmounts"
+            :key="n"
+            type="button"
+            class="lj-chip"
+            :class="{ active: Number(form.amount) === n }"
+            @click="pickAmount(n)"
+          >{{ n }}</button>
+        </div>
+        <div class="lj-amount-row">
+          <span class="lj-yen">¥</span>
+          <input
+            v-model="form.amount"
+            class="lj-input lj-amount"
+            type="text"
+            inputmode="numeric"
+            pattern="[0-9]*"
+            maxlength="8"
+            placeholder="或手动输入"
+            :style="amountInputStyle"
+            @input="onAmountInput"
+          />
+        </div>
+
+        <label class="lj-label">备注（可选）</label>
+        <div v-if="noteGroups.length" class="lj-notes-groups">
+          <div v-for="g in noteGroups" :key="g.key" class="lj-notes-group">
+            <div class="lj-notes-group-title">{{ g.label }}</div>
+            <div class="lj-notes">
+              <button
+                v-for="n in g.items"
+                :key="n"
+                type="button"
+                class="lj-note-chip"
+                :class="{ active: form.note === n }"
+                @click="pickNote(n)"
+              >{{ n }}</button>
+            </div>
+          </div>
+        </div>
+        <input
+          v-model="form.note"
+          class="lj-input"
+          type="text"
+          maxlength="100"
+          placeholder="点选上方或手动填写"
+          :style="inputStyle"
+        />
+
+        <p v-if="tip" class="lj-tip" :class="tipType">{{ tip }}</p>
+
+        <button
+          type="button"
+          class="lj-submit"
+          :disabled="busy"
+          @click="onSubmit"
+        >
+          {{ busy ? '登记中…' : '确认登记' }}
+        </button>
+      </section>
+
+      <section class="lj-recent">
+        <div class="lj-recent-head">
+          <span class="lj-recent-title">最近登记</span>
+          <span class="lj-recent-line"></span>
+          <router-link to="/lijin/list" class="lj-recent-all">查看全部</router-link>
+        </div>
+        <ul v-if="recent.length" class="lj-recent-list">
+          <li v-for="item in recent" :key="item.id" class="lj-recent-item">
+            <div class="lj-recent-left">
+              <span class="lj-recent-name">{{ item.name }}</span>
+              <span v-if="item.note" class="lj-recent-note">{{ item.note }}</span>
+            </div>
+            <div class="lj-recent-right">
+              <span class="lj-recent-amount">¥{{ item.amount }}</span>
+              <span class="lj-recent-time">{{ formatTime(item.created_at) }}</span>
+            </div>
+          </li>
+        </ul>
+        <div v-else class="lj-recent-empty">暂无登记记录</div>
+      </section>
+      </template>
+    </main>
+  </div>
+</template>
+
+<script setup>
+import { computed, onMounted, reactive, ref } from 'vue'
+import {
+  submitCashGift,
+  getCashGiftRecent,
+  getCashGiftNotes,
+  unlockCashGiftEntry,
+} from '@/api/wedding'
+
+const ENTRY_TOKEN_KEY = 'cash_gift_entry_token'
+const quickAmounts = [200, 500, 600, 800, 1000, 1200, 1500, 2000, 2888, 5200]
+const form = reactive({ name: '', amount: '', note: '' })
+const busy = ref(false)
+const tip = ref('')
+const tipType = ref('ok')
+const recent = ref([])
+const notePresets = ref([])
+const unlocked = ref(false)
+const passInput = ref('')
+const entryToken = ref('')
+
+/* 内联强制字色/底色，避免继承页面浅色导致「输入看不见」 */
+const inputStyle = {
+  color: '#4a2018',
+  WebkitTextFillColor: '#4a2018',
+  caretColor: '#9b1b1b',
+  backgroundColor: '#c9ad7a',
+  borderColor: 'rgba(212, 175, 55, 0.55)',
+  fontFamily: 'var(--font-calligraphy)',
+}
+const amountInputStyle = {
+  ...inputStyle,
+  paddingLeft: '32px',
+}
+
+const noteGroups = computed(() => {
+  const list = Array.isArray(notePresets.value) ? notePresets.value : []
+  const groom = []
+  const bride = []
+  const other = []
+  for (const n of list) {
+    const s = String(n || '').trim()
+    if (!s) continue
+    if (s.startsWith('男方')) groom.push(s)
+    else if (s.startsWith('女方')) bride.push(s)
+    else other.push(s)
+  }
+  const groups = []
+  if (groom.length) groups.push({ key: 'groom', label: '男方', items: groom })
+  if (bride.length) groups.push({ key: 'bride', label: '女方', items: bride })
+  if (other.length) groups.push({ key: 'other', label: '其他', items: other })
+  return groups
+})
+
+const formatTime = (t) => {
+  if (!t) return ''
+  const d = new Date(t)
+  if (Number.isNaN(d.getTime())) return ''
+  const hh = String(d.getHours()).padStart(2, '0')
+  const mm = String(d.getMinutes()).padStart(2, '0')
+  return `${hh}:${mm}`
+}
+
+const showTip = (text, type = 'ok') => {
+  tip.value = text
+  tipType.value = type
+  clearTimeout(showTip._t)
+  showTip._t = setTimeout(() => { tip.value = '' }, 2800)
+}
+
+const pickAmount = (n) => {
+  form.amount = String(n)
+}
+
+const onAmountInput = (e) => {
+  const digits = String(e?.target?.value || '').replace(/[^\d]/g, '')
+  form.amount = digits
+  if (e?.target && e.target.value !== digits) e.target.value = digits
+}
+
+const pickNote = (n) => {
+  form.note = form.note === n ? '' : n
+}
+
+const loadRecent = async () => {
+  if (!entryToken.value) {
+    recent.value = []
+    return
+  }
+  try {
+    const res = await getCashGiftRecent(3, entryToken.value)
+    recent.value = Array.isArray(res.data) ? res.data : []
+  } catch (e) {
+    recent.value = []
+    if (/口令|记账/.test(e?.message || '')) onLock()
+  }
+}
+
+const loadNotePresets = async () => {
+  try {
+    const res = await getCashGiftNotes()
+    const notes = res.data?.notes
+    notePresets.value = Array.isArray(notes) ? notes : []
+  } catch {
+    notePresets.value = [
+      '男方亲戚', '女方亲戚', '男方朋友', '女方朋友',
+      '男方同学', '女方同学', '男方同事', '女方同事',
+    ]
+  }
+}
+
+const onUnlock = async () => {
+  const password = String(passInput.value || '').trim()
+  if (!password) return showTip('请输入口令', 'err')
+  busy.value = true
+  tip.value = ''
+  try {
+    const res = await unlockCashGiftEntry(password)
+    const token = res.data?.token
+    if (!token) throw new Error('解锁失败')
+    entryToken.value = token
+    sessionStorage.setItem(ENTRY_TOKEN_KEY, token)
+    unlocked.value = true
+    passInput.value = ''
+    await Promise.all([loadRecent(), loadNotePresets()])
+  } catch (e) {
+    showTip(e?.message || '口令错误', 'err')
+  } finally {
+    busy.value = false
+  }
+}
+
+const onLock = () => {
+  unlocked.value = false
+  entryToken.value = ''
+  sessionStorage.removeItem(ENTRY_TOKEN_KEY)
+  recent.value = []
+  form.name = ''
+  form.amount = ''
+  form.note = ''
+}
+
+const onSubmit = async () => {
+  const name = String(form.name || '').trim()
+  const amountRaw = String(form.amount || '').replace(/[^\d]/g, '')
+  const amount = Math.round(Number(amountRaw))
+  if (!name) return showTip('请填写姓名', 'err')
+  if (!Number.isFinite(amount) || amount <= 0) return showTip('请填写正确金额', 'err')
+  if (!entryToken.value) return showTip('请先输入记账口令', 'err')
+  form.amount = String(amount)
+  busy.value = true
+  try {
+    await submitCashGift({
+      name,
+      amount,
+      note: String(form.note || '').trim(),
+    }, entryToken.value)
+    showTip(`已登记 ${name} ¥${amount}`, 'ok')
+    form.amount = ''
+    form.note = ''
+    form.name = ''
+    await loadRecent()
+  } catch (e) {
+    const msg = e?.message || '登记失败'
+    showTip(msg, 'err')
+    if (/口令|记账/.test(msg)) onLock()
+  } finally {
+    busy.value = false
+  }
+}
+
+onMounted(async () => {
+  const cached = sessionStorage.getItem(ENTRY_TOKEN_KEY) || ''
+  if (!cached) return
+  entryToken.value = cached
+  unlocked.value = true
+  await Promise.all([loadRecent(), loadNotePresets()])
+})
+</script>
+
+<style scoped>
+.lj-root {
+  --lj-red: #9b1b1b;
+  --lj-deep: #7a0000;
+  --lj-gold: #d4af37;
+  --lj-cream: #f7efe0;
+  --lj-ink: #4a2018;
+  position: relative;
+  min-height: 100dvh;
+  overflow-x: hidden;
+  color: var(--lj-cream);
+  background:
+    radial-gradient(ellipse at 50% -10%, rgba(196, 30, 58, 0.35), transparent 55%),
+    linear-gradient(165deg, #5c0000 0%, #8b0000 42%, #6a0a0a 100%);
+  font-family: var(--font-sans, "PingFang SC", "Microsoft YaHei", sans-serif);
+  color-scheme: light;
+}
+.lj-bg {
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+  overflow: hidden;
+}
+.lj-xi {
+  position: absolute;
+  font-size: 64px;
+  font-weight: 700;
+  color: rgba(212, 175, 55, 0.08);
+  line-height: 1;
+}
+.lj-xi-1 { top: 8%; left: 6%; transform: rotate(-12deg); }
+.lj-xi-2 { top: 18%; right: 8%; transform: rotate(10deg); font-size: 88px; }
+.lj-xi-3 { bottom: 22%; left: 10%; transform: rotate(8deg); font-size: 72px; }
+.lj-xi-4 { bottom: 8%; right: 6%; transform: rotate(-6deg); font-size: 56px; }
+.lj-spark {
+  position: absolute;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: var(--lj-gold);
+  opacity: 0.45;
+  box-shadow: 0 0 10px rgba(212, 175, 55, 0.6);
+}
+.lj-spark-1 { top: 28%; left: 18%; }
+.lj-spark-2 { top: 42%; right: 16%; }
+.lj-spark-3 { bottom: 30%; left: 40%; }
+
+.lj-main {
+  position: relative;
+  z-index: 1;
+  width: min(100%, 460px);
+  margin: 0 auto;
+  padding: 36px 18px calc(28px + env(safe-area-inset-bottom));
+}
+
+.lj-hero {
+  text-align: center;
+  margin-bottom: 22px;
+}
+.lj-seal {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 56px;
+  height: 56px;
+  border-radius: 50%;
+  border: 2px solid var(--lj-gold);
+  color: #ffd76a;
+  font-size: 28px;
+  font-weight: 700;
+  background: rgba(0, 0, 0, 0.18);
+  box-shadow: inset 0 0 0 4px rgba(155, 27, 27, 0.35), 0 8px 24px rgba(0, 0, 0, 0.25);
+  margin-bottom: 14px;
+}
+.lj-title {
+  margin: 0;
+  font-size: 28px;
+  font-weight: 400;
+  letter-spacing: 0.35em;
+  color: #ffe9b0;
+  text-indent: 0.35em;
+}
+.lj-sub {
+  margin: 10px 0 0;
+  font-size: 12px;
+  letter-spacing: 0.32em;
+  color: rgba(247, 239, 224, 0.72);
+}
+.lj-divider {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 10px;
+  margin-top: 16px;
+  color: var(--lj-gold);
+  opacity: 0.8;
+}
+.lj-divider span {
+  width: 48px;
+  height: 1px;
+  background: linear-gradient(90deg, transparent, var(--lj-gold), transparent);
+}
+.lj-divider i {
+  font-style: normal;
+  font-size: 11px;
+}
+
+.lj-form-block {
+  border: 1.5px solid rgba(212, 175, 55, 0.45);
+  background: rgba(90, 0, 0, 0.28);
+  box-shadow: inset 0 0 0 1px rgba(255, 215, 120, 0.12), 0 16px 40px rgba(0, 0, 0, 0.22);
+  border-radius: 18px;
+  padding: 18px 16px 20px;
+}
+.lj-unlock {
+  max-width: 420px;
+  width: 100%;
+  margin: 0 auto;
+  grid-column: 1 / -1;
+}
+.lj-form-top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 4px;
+}
+.lj-form-hint {
+  font-size: 11px;
+  letter-spacing: 0.16em;
+  color: rgba(255, 233, 176, 0.55);
+}
+.lj-lock-btn {
+  border: 1px solid rgba(212, 175, 55, 0.35);
+  background: transparent;
+  color: #ffe9b0;
+  border-radius: 999px;
+  padding: 4px 10px;
+  font-size: 11px;
+  letter-spacing: 0.08em;
+  cursor: pointer;
+}
+
+.lj-label {
+  display: block;
+  font-size: 11px;
+  letter-spacing: 0.2em;
+  color: #f0d78a;
+  margin: 12px 0 8px;
+}
+.lj-label:first-child { margin-top: 0; }
+
+.lj-input {
+  display: block;
+  box-sizing: border-box;
+  width: 100%;
+  appearance: none;
+  -webkit-appearance: none;
+  border: 1.5px solid rgba(212, 175, 55, 0.55);
+  background: #c9ad7a;
+  background-color: #c9ad7a;
+  color: #4a2018;
+  -webkit-text-fill-color: #4a2018;
+  caret-color: #9b1b1b;
+  border-radius: 12px;
+  padding: 12px 14px;
+  font-size: 15px;
+  line-height: 1.4;
+  font-weight: 500;
+  font-family: var(--font-calligraphy);
+  outline: none;
+  box-shadow: inset 0 1px 2px rgba(90, 30, 20, 0.06);
+  color-scheme: light;
+}
+.lj-input::placeholder {
+  color: #9a7464;
+  -webkit-text-fill-color: #9a7464;
+  opacity: 1;
+}
+.lj-input:focus {
+  border-color: #ffd76a;
+  background: #d4bc8e;
+  background-color: #d4bc8e;
+  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.28), inset 0 1px 2px rgba(90, 30, 20, 0.04);
+}
+.lj-input:-webkit-autofill,
+.lj-input:-webkit-autofill:hover,
+.lj-input:-webkit-autofill:focus {
+  -webkit-text-fill-color: #4a2018 !important;
+  caret-color: #9b1b1b !important;
+  border-color: rgba(212, 175, 55, 0.55) !important;
+  box-shadow: 0 0 0 1000px #c9ad7a inset !important;
+  transition: background-color 99999s ease-out;
+}
+.lj-notes-groups {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  margin-bottom: 10px;
+}
+.lj-notes-group-title {
+  font-size: 11px;
+  letter-spacing: 0.18em;
+  color: rgba(255, 233, 176, 0.72);
+  margin-bottom: 8px;
+}
+.lj-notes {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+.lj-note-chip {
+  border: 1px solid rgba(212, 175, 55, 0.4);
+  background: rgba(255, 248, 235, 0.12);
+  color: #ffe9b0;
+  border-radius: 999px;
+  padding: 7px 12px;
+  font-size: 12px;
+  letter-spacing: 0.04em;
+  cursor: pointer;
+  transition: background 0.15s, color 0.15s, border-color 0.15s;
+}
+.lj-note-chip:hover {
+  border-color: #ffd76a;
+}
+.lj-note-chip.active {
+  background: linear-gradient(135deg, #d4af37, #b8860b);
+  border-color: #ffd76a;
+  color: #5c0000;
+  font-weight: 600;
+}
+
+.lj-quick {
+  display: grid;
+  grid-template-columns: repeat(5, 1fr);
+  gap: 8px;
+  margin-bottom: 10px;
+}
+.lj-chip {
+  border: 1px solid rgba(212, 175, 55, 0.4);
+  background: rgba(255, 248, 235, 0.12);
+  color: #ffe9b0;
+  border-radius: 999px;
+  padding: 8px 0;
+  font-size: 12px;
+  cursor: pointer;
+  transition: background 0.15s, color 0.15s, border-color 0.15s;
+}
+.lj-chip:hover {
+  border-color: #ffd76a;
+}
+.lj-chip.active {
+  background: linear-gradient(135deg, #d4af37, #b8860b);
+  border-color: #ffd76a;
+  color: #5c0000;
+  font-weight: 600;
+}
+
+.lj-amount-row { position: relative; }
+.lj-yen {
+  position: absolute;
+  left: 14px;
+  top: 50%;
+  transform: translateY(-50%);
+  color: #4a2018;
+  font-size: 14px;
+  font-weight: 600;
+  pointer-events: none;
+  z-index: 1;
+}
+.lj-amount { padding-left: 32px; }
+
+.lj-tip {
+  margin: 12px 0 0;
+  text-align: center;
+  font-size: 12px;
+  letter-spacing: 0.08em;
+}
+.lj-tip.ok { color: #ffe9b0; }
+.lj-tip.err { color: #ffb4b4; }
+
+.lj-submit {
+  width: 100%;
+  margin-top: 16px;
+  border: 1px solid rgba(255, 215, 106, 0.65);
+  background: linear-gradient(135deg, #c41e3a 0%, #9b1b1b 55%, #7a0000 100%);
+  color: #ffe9b0;
+  border-radius: 999px;
+  padding: 14px 16px;
+  letter-spacing: 0.32em;
+  font-size: 14px;
+  cursor: pointer;
+  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
+}
+.lj-submit:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+
+.lj-recent {
+  margin-top: 22px;
+}
+.lj-recent-head {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 12px;
+}
+.lj-recent-title {
+  font-size: 12px;
+  letter-spacing: 0.24em;
+  color: #f0d78a;
+  white-space: nowrap;
+}
+.lj-recent-line {
+  flex: 1;
+  height: 1px;
+  background: linear-gradient(90deg, rgba(212, 175, 55, 0.55), transparent);
+}
+.lj-recent-all {
+  flex-shrink: 0;
+  font-size: 11px;
+  letter-spacing: 0.12em;
+  color: #ffd76a;
+  text-decoration: none;
+  white-space: nowrap;
+  border: 1px solid rgba(212, 175, 55, 0.4);
+  border-radius: 999px;
+  padding: 4px 10px;
+}
+.lj-recent-all:hover {
+  border-color: #ffd76a;
+  background: rgba(212, 175, 55, 0.12);
+}
+.lj-recent-list {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.lj-recent-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 12px 14px;
+  border-radius: 14px;
+  border: 1px solid rgba(212, 175, 55, 0.28);
+  background: rgba(0, 0, 0, 0.18);
+}
+.lj-recent-left {
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+.lj-recent-name {
+  font-size: 14px;
+  color: #fff6e4;
+  letter-spacing: 0.08em;
+}
+.lj-recent-note {
+  font-size: 11px;
+  color: rgba(247, 239, 224, 0.55);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.lj-recent-right {
+  text-align: right;
+  flex-shrink: 0;
+}
+.lj-recent-amount {
+  display: block;
+  color: #ffd76a;
+  font-size: 15px;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+}
+.lj-recent-time {
+  display: block;
+  margin-top: 3px;
+  font-size: 10px;
+  color: rgba(247, 239, 224, 0.5);
+}
+.lj-recent-empty {
+  text-align: center;
+  padding: 18px 12px;
+  font-size: 12px;
+  letter-spacing: 0.16em;
+  color: rgba(247, 239, 224, 0.45);
+  border: 1px dashed rgba(212, 175, 55, 0.28);
+  border-radius: 14px;
+}
+
+@media (max-width: 380px) {
+  .lj-quick { grid-template-columns: repeat(4, 1fr); }
+}
+
+/* PC：加宽 + 表单与最近登记左右分栏，移动端保持原样 */
+@media (min-width: 900px) {
+  .lj-main {
+    width: min(100%, 980px);
+    display: grid;
+    grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
+    gap: 20px 28px;
+    align-items: start;
+    padding: 48px 36px calc(40px + env(safe-area-inset-bottom));
+  }
+  .lj-hero {
+    grid-column: 1 / -1;
+    margin-bottom: 4px;
+  }
+  .lj-seal {
+    width: 64px;
+    height: 64px;
+    font-size: 32px;
+  }
+  .lj-title {
+    font-size: 36px;
+  }
+  .lj-form-block {
+    padding: 24px 28px 28px;
+  }
+  .lj-recent {
+    margin-top: 0;
+    position: sticky;
+    top: 24px;
+  }
+  .lj-recent-list {
+    max-height: calc(100dvh - 220px);
+    overflow-y: auto;
+  }
+}
+
+</style>
+
+<!-- 非 scoped：避免继承页面浅色导致输入字看不见 -->
+<style>
+.lj-root input.lj-input {
+  color: #4a2018 !important;
+  -webkit-text-fill-color: #4a2018 !important;
+  caret-color: #9b1b1b !important;
+  background-color: #c9ad7a !important;
+  font-family: var(--font-calligraphy) !important;
+}
+.lj-root input.lj-input::placeholder {
+  color: #9a7464 !important;
+  -webkit-text-fill-color: #9a7464 !important;
+  opacity: 1 !important;
+}
+.lj-root input.lj-input:focus {
+  border-color: #ffd76a !important;
+  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.28), inset 0 1px 2px rgba(90, 30, 20, 0.04) !important;
+}
+</style>
diff --git a/vite-tailwindcss/src/views/lijin/list.vue b/vite-tailwindcss/src/views/lijin/list.vue
new file mode 100644
index 0000000..2606585
--- /dev/null
+++ b/vite-tailwindcss/src/views/lijin/list.vue
@@ -0,0 +1,697 @@
+<template>
+  <div class="lj-root">
+    <div class="lj-bg" aria-hidden="true">
+      <span class="lj-xi lj-xi-1">囍</span>
+      <span class="lj-xi lj-xi-2">囍</span>
+      <span class="lj-xi lj-xi-3">囍</span>
+      <span class="lj-xi lj-xi-4">囍</span>
+      <i class="lj-spark lj-spark-1"></i>
+      <i class="lj-spark lj-spark-2"></i>
+      <i class="lj-spark lj-spark-3"></i>
+    </div>
+
+    <main class="lj-main lj-main--wide">
+      <header class="lj-hero">
+        <div class="lj-hero-top">
+          <router-link to="/lijin" class="lj-back">← 返回登记</router-link>
+        </div>
+        <div class="lj-seal">囍</div>
+        <h1 class="lj-title calligraphy">礼金明细</h1>
+        <p class="lj-sub">喜结良缘 · 礼尚往来</p>
+        <div class="lj-divider">
+          <span></span><i>✦</i><span></span>
+        </div>
+      </header>
+
+      <!-- 口令解锁 -->
+      <section v-if="!unlocked" class="lj-form-block lj-unlock">
+        <label class="lj-label">查看口令</label>
+        <input
+          v-model="passInput"
+          class="lj-input"
+          type="password"
+          maxlength="64"
+          placeholder="请输入口令"
+          :style="inputStyle"
+          @keyup.enter="onUnlock"
+        />
+        <p v-if="tip" class="lj-tip" :class="tipType">{{ tip }}</p>
+        <button type="button" class="lj-submit" :disabled="busy" @click="onUnlock">
+          {{ busy ? '验证中…' : '进入列表' }}
+        </button>
+      </section>
+
+      <template v-else>
+        <section class="lj-stats">
+          <div class="lj-stat">
+            <span class="lj-stat-label">笔数</span>
+            <span class="lj-stat-value">{{ count }}</span>
+          </div>
+          <div class="lj-stat">
+            <span class="lj-stat-label">合计</span>
+            <span class="lj-stat-value">¥{{ total }}</span>
+          </div>
+          <button type="button" class="lj-lock-btn" @click="onLock">退出</button>
+        </section>
+
+        <section class="lj-filters">
+          <div class="lj-filter-bar">
+            <input
+              v-model="filters.q"
+              class="lj-input lj-search"
+              type="search"
+              placeholder="搜索姓名 / 备注"
+              :style="inputStyle"
+              @keyup.enter="loadList"
+            />
+            <input
+              v-model="filters.min"
+              class="lj-input lj-amt"
+              type="text"
+              inputmode="numeric"
+              placeholder="最低¥"
+              :style="inputStyle"
+              @keyup.enter="loadList"
+            />
+            <input
+              v-model="filters.max"
+              class="lj-input lj-amt"
+              type="text"
+              inputmode="numeric"
+              placeholder="最高¥"
+              :style="inputStyle"
+              @keyup.enter="loadList"
+            />
+            <button type="button" class="lj-filter-go" @click="loadList">筛</button>
+          </div>
+
+          <div class="lj-filter-line">
+            <div class="lj-chips">
+              <button
+                v-for="s in sideOptions"
+                :key="'side-' + s.value"
+                type="button"
+                class="lj-chip"
+                :class="{ active: filters.side === s.value }"
+                @click="setSide(s.value)"
+              >{{ s.label === '全部' ? '归属·全部' : s.label }}</button>
+            </div>
+            <div class="lj-chips lj-chips-sort">
+              <button
+                v-for="s in sortOptions"
+                :key="'sort-' + s.value"
+                type="button"
+                class="lj-chip"
+                :class="{ active: filters.sort === s.value }"
+                @click="setSort(s.value)"
+              >{{ s.label }}</button>
+            </div>
+          </div>
+
+          <div v-if="notePresets.length" class="lj-notes-scroll">
+            <button
+              type="button"
+              class="lj-chip"
+              :class="{ active: !filters.note }"
+              @click="setNote('')"
+            >备注·全部</button>
+            <button
+              v-for="n in notePresets"
+              :key="n"
+              type="button"
+              class="lj-chip"
+              :class="{ active: filters.note === n }"
+              @click="setNote(n)"
+            >{{ n }}</button>
+          </div>
+        </section>
+
+        <p v-if="tip" class="lj-tip" :class="tipType">{{ tip }}</p>
+
+        <section class="lj-cards" :class="{ loading: loading }">
+          <article v-for="item in list" :key="item.id" class="lj-card">
+            <div class="lj-card-top">
+              <span class="lj-card-name calligraphy">{{ item.name }}</span>
+              <span class="lj-card-amount">¥{{ item.amount }}</span>
+            </div>
+            <div class="lj-card-bottom">
+              <span v-if="item.note" class="lj-card-note">{{ item.note }}</span>
+              <span v-else class="lj-card-note muted">无备注</span>
+              <span class="lj-card-time">{{ formatDateTime(item.created_at) }}</span>
+            </div>
+          </article>
+          <div v-if="!loading && !list.length" class="lj-empty">暂无匹配记录</div>
+        </section>
+      </template>
+    </main>
+  </div>
+</template>
+
+<script setup>
+import { onMounted, reactive, ref } from 'vue'
+import { unlockCashGiftView, getCashGiftViewList } from '@/api/wedding'
+
+const TOKEN_KEY = 'cash_gift_view_token'
+const inputStyle = {
+  color: '#4a2018',
+  WebkitTextFillColor: '#4a2018',
+  caretColor: '#9b1b1b',
+  backgroundColor: '#c9ad7a',
+  borderColor: 'rgba(212, 175, 55, 0.55)',
+  fontFamily: 'var(--font-calligraphy)',
+}
+
+const sideOptions = [
+  { value: '', label: '全部' },
+  { value: 'male', label: '男方' },
+  { value: 'female', label: '女方' },
+  { value: 'other', label: '其他' },
+]
+const sortOptions = [
+  { value: 'time_desc', label: '最新' },
+  { value: 'time_asc', label: '最早' },
+  { value: 'amount_desc', label: '金额↓' },
+  { value: 'amount_asc', label: '金额↑' },
+  { value: 'name_asc', label: '姓名' },
+]
+
+const unlocked = ref(false)
+const passInput = ref('')
+const busy = ref(false)
+const loading = ref(false)
+const tip = ref('')
+const tipType = ref('ok')
+const list = ref([])
+const total = ref(0)
+const count = ref(0)
+const notePresets = ref([])
+const viewToken = ref('')
+
+const filters = reactive({
+  q: '',
+  note: '',
+  side: '',
+  min: '',
+  max: '',
+  sort: 'time_desc',
+})
+
+const showTip = (text, type = 'ok') => {
+  tip.value = text
+  tipType.value = type
+  clearTimeout(showTip._t)
+  showTip._t = setTimeout(() => { tip.value = '' }, 2800)
+}
+
+const formatDateTime = (t) => {
+  if (!t) return ''
+  const d = new Date(t)
+  if (Number.isNaN(d.getTime())) return ''
+  const pad = (n) => String(n).padStart(2, '0')
+  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}`
+}
+
+const loadList = async () => {
+  if (!viewToken.value) return
+  loading.value = true
+  tip.value = ''
+  try {
+    const params = {
+      sort: filters.sort || 'time_desc',
+    }
+    const q = String(filters.q || '').trim()
+    if (q) params.q = q
+    if (filters.note) params.note = filters.note
+    if (filters.side) params.side = filters.side
+    const min = String(filters.min || '').replace(/[^\d]/g, '')
+    const max = String(filters.max || '').replace(/[^\d]/g, '')
+    if (min) params.min = min
+    if (max) params.max = max
+
+    const res = await getCashGiftViewList(params, viewToken.value)
+    const data = res.data || {}
+    list.value = Array.isArray(data.list) ? data.list : []
+    total.value = Number(data.total) || 0
+    count.value = Number(data.count) || list.value.length
+    if (Array.isArray(data.notes) && data.notes.length) {
+      notePresets.value = data.notes
+    }
+  } catch (e) {
+    const msg = e?.message || '加载失败'
+    if (/口令|未授权|解锁/.test(msg)) {
+      onLock()
+      showTip(msg, 'err')
+    } else {
+      showTip(msg, 'err')
+    }
+  } finally {
+    loading.value = false
+  }
+}
+
+const setSide = (v) => {
+  filters.side = v
+  loadList()
+}
+const setNote = (v) => {
+  filters.note = v
+  loadList()
+}
+const setSort = (v) => {
+  filters.sort = v
+  loadList()
+}
+
+const onUnlock = async () => {
+  const password = String(passInput.value || '').trim()
+  if (!password) return showTip('请输入口令', 'err')
+  busy.value = true
+  tip.value = ''
+  try {
+    const res = await unlockCashGiftView(password)
+    const token = res.data?.token
+    if (!token) throw new Error('解锁失败')
+    viewToken.value = token
+    sessionStorage.setItem(TOKEN_KEY, token)
+    unlocked.value = true
+    passInput.value = ''
+    await loadList()
+  } catch (e) {
+    showTip(e?.message || '口令错误', 'err')
+  } finally {
+    busy.value = false
+  }
+}
+
+const onLock = () => {
+  unlocked.value = false
+  viewToken.value = ''
+  sessionStorage.removeItem(TOKEN_KEY)
+  list.value = []
+  total.value = 0
+  count.value = 0
+}
+
+onMounted(async () => {
+  const cached = sessionStorage.getItem(TOKEN_KEY) || ''
+  if (!cached) return
+  viewToken.value = cached
+  unlocked.value = true
+  await loadList()
+})
+</script>
+
+<style scoped>
+.lj-root {
+  --lj-red: #9b1b1b;
+  --lj-deep: #7a0000;
+  --lj-gold: #d4af37;
+  --lj-cream: #f7efe0;
+  --lj-ink: #4a2018;
+  position: relative;
+  min-height: 100dvh;
+  overflow-x: hidden;
+  color: var(--lj-cream);
+  background:
+    radial-gradient(ellipse at 50% -10%, rgba(196, 30, 58, 0.35), transparent 55%),
+    linear-gradient(165deg, #5c0000 0%, #8b0000 42%, #6a0a0a 100%);
+  font-family: var(--font-sans, "PingFang SC", "Microsoft YaHei", sans-serif);
+  color-scheme: light;
+}
+.lj-bg {
+  position: absolute;
+  inset: 0;
+  pointer-events: none;
+  overflow: hidden;
+}
+.lj-xi {
+  position: absolute;
+  font-size: 64px;
+  font-weight: 700;
+  color: rgba(212, 175, 55, 0.08);
+  line-height: 1;
+}
+.lj-xi-1 { top: 8%; left: 6%; transform: rotate(-12deg); }
+.lj-xi-2 { top: 18%; right: 8%; transform: rotate(10deg); font-size: 88px; }
+.lj-xi-3 { bottom: 22%; left: 10%; transform: rotate(8deg); font-size: 72px; }
+.lj-xi-4 { bottom: 8%; right: 6%; transform: rotate(-6deg); font-size: 56px; }
+.lj-spark {
+  position: absolute;
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: var(--lj-gold);
+  opacity: 0.45;
+  box-shadow: 0 0 10px rgba(212, 175, 55, 0.6);
+}
+.lj-spark-1 { top: 12%; left: 48%; }
+.lj-spark-2 { top: 42%; right: 18%; }
+.lj-spark-3 { bottom: 30%; left: 40%; }
+
+.lj-main {
+  position: relative;
+  z-index: 1;
+  width: min(100%, 460px);
+  margin: 0 auto;
+  padding: 28px 18px calc(28px + env(safe-area-inset-bottom));
+}
+.lj-main--wide {
+  width: 100%;
+  max-width: none;
+  padding-left: max(18px, 3vw);
+  padding-right: max(18px, 3vw);
+}
+
+.lj-hero { text-align: center; margin-bottom: 22px; }
+.lj-hero-top {
+  display: flex;
+  justify-content: flex-start;
+  margin-bottom: 8px;
+}
+.lj-back {
+  color: rgba(255, 233, 176, 0.85);
+  font-size: 12px;
+  letter-spacing: 0.12em;
+  text-decoration: none;
+}
+.lj-back:hover { color: #ffd76a; }
+.lj-seal {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 56px;
+  height: 56px;
+  border-radius: 50%;
+  border: 2px solid var(--lj-gold);
+  color: #ffd76a;
+  font-size: 28px;
+  font-weight: 700;
+  background: rgba(0, 0, 0, 0.18);
+  box-shadow: inset 0 0 0 4px rgba(155, 27, 27, 0.35), 0 8px 24px rgba(0, 0, 0, 0.25);
+  margin-bottom: 14px;
+}
+.lj-title {
+  margin: 0;
+  font-size: clamp(32px, 6vw, 44px);
+  color: #ffd76a;
+  letter-spacing: 0.12em;
+  font-weight: 400;
+  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
+}
+.lj-sub {
+  margin: 8px 0 0;
+  font-size: 12px;
+  letter-spacing: 0.28em;
+  color: rgba(247, 239, 224, 0.72);
+}
+.lj-divider {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 10px;
+  margin-top: 14px;
+  color: var(--lj-gold);
+}
+.lj-divider span {
+  display: block;
+  width: 48px;
+  height: 1px;
+  background: linear-gradient(90deg, transparent, var(--lj-gold), transparent);
+}
+.lj-divider i { font-style: normal; font-size: 11px; }
+
+.lj-form-block {
+  border: 1.5px solid rgba(212, 175, 55, 0.45);
+  background: rgba(90, 0, 0, 0.28);
+  box-shadow: inset 0 0 0 1px rgba(255, 215, 120, 0.12), 0 16px 40px rgba(0, 0, 0, 0.22);
+  border-radius: 18px;
+  padding: 18px 16px 20px;
+}
+.lj-unlock { max-width: 420px; margin: 0 auto; }
+
+.lj-label {
+  display: block;
+  font-size: 11px;
+  letter-spacing: 0.2em;
+  color: #f0d78a;
+  margin: 0 0 8px;
+}
+.lj-input {
+  display: block;
+  box-sizing: border-box;
+  width: 100%;
+  appearance: none;
+  -webkit-appearance: none;
+  border: 1.5px solid rgba(212, 175, 55, 0.55);
+  background: #c9ad7a;
+  color: #4a2018;
+  -webkit-text-fill-color: #4a2018;
+  caret-color: #9b1b1b;
+  border-radius: 12px;
+  padding: 12px 14px;
+  font-size: 15px;
+  line-height: 1.4;
+  font-weight: 500;
+  font-family: var(--font-calligraphy);
+  outline: none;
+}
+.lj-input::placeholder {
+  color: #9a7464;
+  -webkit-text-fill-color: #9a7464;
+  opacity: 1;
+}
+.lj-input:focus {
+  border-color: #ffd76a;
+  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.28);
+}
+
+.lj-tip {
+  margin: 12px 0 0;
+  text-align: center;
+  font-size: 12px;
+  letter-spacing: 0.08em;
+}
+.lj-tip.ok { color: #ffe9b0; }
+.lj-tip.err { color: #ffb4b4; }
+
+.lj-submit {
+  width: 100%;
+  margin-top: 16px;
+  border: 1px solid rgba(255, 215, 106, 0.65);
+  background: linear-gradient(135deg, #c41e3a 0%, #9b1b1b 55%, #7a0000 100%);
+  color: #ffe9b0;
+  border-radius: 999px;
+  padding: 14px 16px;
+  letter-spacing: 0.32em;
+  font-size: 14px;
+  cursor: pointer;
+  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
+}
+.lj-submit:disabled { opacity: 0.6; cursor: not-allowed; }
+
+.lj-stats {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  flex-wrap: wrap;
+  margin-bottom: 10px;
+  padding: 8px 12px;
+  border: 1px solid rgba(212, 175, 55, 0.35);
+  border-radius: 12px;
+  background: rgba(90, 0, 0, 0.22);
+}
+.lj-stat {
+  display: flex;
+  align-items: baseline;
+  gap: 6px;
+}
+.lj-stat-label {
+  font-size: 11px;
+  letter-spacing: 0.12em;
+  color: rgba(255, 233, 176, 0.65);
+}
+.lj-stat-value {
+  font-size: 16px;
+  color: #ffd76a;
+  font-weight: 600;
+}
+.lj-lock-btn {
+  margin-left: auto;
+  border: 1px solid rgba(212, 175, 55, 0.35);
+  background: transparent;
+  color: #ffe9b0;
+  border-radius: 999px;
+  padding: 4px 10px;
+  font-size: 11px;
+  letter-spacing: 0.08em;
+  cursor: pointer;
+}
+
+.lj-filters {
+  border: 1px solid rgba(212, 175, 55, 0.3);
+  background: rgba(90, 0, 0, 0.18);
+  border-radius: 12px;
+  padding: 8px 10px;
+  margin-bottom: 14px;
+}
+.lj-filter-bar {
+  display: flex;
+  gap: 6px;
+  align-items: stretch;
+}
+.lj-search { flex: 1; min-width: 0; }
+.lj-amt {
+  width: 72px;
+  flex-shrink: 0;
+  padding-left: 8px !important;
+  padding-right: 8px !important;
+  text-align: center;
+}
+.lj-filters .lj-input {
+  padding: 8px 10px;
+  font-size: 13px;
+  border-radius: 8px;
+  border-width: 1px;
+}
+.lj-filter-go {
+  flex-shrink: 0;
+  border: 1px solid rgba(255, 215, 106, 0.5);
+  background: linear-gradient(135deg, #c41e3a, #7a0000);
+  color: #ffe9b0;
+  border-radius: 8px;
+  padding: 0 12px;
+  font-size: 12px;
+  letter-spacing: 0.08em;
+  cursor: pointer;
+}
+.lj-filter-line {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px 10px;
+  align-items: center;
+  margin-top: 8px;
+}
+.lj-chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+}
+.lj-chips-sort {
+  margin-left: auto;
+}
+.lj-chip {
+  border: 1px solid rgba(212, 175, 55, 0.35);
+  background: rgba(255, 248, 235, 0.1);
+  color: #ffe9b0;
+  border-radius: 999px;
+  padding: 3px 8px;
+  font-size: 11px;
+  line-height: 1.4;
+  cursor: pointer;
+  white-space: nowrap;
+}
+.lj-chip.active {
+  background: linear-gradient(135deg, #d4af37, #b8860b);
+  border-color: #ffd76a;
+  color: #5c0000;
+  font-weight: 600;
+}
+.lj-notes-scroll {
+  display: flex;
+  gap: 4px;
+  margin-top: 8px;
+  overflow-x: auto;
+  -webkit-overflow-scrolling: touch;
+  scrollbar-width: thin;
+  padding-bottom: 2px;
+}
+.lj-notes-scroll::-webkit-scrollbar { height: 3px; }
+.lj-notes-scroll::-webkit-scrollbar-thumb {
+  background: rgba(212, 175, 55, 0.35);
+  border-radius: 2px;
+}
+
+.lj-cards {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
+  gap: 12px;
+}
+.lj-cards.loading { opacity: 0.7; }
+.lj-card {
+  border: 1.5px solid rgba(212, 175, 55, 0.4);
+  background: rgba(90, 0, 0, 0.32);
+  border-radius: 16px;
+  padding: 14px 16px;
+  box-shadow: inset 0 0 0 1px rgba(255, 215, 120, 0.08), 0 10px 24px rgba(0, 0, 0, 0.18);
+}
+.lj-card-top {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 12px;
+}
+.lj-card-name {
+  font-size: 22px;
+  color: #ffe9b0;
+  letter-spacing: 0.08em;
+}
+.lj-card-amount {
+  font-size: 18px;
+  color: #ffd76a;
+  font-weight: 700;
+  letter-spacing: 0.04em;
+  flex-shrink: 0;
+}
+.lj-card-bottom {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+  margin-top: 10px;
+}
+.lj-card-note {
+  font-size: 12px;
+  color: rgba(247, 239, 224, 0.72);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.lj-card-note.muted { opacity: 0.45; }
+.lj-card-time {
+  font-size: 11px;
+  color: rgba(247, 239, 224, 0.48);
+  flex-shrink: 0;
+}
+.lj-empty {
+  grid-column: 1 / -1;
+  text-align: center;
+  padding: 36px 12px;
+  font-size: 13px;
+  letter-spacing: 0.16em;
+  color: rgba(247, 239, 224, 0.55);
+  border: 1px dashed rgba(212, 175, 55, 0.28);
+  border-radius: 14px;
+}
+
+@media (max-width: 560px) {
+  .lj-filter-bar { flex-wrap: wrap; }
+  .lj-search { flex: 1 1 100%; }
+  .lj-amt { flex: 1; width: auto; min-width: 0; }
+  .lj-chips-sort { margin-left: 0; }
+}
+</style>
+
+<style>
+.lj-root input.lj-input {
+  color: #4a2018 !important;
+  -webkit-text-fill-color: #4a2018 !important;
+  caret-color: #9b1b1b !important;
+  background-color: #c9ad7a !important;
+  font-family: var(--font-calligraphy) !important;
+}
+.lj-root input.lj-input::placeholder {
+  color: #9a7464 !important;
+  -webkit-text-fill-color: #9a7464 !important;
+  opacity: 1 !important;
+}
+</style>