From 5e609d5ee4fb09d67dfbd2beaadaa6de5ad99b68 Mon Sep 17 00:00:00 2001
From: lq <workerqi@163.com>
Date: Wed, 12 Aug 2026 13:53:06 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=8D=87=E7=BA=A7=E4=BA=86=E4=B8=80?=
 =?UTF-8?q?=E4=BA=9B=E8=A7=86=E8=A7=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/themes/SectionHeading.vue  |  225 ++++
 .../components/themes/covers/CoverClassic.vue |   39 +
 .../themes/covers/CoverGuofengNew.vue         |  143 ++
 .../themes/covers/CoverGuofengOld.vue         |  197 +++
 .../themes/covers/CoverMagazine.vue           |  161 +++
 .../themes/covers/CoverNewspaper.vue          |  161 +++
 .../components/themes/covers/CoverPixel.vue   |  152 +++
 .../src/components/themes/covers/CoverZen.vue |  102 ++
 vite-tailwindcss/src/styles/theme-packs.css   | 1167 +++++++++++++++++
 9 files changed, 2347 insertions(+)
 create mode 100644 vite-tailwindcss/src/components/themes/SectionHeading.vue
 create mode 100644 vite-tailwindcss/src/components/themes/covers/CoverClassic.vue
 create mode 100644 vite-tailwindcss/src/components/themes/covers/CoverGuofengNew.vue
 create mode 100644 vite-tailwindcss/src/components/themes/covers/CoverGuofengOld.vue
 create mode 100644 vite-tailwindcss/src/components/themes/covers/CoverMagazine.vue
 create mode 100644 vite-tailwindcss/src/components/themes/covers/CoverNewspaper.vue
 create mode 100644 vite-tailwindcss/src/components/themes/covers/CoverPixel.vue
 create mode 100644 vite-tailwindcss/src/components/themes/covers/CoverZen.vue
 create mode 100644 vite-tailwindcss/src/styles/theme-packs.css

diff --git a/vite-tailwindcss/src/components/themes/SectionHeading.vue b/vite-tailwindcss/src/components/themes/SectionHeading.vue
new file mode 100644
index 0000000..7bbb0d8
--- /dev/null
+++ b/vite-tailwindcss/src/components/themes/SectionHeading.vue
@@ -0,0 +1,225 @@
+<template>
+  <div class="sh" :class="`sh-${kind}`">
+    <span v-if="indexText" class="sh-index">{{ indexText }}</span>
+    <span v-if="kicker" class="sh-kicker">{{ kicker }}</span>
+    <i class="sh-rule sh-rule-top" aria-hidden="true"></i>
+    <span class="sh-title">{{ title }}</span>
+    <i class="sh-rule sh-rule-bottom" aria-hidden="true"></i>
+    <span v-if="note" class="sh-note">{{ note }}</span>
+  </div>
+</template>
+
+<script setup>
+/**
+ * 完整模板（layout 主题）的统一章节头。
+ * 结构固定，观感按 html[data-theme]（magazine/newspaper/pixel/zen）差异化：
+ * - magazine  左对齐编号大字
+ * - newspaper 居中栏目头，双细线夹标题
+ * - pixel     像素方框标题
+ * - zen       小字 + 细线 + 大留白
+ * pack 主题不使用本组件（各区块保留原有专属设计）。
+ */
+import { computed } from 'vue'
+
+const props = defineProps({
+  title: { type: String, default: '' },
+  kicker: { type: String, default: '' },
+  note: { type: String, default: '' },
+  /** 章节序号（杂志风显示为 01/02…） */
+  index: { type: Number, default: 0 },
+  /** 当前主题 key（用于组件内微调，可不传） */
+  kind: { type: String, default: 'layout' },
+})
+
+const indexText = computed(() => (props.index > 0 ? String(props.index).padStart(2, '0') : ''))
+</script>
+
+<style scoped>
+.sh {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  gap: 6px;
+  margin-bottom: 22px;
+}
+.sh-index {
+  display: none;
+  font-family: var(--font-display);
+  font-style: italic;
+  line-height: 1;
+  color: rgba(var(--c-primary-rgb), 0.34);
+}
+.sh-kicker {
+  font-family: var(--t-font-kicker);
+  font-size: 11px;
+  letter-spacing: 0.34em;
+  text-transform: uppercase;
+  color: var(--c-muted);
+}
+.sh-title {
+  font-family: var(--t-font-title);
+  font-size: 24px;
+  letter-spacing: 0.16em;
+  color: var(--c-ink);
+  line-height: 1.3;
+}
+.sh-note {
+  font-size: 11px;
+  letter-spacing: 0.12em;
+  color: var(--c-muted);
+  max-width: 300px;
+  line-height: 1.9;
+  white-space: pre-wrap;
+}
+.sh-rule {
+  display: none;
+  pointer-events: none;
+}
+
+/* —— 新中式：宋体 + 端部朱砂方点 + 细黛线 —— */
+html[data-theme='guofeng-new'] .sh-kicker {
+  font-family: var(--font-kai);
+  letter-spacing: 0.44em;
+}
+html[data-theme='guofeng-new'] .sh-title {
+  font-family: var(--font-serif);
+  font-weight: 600;
+  letter-spacing: 0.3em;
+  text-indent: 0.3em;
+}
+html[data-theme='guofeng-new'] .sh-rule-bottom {
+  display: block;
+  width: 8px;
+  height: 8px;
+  background: #b5493f;
+  border-radius: 1px;
+  margin-top: 2px;
+}
+
+/* —— 老中式：楷体横批 + 金线双边 —— */
+html[data-theme='guofeng-old'] .sh-kicker {
+  font-family: var(--font-kai);
+  letter-spacing: 0.4em;
+  color: var(--c-line);
+}
+html[data-theme='guofeng-old'] .sh-title {
+  font-family: var(--font-kai);
+  font-weight: 700;
+  letter-spacing: 0.4em;
+  text-indent: 0.4em;
+  color: var(--c-primary);
+}
+html[data-theme='guofeng-old'] .sh-rule {
+  display: block;
+  width: min(220px, 62%);
+  height: 5px;
+  border-top: 1px solid rgba(var(--c-line-rgb), 0.85);
+  border-bottom: 1px solid rgba(var(--c-line-rgb), 0.45);
+}
+
+/* —— 杂志封面：左对齐、超大编号、大写大字距 —— */
+html[data-theme='magazine'] .sh {
+  align-items: flex-start;
+  text-align: left;
+  padding-left: 2px;
+  gap: 2px;
+}
+html[data-theme='magazine'] .sh-index {
+  display: block;
+  font-size: 52px;
+  margin-bottom: 2px;
+}
+html[data-theme='magazine'] .sh-kicker {
+  font-size: 10px;
+  letter-spacing: 0.5em;
+  color: var(--c-primary);
+}
+html[data-theme='magazine'] .sh-title {
+  font-family: var(--font-display);
+  font-size: 30px;
+  font-weight: 700;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+}
+html[data-theme='magazine'] .sh-rule-top {
+  display: block;
+  order: -1;
+  width: 44px;
+  height: 3px;
+  background: var(--c-ink);
+  margin-bottom: 8px;
+}
+html[data-theme='magazine'] .sh-note {
+  text-align: left;
+}
+
+/* —— 日报编辑：居中栏目头，双细线夹标题 —— */
+html[data-theme='newspaper'] .sh {
+  gap: 8px;
+}
+html[data-theme='newspaper'] .sh-kicker {
+  font-family: var(--font-display);
+  font-size: 10px;
+  letter-spacing: 0.44em;
+}
+html[data-theme='newspaper'] .sh-title {
+  font-family: var(--font-serif);
+  font-weight: 700;
+  font-size: 25px;
+  letter-spacing: 0.22em;
+}
+html[data-theme='newspaper'] .sh-rule {
+  display: block;
+  width: min(240px, 68%);
+  height: 3px;
+  border-top: 1px solid var(--c-ink);
+  border-bottom: 1px solid var(--c-ink);
+}
+html[data-theme='newspaper'] .sh-note {
+  font-family: var(--font-serif);
+  font-style: italic;
+}
+
+/* —— 复古像素：像素方框标题 —— */
+html[data-theme='pixel'] .sh-kicker {
+  font-size: 10px;
+  letter-spacing: 0.2em;
+  color: var(--c-line);
+}
+html[data-theme='pixel'] .sh-title {
+  font-size: 19px;
+  letter-spacing: 0.1em;
+  padding: 8px 16px;
+  color: var(--c-primary);
+  border: 3px solid var(--c-primary);
+  box-shadow: 4px 4px 0 rgba(var(--c-line-rgb), 0.55);
+  image-rendering: pixelated;
+}
+html[data-theme='pixel'] .sh-note {
+  font-size: 10px;
+}
+
+/* —— 极简主义：小字 + 一条细线 + 大留白 —— */
+html[data-theme='zen'] .sh {
+  gap: 12px;
+  margin-bottom: 34px;
+}
+html[data-theme='zen'] .sh-kicker {
+  font-size: 9px;
+  letter-spacing: 0.6em;
+}
+html[data-theme='zen'] .sh-title {
+  font-size: 20px;
+  font-weight: 300;
+  letter-spacing: 0.5em;
+  text-indent: 0.5em;
+}
+html[data-theme='zen'] .sh-rule-bottom {
+  display: block;
+  width: 1px;
+  height: 26px;
+  background: rgba(var(--c-line-rgb), 0.6);
+}
+</style>
diff --git a/vite-tailwindcss/src/components/themes/covers/CoverClassic.vue b/vite-tailwindcss/src/components/themes/covers/CoverClassic.vue
new file mode 100644
index 0000000..d65d739
--- /dev/null
+++ b/vite-tailwindcss/src/components/themes/covers/CoverClassic.vue
@@ -0,0 +1,39 @@
+<template>
+  <div class="flex flex-col items-center justify-between py-12 flex-1 w-full relative border-[0.5px] border-[var(--c-primary)]/20 bg-[var(--c-card)]/40">
+    <div v-reveal="'down'" class="text-center mt-6 z-10">
+      <span class="cover-kicker calligraphy text-[10px] tracking-[0.5em] uppercase text-[var(--c-primary)] font-bold block">Wedding Invitation</span>
+      <div class="w-6 h-[0.5px] bg-[var(--c-primary)] mx-auto opacity-50 mt-4"></div>
+    </div>
+
+    <div v-reveal="{ variant: 'scale', delay: 120 }" class="w-full max-w-[260px] aspect-[3/4] relative z-10">
+      <div class="absolute inset-0 border border-[var(--c-primary)] translate-x-3 translate-y-3 opacity-30"></div>
+      <div class="relative w-full h-full z-10 bg-[var(--c-bg)] shadow-md overflow-hidden">
+        <img :src="heroImg" class="w-full h-full object-cover" fetchpriority="high" decoding="async" alt="封面" />
+      </div>
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 200 }" class="text-center z-10 mb-10 space-y-4 px-4 mt-8">
+      <div class="cover-names calligraphy-strong flex items-end justify-center gap-6 text-3xl font-light tracking-[0.2em]">
+        <span>{{ groom }}</span>
+        <span class="text-[var(--c-primary)] text-xl pb-1 italic calligraphy">&amp;</span>
+        <span>{{ bride }}</span>
+      </div>
+      <div class="cover-date flex flex-col items-center text-[11px] text-[var(--c-muted)] tracking-[0.2em] mt-4 uppercase">
+        <span>{{ date }}</span>
+        <div class="w-4 h-[0.5px] bg-[var(--c-primary)]/40 my-2"></div>
+        <span>{{ lunar }}</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+/** 经典封面（风格包主题共用）：卡幅居中 + 偏移描边框，自 index.vue 迁出 */
+defineProps({
+  heroImg: { type: String, default: '' },
+  groom: { type: String, default: '' },
+  bride: { type: String, default: '' },
+  date: { type: String, default: '' },
+  lunar: { type: String, default: '' },
+})
+</script>
diff --git a/vite-tailwindcss/src/components/themes/covers/CoverGuofengNew.vue b/vite-tailwindcss/src/components/themes/covers/CoverGuofengNew.vue
new file mode 100644
index 0000000..18489fb
--- /dev/null
+++ b/vite-tailwindcss/src/components/themes/covers/CoverGuofengNew.vue
@@ -0,0 +1,143 @@
+<template>
+  <div class="gn-root">
+    <svg v-reveal="'down'" class="gn-plum" viewBox="0 0 120 150" aria-hidden="true">
+      <g fill="none" stroke="var(--c-primary)" stroke-opacity="0.55" stroke-width="1.4" stroke-linecap="round">
+        <path d="M96 8C82 40 74 76 78 128" />
+        <path d="M84 52c-12 4-20 12-24 24" />
+        <path d="M80 92c10 2 18 8 22 18" />
+      </g>
+      <g fill="#b5493f" fill-opacity="0.85">
+        <circle cx="58" cy="72" r="3.4" />
+        <circle cx="52" cy="80" r="2.4" />
+        <circle cx="99" cy="106" r="3" />
+        <circle cx="106" cy="112" r="2.2" />
+        <circle cx="90" cy="30" r="2.6" />
+      </g>
+      <g fill="none" stroke="#b5493f" stroke-opacity="0.6" stroke-width="1">
+        <circle cx="66" cy="64" r="2.6" />
+        <circle cx="108" cy="98" r="2.4" />
+      </g>
+    </svg>
+
+    <span v-reveal="'down'" class="gn-kicker">佳 期 · 请 柬</span>
+
+    <div v-reveal="{ variant: 'scale', delay: 160 }" class="gn-moon">
+      <img :src="heroImg" class="gn-img" fetchpriority="high" decoding="async" alt="封面" />
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 280 }" class="gn-names">
+      <span>{{ groom }}</span>
+      <span class="gn-seal" aria-hidden="true">囍</span>
+      <span>{{ bride }}</span>
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 360 }" class="gn-date">
+      <span>{{ date }}</span>
+      <i aria-hidden="true"></i>
+      <span>{{ lunar }}</span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+/** 新中式封面：米白留白 + 月洞门圆窗照片 + 梅枝线描 + 朱砂小印 */
+defineProps({
+  heroImg: { type: String, default: '' },
+  groom: { type: String, default: '' },
+  bride: { type: String, default: '' },
+  date: { type: String, default: '' },
+  lunar: { type: String, default: '' },
+})
+</script>
+
+<style scoped>
+.gn-root {
+  position: relative;
+  width: 100%;
+  flex: 1 1 auto;
+  min-height: 100dvh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 30px;
+  padding: max(30px, env(safe-area-inset-top)) 26px 40px;
+  background: var(--c-bg);
+  overflow: hidden;
+}
+.gn-plum {
+  position: absolute;
+  top: max(10px, env(safe-area-inset-top));
+  right: 6px;
+  width: 108px;
+  height: 136px;
+  pointer-events: none;
+}
+.gn-kicker {
+  font-family: var(--font-kai);
+  font-size: 12px;
+  letter-spacing: 0.5em;
+  text-indent: 0.5em;
+  color: var(--c-muted);
+}
+/* 月洞门：双环细边圆窗 */
+.gn-moon {
+  width: min(66vw, 250px);
+  aspect-ratio: 1;
+  border-radius: 50%;
+  padding: 9px;
+  border: 1px solid rgba(var(--c-primary-rgb), 0.55);
+  box-shadow:
+    inset 0 0 0 4px var(--c-bg),
+    inset 0 0 0 5px rgba(var(--c-line-rgb), 0.6),
+    0 18px 40px rgba(44, 48, 44, 0.12);
+  background: var(--c-card);
+}
+.gn-img {
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  object-fit: cover;
+}
+.gn-names {
+  display: flex;
+  align-items: center;
+  gap: 18px;
+  font-family: var(--font-serif);
+  font-size: clamp(22px, 6.6vw, 27px);
+  font-weight: 600;
+  letter-spacing: 0.3em;
+  text-indent: 0.3em;
+  color: var(--c-ink);
+}
+/* 朱砂方印 */
+.gn-seal {
+  width: 34px;
+  height: 34px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-family: var(--font-kai);
+  font-size: 17px;
+  letter-spacing: 0;
+  text-indent: 0;
+  color: #fdf6f0;
+  background: #b5493f;
+  border-radius: 4px;
+  box-shadow: 0 2px 8px rgba(181, 73, 63, 0.35);
+}
+.gn-date {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  font-family: var(--font-serif);
+  font-size: 11px;
+  letter-spacing: 0.24em;
+  color: var(--c-muted);
+}
+.gn-date i {
+  width: 1px;
+  height: 12px;
+  background: rgba(var(--c-line-rgb), 0.6);
+}
+</style>
diff --git a/vite-tailwindcss/src/components/themes/covers/CoverGuofengOld.vue b/vite-tailwindcss/src/components/themes/covers/CoverGuofengOld.vue
new file mode 100644
index 0000000..6c714cd
--- /dev/null
+++ b/vite-tailwindcss/src/components/themes/covers/CoverGuofengOld.vue
@@ -0,0 +1,197 @@
+<template>
+  <div class="go-root">
+    <div class="go-frame" aria-hidden="true"></div>
+    <span class="go-corner go-corner-tl" aria-hidden="true"></span>
+    <span class="go-corner go-corner-tr" aria-hidden="true"></span>
+    <span class="go-corner go-corner-bl" aria-hidden="true"></span>
+    <span class="go-corner go-corner-br" aria-hidden="true"></span>
+
+    <div v-reveal="'down'" class="go-tassels" aria-hidden="true">
+      <span class="go-tassel"><i></i><b></b></span>
+      <span class="go-kicker">囍 结 良 缘</span>
+      <span class="go-tassel"><i></i><b></b></span>
+    </div>
+
+    <div v-reveal="{ variant: 'scale', delay: 140 }" class="go-fan">
+      <img :src="heroImg" class="go-img" fetchpriority="high" decoding="async" alt="封面" />
+    </div>
+
+    <div v-reveal="{ variant: 'scale', delay: 260 }" class="go-xi calligraphy-strong">囍</div>
+
+    <div v-reveal="{ variant: 'up', delay: 340 }" class="go-names">
+      <span class="go-name">{{ groom }}</span>
+      <span class="go-name-dot" aria-hidden="true">·</span>
+      <span class="go-name">{{ bride }}</span>
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 420 }" class="go-date">
+      <span>{{ date }}</span>
+      <span class="go-lunar">{{ lunar }}</span>
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 480 }" class="go-foot" aria-hidden="true">
+      <i class="go-foot-line"></i>
+      <span>恭 请 光 临</span>
+      <i class="go-foot-line"></i>
+    </div>
+  </div>
+</template>
+
+<script setup>
+/** 老中式封面：朱红鎏金婚书 —— 流苏、团扇照片、大囍、竖排气质金字 */
+defineProps({
+  heroImg: { type: String, default: '' },
+  groom: { type: String, default: '' },
+  bride: { type: String, default: '' },
+  date: { type: String, default: '' },
+  lunar: { type: String, default: '' },
+})
+</script>
+
+<style scoped>
+.go-root {
+  position: relative;
+  width: 100%;
+  flex: 1 1 auto;
+  min-height: 100dvh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-evenly;
+  padding: max(26px, env(safe-area-inset-top)) 26px 34px;
+  background:
+    radial-gradient(ellipse at 50% 12%, rgba(216, 90, 90, 0.35), transparent 46%),
+    linear-gradient(175deg, #b13a44 0%, #9c2f3a 45%, #822631 100%);
+  overflow: hidden;
+  color: var(--c-on-primary);
+}
+/* 金色内框（双线） */
+.go-frame {
+  position: absolute;
+  inset: 14px;
+  border: 1px solid rgba(var(--c-line-rgb), 0.75);
+  outline: 1px solid rgba(var(--c-line-rgb), 0.35);
+  outline-offset: 4px;
+  pointer-events: none;
+}
+/* 回纹角（三层方折线） */
+.go-corner {
+  position: absolute;
+  width: 26px;
+  height: 26px;
+  border: 2px solid rgba(var(--c-line-rgb), 0.9);
+  border-right: 0;
+  border-bottom: 0;
+  pointer-events: none;
+}
+.go-corner::before {
+  content: '';
+  position: absolute;
+  left: 4px;
+  top: 4px;
+  width: 12px;
+  height: 12px;
+  border: 2px solid rgba(var(--c-line-rgb), 0.55);
+  border-right: 0;
+  border-bottom: 0;
+}
+.go-corner-tl { top: 20px; left: 20px; }
+.go-corner-tr { top: 20px; right: 20px; transform: scaleX(-1); }
+.go-corner-bl { bottom: 20px; left: 20px; transform: scaleY(-1); }
+.go-corner-br { bottom: 20px; right: 20px; transform: scale(-1); }
+/* 顶部流苏 + 横批 */
+.go-tassels {
+  display: flex;
+  align-items: flex-start;
+  gap: 22px;
+}
+.go-kicker {
+  font-family: var(--font-kai);
+  font-size: 15px;
+  letter-spacing: 0.5em;
+  text-indent: 0.5em;
+  color: var(--c-line);
+  padding-top: 4px;
+}
+.go-tassel {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.go-tassel i {
+  width: 1px;
+  height: 26px;
+  background: linear-gradient(180deg, rgba(var(--c-line-rgb), 0.9), rgba(var(--c-line-rgb), 0.5));
+}
+.go-tassel b {
+  width: 9px;
+  height: 16px;
+  border-radius: 2px 2px 4px 4px;
+  background: linear-gradient(180deg, var(--c-line), #a37f2e);
+}
+/* 团扇照片 */
+.go-fan {
+  width: min(56vw, 210px);
+  aspect-ratio: 1;
+  border-radius: 50%;
+  padding: 6px;
+  background: linear-gradient(160deg, rgba(var(--c-line-rgb), 0.95), rgba(163, 127, 46, 0.9));
+  box-shadow: 0 14px 36px rgba(60, 10, 16, 0.45);
+}
+.go-img {
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  object-fit: cover;
+  border: 2px solid rgba(255, 246, 230, 0.5);
+}
+/* 大囍 */
+.go-xi {
+  font-size: clamp(56px, 17vw, 78px);
+  line-height: 1;
+  color: var(--c-line);
+  text-shadow: 0 3px 14px rgba(40, 6, 10, 0.5);
+}
+.go-names {
+  display: flex;
+  align-items: baseline;
+  gap: 14px;
+  font-family: var(--font-kai);
+  font-size: clamp(23px, 7vw, 29px);
+  letter-spacing: 0.18em;
+  color: #f7e7c3;
+}
+.go-name-dot {
+  color: rgba(var(--c-line-rgb), 0.9);
+}
+.go-date {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 6px;
+  font-family: var(--font-kai);
+  font-size: 12px;
+  letter-spacing: 0.26em;
+  color: rgba(247, 231, 195, 0.85);
+}
+.go-lunar {
+  font-size: 11px;
+  opacity: 0.8;
+}
+.go-foot {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  font-family: var(--font-kai);
+  font-size: 12px;
+  letter-spacing: 0.5em;
+  text-indent: 0.5em;
+  color: var(--c-line);
+}
+.go-foot-line {
+  width: 40px;
+  height: 5px;
+  border-top: 1px solid rgba(var(--c-line-rgb), 0.7);
+  border-bottom: 1px solid rgba(var(--c-line-rgb), 0.4);
+}
+</style>
diff --git a/vite-tailwindcss/src/components/themes/covers/CoverMagazine.vue b/vite-tailwindcss/src/components/themes/covers/CoverMagazine.vue
new file mode 100644
index 0000000..e703110
--- /dev/null
+++ b/vite-tailwindcss/src/components/themes/covers/CoverMagazine.vue
@@ -0,0 +1,161 @@
+<template>
+  <div class="cm-root">
+    <div class="cm-photo" aria-hidden="true">
+      <img :src="heroImg" class="cm-img" fetchpriority="high" decoding="async" alt="封面" />
+      <span class="cm-photo-veil"></span>
+    </div>
+
+    <div v-reveal="'down'" class="cm-masthead">
+      <span class="cm-logo">VOWS</span>
+      <span class="cm-issue">WEDDING ISSUE</span>
+    </div>
+
+    <div v-reveal="{ variant: 'right', delay: 160 }" class="cm-side" aria-hidden="true">
+      <span>{{ date }}</span>
+    </div>
+
+    <div class="cm-bottom">
+      <div v-reveal="{ variant: 'up', delay: 220 }" class="cm-headline">
+        <span class="cm-kicker">The Wedding Of</span>
+        <span class="cm-names">{{ groom }}<i>&amp;</i>{{ bride }}</span>
+        <span class="cm-sub">{{ lunar }} · 诚邀您见证</span>
+      </div>
+      <div v-reveal="{ variant: 'up', delay: 320 }" class="cm-barcode" aria-hidden="true">
+        <i v-for="n in 18" :key="n"></i>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+/** 杂志封面：全幅大图打底、报头 LOGO、右缘竖排期号、左下贴边大字标题、条码装饰 */
+defineProps({
+  heroImg: { type: String, default: '' },
+  groom: { type: String, default: '' },
+  bride: { type: String, default: '' },
+  date: { type: String, default: '' },
+  lunar: { type: String, default: '' },
+})
+</script>
+
+<style scoped>
+.cm-root {
+  position: relative;
+  width: 100%;
+  /* 父级 page-section 是 min-height 的 flex column：height:100% 会塌陷，必须用 flex 拉伸 */
+  flex: 1 1 auto;
+  min-height: 100dvh;
+  overflow: hidden;
+  background: var(--c-bg-deep);
+}
+.cm-photo {
+  position: absolute;
+  inset: 0;
+}
+.cm-img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+.cm-photo-veil {
+  position: absolute;
+  inset: 0;
+  background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 32%, rgba(0, 0, 0, 0) 46%, rgba(0, 0, 0, 0.56) 100%);
+}
+.cm-masthead {
+  position: absolute;
+  top: max(20px, env(safe-area-inset-top));
+  left: 18px;
+  right: 18px;
+  z-index: 2;
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  color: #fff;
+}
+.cm-logo {
+  font-family: var(--font-display);
+  font-weight: 700;
+  font-size: 40px;
+  letter-spacing: 0.14em;
+  line-height: 1;
+  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.35);
+}
+.cm-issue {
+  font-family: var(--font-cinzel);
+  font-size: 10px;
+  letter-spacing: 0.42em;
+  opacity: 0.92;
+}
+.cm-side {
+  position: absolute;
+  right: 14px;
+  top: 50%;
+  transform: translateY(-50%);
+  z-index: 2;
+  writing-mode: vertical-rl;
+  font-family: var(--font-cinzel);
+  font-size: 10px;
+  letter-spacing: 0.4em;
+  color: rgba(255, 255, 255, 0.85);
+  border-right: 1px solid rgba(255, 255, 255, 0.4);
+  padding-right: 8px;
+}
+.cm-bottom {
+  position: absolute;
+  left: 18px;
+  right: 18px;
+  bottom: max(26px, env(safe-area-inset-bottom));
+  z-index: 2;
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+.cm-headline {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  color: #fff;
+}
+.cm-kicker {
+  font-family: var(--font-cinzel);
+  font-size: 11px;
+  letter-spacing: 0.5em;
+  text-transform: uppercase;
+  opacity: 0.9;
+}
+.cm-names {
+  font-family: var(--font-display);
+  font-weight: 700;
+  font-size: clamp(34px, 11vw, 52px);
+  line-height: 1.12;
+  letter-spacing: 0.04em;
+  text-shadow: 0 3px 18px rgba(0, 0, 0, 0.4);
+}
+.cm-names i {
+  font-style: italic;
+  font-weight: 400;
+  margin: 0 0.18em;
+  opacity: 0.85;
+}
+.cm-sub {
+  font-size: 12px;
+  letter-spacing: 0.24em;
+  opacity: 0.88;
+}
+.cm-barcode {
+  display: flex;
+  align-items: flex-end;
+  gap: 2px;
+  height: 22px;
+  opacity: 0.9;
+}
+.cm-barcode i {
+  width: 2px;
+  background: #fff;
+  height: 100%;
+}
+.cm-barcode i:nth-child(2n) { height: 74%; width: 1px; }
+.cm-barcode i:nth-child(3n) { height: 88%; width: 3px; }
+.cm-barcode i:nth-child(5n) { height: 64%; }
+</style>
diff --git a/vite-tailwindcss/src/components/themes/covers/CoverNewspaper.vue b/vite-tailwindcss/src/components/themes/covers/CoverNewspaper.vue
new file mode 100644
index 0000000..59f6682
--- /dev/null
+++ b/vite-tailwindcss/src/components/themes/covers/CoverNewspaper.vue
@@ -0,0 +1,161 @@
+<template>
+  <div class="cn-root">
+    <div v-reveal="'down'" class="cn-mast">
+      <div class="cn-mast-row">
+        <span class="cn-mast-side">VOL.1314</span>
+        <span class="cn-mast-title">囍事日报</span>
+        <span class="cn-mast-side">NO.520</span>
+      </div>
+      <div class="cn-mast-en">THE WEDDING TIMES</div>
+      <div class="cn-dateline">
+        <span>{{ date }}</span>
+        <span>{{ lunar }}</span>
+        <span>头版头条</span>
+      </div>
+    </div>
+
+    <div v-reveal="{ variant: 'scale', delay: 160 }" class="cn-photo">
+      <img :src="heroImg" class="cn-img" fetchpriority="high" decoding="async" alt="封面" />
+      <span class="cn-caption">本报讯：两位新人于近日喜结连理（资料图）</span>
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 260 }" class="cn-headline">
+      <span class="cn-head-main">{{ groom }} 与 {{ bride }} 即将完婚</span>
+      <span class="cn-head-sub">亲友各界反响热烈 · 诚邀莅临见证</span>
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 340 }" class="cn-cols" aria-hidden="true">
+      <p>本报讯，经多年相识相知，两位新人正式宣布喜讯。婚礼各项筹备工作现已就绪，宴席、流程均已妥善安排。</p>
+      <p>据悉，当日将设签到迎宾、结婚典礼与喜宴等环节。主办方表示：期待您的光临，共同见证这一美好时刻。</p>
+    </div>
+  </div>
+</template>
+
+<script setup>
+/** 日报编辑封面：报头 + 日期栏 + 头版照片 + 大标题 + 双栏导语 */
+defineProps({
+  heroImg: { type: String, default: '' },
+  groom: { type: String, default: '' },
+  bride: { type: String, default: '' },
+  date: { type: String, default: '' },
+  lunar: { type: String, default: '' },
+})
+</script>
+
+<style scoped>
+.cn-root {
+  width: 100%;
+  flex: 1 1 auto;
+  min-height: 100dvh;
+  display: flex;
+  flex-direction: column;
+  padding: max(18px, env(safe-area-inset-top)) 20px 26px;
+  background: var(--c-paper);
+  color: var(--c-ink);
+  font-family: var(--font-serif);
+  overflow: hidden;
+}
+.cn-mast {
+  text-align: center;
+  border-bottom: 3px double var(--c-ink);
+  padding-bottom: 8px;
+}
+.cn-mast-row {
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 8px;
+}
+.cn-mast-side {
+  font-family: var(--font-display);
+  font-size: 9px;
+  letter-spacing: 0.18em;
+  color: var(--c-muted);
+}
+.cn-mast-title {
+  font-weight: 700;
+  font-size: clamp(30px, 9vw, 40px);
+  letter-spacing: 0.24em;
+  text-indent: 0.24em;
+  line-height: 1.2;
+}
+.cn-mast-en {
+  font-family: var(--font-display);
+  font-size: 9px;
+  letter-spacing: 0.5em;
+  color: var(--c-muted);
+  margin-top: 2px;
+}
+.cn-dateline {
+  display: flex;
+  justify-content: space-between;
+  border-top: 1px solid var(--c-ink);
+  margin-top: 6px;
+  padding-top: 5px;
+  font-size: 10px;
+  letter-spacing: 0.1em;
+  color: var(--c-ink-soft);
+}
+.cn-photo {
+  margin-top: 14px;
+  border: 1px solid var(--c-ink);
+  padding: 5px;
+  background: var(--c-card);
+}
+.cn-img {
+  width: 100%;
+  aspect-ratio: 4 / 3;
+  object-fit: cover;
+  display: block;
+  filter: grayscale(0.35) contrast(1.04);
+}
+.cn-caption {
+  display: block;
+  font-size: 9.5px;
+  letter-spacing: 0.06em;
+  color: var(--c-muted);
+  padding: 5px 2px 1px;
+}
+.cn-headline {
+  margin-top: 14px;
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+.cn-head-main {
+  font-weight: 700;
+  font-size: clamp(21px, 6.4vw, 27px);
+  letter-spacing: 0.08em;
+  line-height: 1.35;
+}
+.cn-head-sub {
+  font-size: 12px;
+  letter-spacing: 0.16em;
+  color: var(--c-ink-soft);
+}
+.cn-cols {
+  margin-top: 12px;
+  flex: 1;
+  min-height: 0;
+  column-count: 2;
+  column-gap: 16px;
+  column-rule: 1px solid rgba(var(--c-line-rgb), 0.5);
+  border-top: 1px solid rgba(var(--c-line-rgb), 0.6);
+  padding-top: 10px;
+  overflow: hidden;
+}
+.cn-cols p {
+  margin: 0 0 8px;
+  font-size: 11.5px;
+  line-height: 1.95;
+  letter-spacing: 0.04em;
+  text-align: justify;
+  color: var(--c-ink-soft);
+}
+.cn-cols p::first-letter {
+  font-size: 1.6em;
+  font-weight: 700;
+  color: var(--c-ink);
+}
+</style>
diff --git a/vite-tailwindcss/src/components/themes/covers/CoverPixel.vue b/vite-tailwindcss/src/components/themes/covers/CoverPixel.vue
new file mode 100644
index 0000000..64abedf
--- /dev/null
+++ b/vite-tailwindcss/src/components/themes/covers/CoverPixel.vue
@@ -0,0 +1,152 @@
+<template>
+  <div class="cp-root">
+    <div v-reveal="'down'" class="cp-top">
+      <span class="cp-score">1UP · {{ groom }}</span>
+      <span class="cp-score">2UP · {{ bride }}</span>
+    </div>
+
+    <div v-reveal="{ variant: 'scale', delay: 140 }" class="cp-frame">
+      <div class="cp-photo">
+        <img :src="heroImg" class="cp-img" fetchpriority="high" decoding="async" alt="封面" />
+      </div>
+      <span class="cp-heart cp-heart-1" aria-hidden="true"></span>
+      <span class="cp-heart cp-heart-2" aria-hidden="true"></span>
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 260 }" class="cp-title-wrap">
+      <span class="cp-kicker">WEDDING QUEST</span>
+      <span class="cp-names">{{ groom }} ♥ {{ bride }}</span>
+      <span class="cp-date">{{ date }}</span>
+      <span class="cp-date cp-lunar">{{ lunar }}</span>
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 380 }" class="cp-start">
+      <span class="cp-start-text">- PRESS START -</span>
+      <span class="cp-hint">向上滑动开始我们的故事</span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+/** 复古像素封面：游戏标题屏（1UP/2UP、像素框照片、像素心、PRESS START） */
+defineProps({
+  heroImg: { type: String, default: '' },
+  groom: { type: String, default: '' },
+  bride: { type: String, default: '' },
+  date: { type: String, default: '' },
+  lunar: { type: String, default: '' },
+})
+</script>
+
+<style scoped>
+.cp-root {
+  width: 100%;
+  flex: 1 1 auto;
+  min-height: 100dvh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  padding: max(20px, env(safe-area-inset-top)) 22px 30px;
+  background:
+    var(--t-bg-texture),
+    var(--c-bg);
+  font-family: var(--font-pixel);
+  color: var(--c-ink);
+  overflow: hidden;
+}
+.cp-top {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  font-size: 11px;
+  letter-spacing: 0.08em;
+  color: var(--c-line);
+}
+.cp-frame {
+  position: relative;
+  width: min(78%, 250px);
+}
+.cp-photo {
+  border: 4px solid var(--c-ink);
+  outline: 4px solid var(--c-primary);
+  outline-offset: 4px;
+  padding: 4px;
+  background: var(--c-card);
+  box-shadow: 8px 8px 0 rgba(var(--c-line-rgb), 0.4);
+}
+.cp-img {
+  width: 100%;
+  aspect-ratio: 3 / 4;
+  object-fit: cover;
+  display: block;
+  image-rendering: pixelated;
+  filter: saturate(1.25) contrast(1.05);
+}
+/* 像素心（box-shadow 拼点阵） */
+.cp-heart {
+  position: absolute;
+  width: 6px;
+  height: 6px;
+  background: transparent;
+  box-shadow:
+    6px 0 var(--c-primary), 12px 0 var(--c-primary), 24px 0 var(--c-primary), 30px 0 var(--c-primary),
+    0 6px var(--c-primary), 6px 6px var(--c-primary), 12px 6px var(--c-primary), 18px 6px var(--c-primary), 24px 6px var(--c-primary), 30px 6px var(--c-primary), 36px 6px var(--c-primary),
+    0 12px var(--c-primary), 6px 12px var(--c-primary), 12px 12px var(--c-primary), 18px 12px var(--c-primary), 24px 12px var(--c-primary), 30px 12px var(--c-primary), 36px 12px var(--c-primary),
+    6px 18px var(--c-primary), 12px 18px var(--c-primary), 18px 18px var(--c-primary), 24px 18px var(--c-primary), 30px 18px var(--c-primary),
+    12px 24px var(--c-primary), 18px 24px var(--c-primary), 24px 24px var(--c-primary),
+    18px 30px var(--c-primary);
+  animation: cpHeartBeat 1.4s steps(2) infinite;
+}
+.cp-heart-1 { top: -14px; left: -22px; transform: scale(0.6); }
+.cp-heart-2 { bottom: -8px; right: -26px; transform: scale(0.42) rotate(12deg); }
+@keyframes cpHeartBeat {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0.55; }
+}
+.cp-title-wrap {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 8px;
+  text-align: center;
+}
+.cp-kicker {
+  font-size: 10px;
+  letter-spacing: 0.3em;
+  color: var(--c-line);
+}
+.cp-names {
+  font-size: clamp(19px, 6vw, 24px);
+  letter-spacing: 0.06em;
+  color: var(--c-primary);
+  text-shadow: 3px 3px 0 rgba(var(--c-line-rgb), 0.45);
+}
+.cp-date {
+  font-size: 11px;
+  letter-spacing: 0.1em;
+  color: var(--c-ink-soft);
+}
+.cp-lunar { font-size: 10px; color: var(--c-muted); }
+.cp-start {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 7px;
+}
+.cp-start-text {
+  font-size: 13px;
+  letter-spacing: 0.14em;
+  color: var(--c-ink);
+  animation: cpBlink 1.1s steps(1) infinite;
+}
+@keyframes cpBlink {
+  0%, 60% { opacity: 1; }
+  61%, 100% { opacity: 0; }
+}
+.cp-hint {
+  font-size: 9px;
+  letter-spacing: 0.16em;
+  color: var(--c-muted);
+}
+</style>
diff --git a/vite-tailwindcss/src/components/themes/covers/CoverZen.vue b/vite-tailwindcss/src/components/themes/covers/CoverZen.vue
new file mode 100644
index 0000000..1050975
--- /dev/null
+++ b/vite-tailwindcss/src/components/themes/covers/CoverZen.vue
@@ -0,0 +1,102 @@
+<template>
+  <div class="cz-root">
+    <div v-reveal="'down'" class="cz-kicker">WEDDING INVITATION</div>
+
+    <div class="cz-mid">
+      <div v-reveal="{ variant: 'scale', delay: 140 }" class="cz-photo">
+        <img :src="heroImg" class="cz-img" fetchpriority="high" decoding="async" alt="封面" />
+      </div>
+      <i v-reveal="{ variant: 'up', delay: 220 }" class="cz-axis" aria-hidden="true"></i>
+      <div v-reveal="{ variant: 'up', delay: 280 }" class="cz-names">
+        <span>{{ groom }}</span>
+        <em>/</em>
+        <span>{{ bride }}</span>
+      </div>
+    </div>
+
+    <div v-reveal="{ variant: 'up', delay: 360 }" class="cz-foot">
+      <span>{{ date }}</span>
+      <span class="cz-lunar">{{ lunar }}</span>
+    </div>
+  </div>
+</template>
+
+<script setup>
+/** 极简主义封面：小图 + 一条轴线 + 细字排印，大量留白 */
+defineProps({
+  heroImg: { type: String, default: '' },
+  groom: { type: String, default: '' },
+  bride: { type: String, default: '' },
+  date: { type: String, default: '' },
+  lunar: { type: String, default: '' },
+})
+</script>
+
+<style scoped>
+.cz-root {
+  width: 100%;
+  flex: 1 1 auto;
+  min-height: 100dvh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  padding: max(34px, env(safe-area-inset-top)) 24px 44px;
+  background: var(--c-bg);
+  color: var(--c-ink);
+  font-family: var(--font-sans);
+  overflow: hidden;
+}
+.cz-kicker {
+  font-size: 9px;
+  letter-spacing: 0.66em;
+  text-indent: 0.66em;
+  color: var(--c-muted);
+}
+.cz-mid {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 22px;
+}
+.cz-photo {
+  width: min(52vw, 190px);
+  aspect-ratio: 3 / 4;
+  overflow: hidden;
+}
+.cz-img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  filter: grayscale(0.16);
+}
+.cz-axis {
+  width: 1px;
+  height: 34px;
+  background: rgba(var(--c-line-rgb), 0.7);
+}
+.cz-names {
+  display: flex;
+  align-items: baseline;
+  gap: 14px;
+  font-size: clamp(21px, 6.4vw, 26px);
+  font-weight: 300;
+  letter-spacing: 0.34em;
+  text-indent: 0.34em;
+}
+.cz-names em {
+  font-style: normal;
+  font-size: 0.6em;
+  color: var(--c-muted);
+}
+.cz-foot {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 6px;
+  font-size: 10px;
+  letter-spacing: 0.3em;
+  color: var(--c-muted);
+}
+.cz-lunar { font-size: 9px; opacity: 0.85; }
+</style>
diff --git a/vite-tailwindcss/src/styles/theme-packs.css b/vite-tailwindcss/src/styles/theme-packs.css
new file mode 100644
index 0000000..08b4c19
--- /dev/null
+++ b/vite-tailwindcss/src/styles/theme-packs.css
@@ -0,0 +1,1167 @@
+/* ============================================================
+   风格包 / 完整模板 —— 主题级装饰与字体覆盖
+   - 色板变量在 style.css；此处负责「气质」：字体矩阵、纹理、
+     幕布纹样、专属装饰、night 暗色修补、layout 主题页面覆盖
+   - 选择器统一以 html[data-theme='x'] 开头（作用于前台整页）
+   ============================================================ */
+
+/* —— 通用：正文字体与页面纹理挂载（仅前台内容根，后台界面只跟随配色） —— */
+.wrapper {
+  font-family: var(--t-font-body);
+}
+/* 纹理挂在既有的背景装饰层上（fixed 装饰层，pointer-events 已禁） */
+.bg-glow {
+  background-image: var(--t-bg-texture);
+}
+
+/* ============================================================
+   字体矩阵：让标题书法体跟随主题气质
+   （champagne / french 保持花体默认，不覆盖）
+   ============================================================ */
+html[data-theme='guofeng-old'] .calligraphy,
+html[data-theme='guofeng-old'] .calligraphy-strong,
+html[data-theme='guofeng-old'] .gallery-subtitle {
+  font-family: var(--font-mashan) !important;
+}
+html[data-theme='guofeng-new'] .calligraphy,
+html[data-theme='guofeng-new'] .calligraphy-strong,
+html[data-theme='guofeng-new'] .gallery-subtitle {
+  font-family: var(--font-serif) !important;
+  font-weight: 600;
+}
+html[data-theme='modern'] .calligraphy,
+html[data-theme='modern'] .calligraphy-strong,
+html[data-theme='modern'] .gallery-subtitle {
+  font-family: var(--font-sans) !important;
+  font-weight: 500;
+}
+html[data-theme='forest'] .calligraphy,
+html[data-theme='forest'] .calligraphy-strong,
+html[data-theme='forest'] .gallery-subtitle {
+  font-family: var(--font-longcang) !important;
+}
+html[data-theme='night'] .calligraphy,
+html[data-theme='night'] .calligraphy-strong,
+html[data-theme='night'] .gallery-subtitle {
+  font-family: var(--font-display) !important;
+}
+html[data-theme='magazine'] .calligraphy,
+html[data-theme='magazine'] .calligraphy-strong,
+html[data-theme='magazine'] .gallery-subtitle {
+  font-family: var(--font-display) !important;
+}
+html[data-theme='newspaper'] .calligraphy,
+html[data-theme='newspaper'] .calligraphy-strong,
+html[data-theme='newspaper'] .gallery-subtitle {
+  font-family: var(--font-serif) !important;
+}
+html[data-theme='pixel'] .calligraphy,
+html[data-theme='pixel'] .calligraphy-strong,
+html[data-theme='pixel'] .gallery-subtitle {
+  font-family: var(--font-pixel) !important;
+}
+html[data-theme='zen'] .calligraphy,
+html[data-theme='zen'] .calligraphy-strong,
+html[data-theme='zen'] .gallery-subtitle {
+  font-family: var(--font-sans) !important;
+  font-weight: 300;
+}
+
+/* 造型变量应用：代表性卡片与 CTA */
+.calendar-card,
+.gift-panel,
+.map-sheet,
+.track-pop {
+  border-radius: var(--t-radius-card, 12px);
+}
+.rsvp-cta,
+.map-cta {
+  border-radius: var(--t-radius-btn, 999px);
+}
+
+/* ============================================================
+   老中式：幕布回纹描边 + 婚书红金卡
+   ============================================================ */
+html[data-theme='guofeng-old'] .curtain-door::after {
+  border-top: 3px double rgba(var(--c-line-rgb), 0.55);
+  border-bottom: 3px double rgba(var(--c-line-rgb), 0.55);
+}
+html[data-theme='guofeng-old'] .door-sheen {
+  background-image:
+    repeating-linear-gradient(0deg, rgba(var(--c-line-rgb), 0.12) 0 2px, transparent 2px 14px);
+}
+html[data-theme='guofeng-old'] .invite-cover {
+  background:
+    radial-gradient(ellipse at 50% 14%, rgba(216, 90, 90, 0.28), transparent 48%),
+    linear-gradient(172deg, #ab3641 0%, #932c37 55%, #7e2530 100%);
+  border: 2px solid rgba(var(--c-line-rgb), 0.75);
+  box-shadow:
+    0 28px 70px rgba(59, 12, 16, 0.4),
+    inset 0 0 0 6px rgba(126, 37, 48, 0.9),
+    inset 0 0 0 7px rgba(var(--c-line-rgb), 0.5);
+}
+html[data-theme='guofeng-old'] .curtain-veil {
+  background:
+    radial-gradient(circle at 50% 18%, rgba(255, 232, 214, 0.4), rgba(240, 200, 180, 0.22) 38%, rgba(94, 26, 30, 0.24) 100%),
+    linear-gradient(180deg, rgba(249, 239, 230, 0.32), rgba(240, 216, 200, 0.22));
+}
+/* 新中式：素纱幕布 + 细线月洞帖 */
+html[data-theme='guofeng-new'] .invite-cover {
+  background: var(--c-paper);
+  border: 1px solid rgba(var(--c-primary-rgb), 0.4);
+  box-shadow:
+    0 24px 60px rgba(44, 48, 44, 0.14),
+    inset 0 0 0 5px var(--c-paper),
+    inset 0 0 0 6px rgba(var(--c-line-rgb), 0.45);
+}
+
+/* ============================================================
+   法式浪漫：花枝角饰 + 柔圆卡片
+   ============================================================ */
+html[data-theme='french'] .cover-filigree {
+  border-top: 0;
+  height: 40px;
+  width: 132px;
+  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 132 40'%3E%3Cg fill='none' stroke='%23c78a96' stroke-opacity='.6' stroke-width='1.3' stroke-linecap='round'%3E%3Cpath d='M6 30C36 12 96 12 126 30'/%3E%3Cpath d='M38 22c4-6 10-8 16-6M78 16c6-2 12 0 16 6'/%3E%3C/g%3E%3Cg fill='%23d9aab4' fill-opacity='.75'%3E%3Ccircle cx='66' cy='12' r='3.4'/%3E%3Ccircle cx='60' cy='16' r='2.2'/%3E%3Ccircle cx='72' cy='16' r='2.2'/%3E%3Ccircle cx='24' cy='27' r='2'/%3E%3Ccircle cx='108' cy='27' r='2'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
+}
+html[data-theme='french'] .cover-filigree::before,
+html[data-theme='french'] .cover-filigree::after {
+  display: none;
+}
+html[data-theme='french'] .invite-cover {
+  border-radius: 22px;
+}
+html[data-theme='french'] .invite-cover::before {
+  border-radius: 14px;
+}
+html[data-theme='french'] .ending-photo,
+html[data-theme='french'] .calendar-card {
+  border-radius: 22px;
+}
+
+/* ============================================================
+   现代简约：去衬饰、细线、紧凑字距
+   ============================================================ */
+html[data-theme='modern'] .cover-kicker,
+html[data-theme='modern'] .emblem-kicker {
+  letter-spacing: 0.4em;
+  font-weight: 600;
+}
+html[data-theme='modern'] .emblem-seal {
+  border-radius: 12px;
+}
+html[data-theme='modern'] .ending-keystone .ek-mark {
+  display: none;
+}
+
+/* ============================================================
+   森系自然：叶纹纸感（纹理已由 --t-bg-texture 提供）
+   ============================================================ */
+html[data-theme='forest'] .curtain-veil {
+  background:
+    radial-gradient(circle at 50% 18%, rgba(249, 252, 249, 0.78), rgba(216, 232, 216, 0.4) 38%, rgba(52, 82, 58, 0.2) 100%),
+    linear-gradient(180deg, rgba(243, 248, 242, 0.42), rgba(222, 236, 222, 0.3));
+}
+html[data-theme='forest'] .emblem-seal {
+  border-radius: 999px 999px 999px 4px;
+}
+
+/* ============================================================
+   星空夜色：暗色修补 + 星月装饰
+   ============================================================ */
+/* 幕布：白纱换夜纱，门板深蓝 */
+html[data-theme='night'] .curtain-veil {
+  background:
+    radial-gradient(circle at 50% 18%, rgba(40, 60, 96, 0.5), rgba(16, 27, 46, 0.42) 42%, rgba(4, 8, 16, 0.5) 100%),
+    linear-gradient(180deg, rgba(16, 27, 46, 0.4), rgba(10, 19, 34, 0.5));
+}
+html[data-theme='night'] .curtain-bg {
+  filter: blur(18px) brightness(0.4) saturate(0.9);
+}
+html[data-theme='night'] .invite-cover {
+  background:
+    linear-gradient(135deg, rgba(255, 255, 255, 0.06), transparent 30%, rgba(201, 169, 106, 0.08) 100%),
+    var(--c-paper);
+  border-color: rgba(var(--c-primary-rgb), 0.4);
+  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.5), inset 0 0 0 10px rgba(255, 255, 255, 0.04), inset 0 0 0 11px rgba(var(--c-primary-rgb), 0.2);
+  color: var(--c-ink-soft);
+}
+html[data-theme='night'] .emblem-inner,
+html[data-theme='night'] .emblem-names,
+html[data-theme='night'] .emblem-invite-title {
+  color: var(--c-ink) !important;
+}
+html[data-theme='night'] .emblem-invite-copy,
+html[data-theme='night'] .emblem-date {
+  color: var(--c-ink-soft) !important;
+}
+/* 页面暗部件 */
+html[data-theme='night'] .section-dot {
+  background: rgba(26, 41, 70, 0.75);
+  border-color: rgba(var(--c-primary-rgb), 0.5);
+}
+html[data-theme='night'] .bg-glow i {
+  opacity: 0.3;
+  filter: blur(52px) hue-rotate(190deg) saturate(0.7);
+}
+html[data-theme='night'] .formal-copy {
+  color: var(--c-ink) !important;
+}
+/* 月牙点缀：尾页 kicker 前 */
+html[data-theme='night'] .ending-kicker span::before {
+  content: '☾ ';
+  color: var(--c-primary);
+}
+
+/* ============================================================
+   幕布内容变体（emblem-inner 内，按主题分支渲染）
+   ============================================================ */
+/* 完整模板：隐藏经典弧线花饰（幕布内容已是各自的专属排版） */
+html[data-theme='guofeng-new'] .cover-filigree,
+html[data-theme='guofeng-old'] .cover-filigree,
+html[data-theme='magazine'] .cover-filigree,
+html[data-theme='newspaper'] .cover-filigree,
+html[data-theme='pixel'] .cover-filigree,
+html[data-theme='zen'] .cover-filigree {
+  display: none;
+}
+
+/* ============================================================
+   完整模板：幕布整体形态重构（满屏化）
+   —— 保留 curtain DOM 骨架（退场动画仍作用于同一批元素），
+      卡片撑满全屏后每套做成完全不同的「开场画面」
+   ============================================================ */
+html[data-theme='guofeng-new'] .curtain-emblem,
+html[data-theme='guofeng-old'] .curtain-emblem,
+html[data-theme='magazine'] .curtain-emblem,
+html[data-theme='newspaper'] .curtain-emblem,
+html[data-theme='pixel'] .curtain-emblem,
+html[data-theme='zen'] .curtain-emblem {
+  padding: 0;
+}
+html[data-theme='guofeng-new'] .invite-cover,
+html[data-theme='guofeng-old'] .invite-cover,
+html[data-theme='magazine'] .invite-cover,
+html[data-theme='newspaper'] .invite-cover,
+html[data-theme='pixel'] .invite-cover,
+html[data-theme='zen'] .invite-cover {
+  width: 100%;
+  min-height: 100dvh;
+  max-width: none;
+  border-radius: 0 !important;
+  padding: 0;
+}
+html[data-theme='guofeng-new'] .emblem-inner,
+html[data-theme='guofeng-old'] .emblem-inner,
+html[data-theme='magazine'] .emblem-inner,
+html[data-theme='newspaper'] .emblem-inner,
+html[data-theme='pixel'] .emblem-inner,
+html[data-theme='zen'] .emblem-inner {
+  min-height: 100dvh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: max(44px, env(safe-area-inset-top)) 30px max(44px, env(safe-area-inset-bottom));
+}
+/* 满屏形态不需要门板与模糊底图（各主题另行指定背景） */
+html[data-theme='guofeng-new'] .curtain-door,
+html[data-theme='guofeng-old'] .curtain-door,
+html[data-theme='newspaper'] .curtain-door,
+html[data-theme='pixel'] .curtain-door,
+html[data-theme='zen'] .curtain-door,
+html[data-theme='magazine'] .curtain-door,
+html[data-theme='guofeng-old'] .curtain-bg,
+html[data-theme='newspaper'] .curtain-bg,
+html[data-theme='pixel'] .curtain-bg,
+html[data-theme='zen'] .curtain-bg {
+  display: none;
+}
+
+/* —— 老中式：朱红宫门（门钉阵列 + 中缝金线 + 匾额婚书） —— */
+html[data-theme='guofeng-old'] .curtain-veil {
+  display: none;
+}
+html[data-theme='guofeng-old'] .invite-cover {
+  border: none;
+  box-shadow: none;
+  background:
+    /* 左右两列门钉 */
+    radial-gradient(circle 5px at 14% 50%, rgba(217, 178, 92, 0.95) 92%, transparent) 0 0 / 100% 92px repeat-y,
+    radial-gradient(circle 5px at 86% 50%, rgba(217, 178, 92, 0.95) 92%, transparent) 0 46px / 100% 92px repeat-y,
+    /* 中缝金线 */
+    linear-gradient(90deg, transparent 49.7%, rgba(var(--c-line-rgb), 0.5) 50%, transparent 50.3%),
+    radial-gradient(ellipse at 50% 10%, rgba(216, 90, 90, 0.32), transparent 50%),
+    linear-gradient(174deg, #ab3641 0%, #932c37 52%, #7e2530 100%);
+}
+/* 匾额：婚书内容嵌一块金边红匾 */
+html[data-theme='guofeng-old'] .emblem-inner {
+  max-width: 330px;
+  margin: 0 auto;
+  border: 2px solid rgba(var(--c-line-rgb), 0.8);
+  outline: 1px solid rgba(var(--c-line-rgb), 0.4);
+  outline-offset: 5px;
+  background:
+    radial-gradient(ellipse at 50% 8%, rgba(216, 90, 90, 0.3), transparent 55%),
+    linear-gradient(176deg, #a83440, #8c2833);
+  box-shadow: 0 22px 60px rgba(50, 8, 12, 0.55);
+  min-height: 0;
+  padding: 34px 26px;
+}
+
+/* —— 新中式：月洞门（纸墙挖圆洞，透出真实照片） —— */
+html[data-theme='guofeng-new'] .curtain-bg {
+  filter: blur(0) brightness(0.94) saturate(1.02);
+  transform: scale(1.04);
+}
+html[data-theme='guofeng-new'] .curtain-veil {
+  background: var(--c-bg);
+  -webkit-mask: radial-gradient(circle min(34vw, 150px) at 50% 36%, transparent 0 98.5%, #000 100%);
+  mask: radial-gradient(circle min(34vw, 150px) at 50% 36%, transparent 0 98.5%, #000 100%);
+}
+/* 月洞门描边环（veil 被挖洞，环画在 emblem 层伪元素上） */
+html[data-theme='guofeng-new'] .curtain-emblem::before {
+  content: '';
+  position: absolute;
+  left: 50%;
+  top: 36%;
+  width: min(68vw, 300px);
+  aspect-ratio: 1;
+  transform: translate(-50%, -50%);
+  border-radius: 50%;
+  border: 1px solid rgba(var(--c-primary-rgb), 0.55);
+  box-shadow:
+    inset 0 0 0 4px var(--c-bg),
+    inset 0 0 0 5px rgba(var(--c-line-rgb), 0.55);
+  pointer-events: none;
+  z-index: 1;
+}
+html[data-theme='guofeng-new'] .invite-cover {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+/* 内容让位圆窗：排到下半屏 */
+html[data-theme='guofeng-new'] .emblem-inner {
+  justify-content: flex-end;
+  padding-bottom: max(64px, env(safe-area-inset-bottom));
+}
+
+/* —— 杂志：全幅清晰大片 + 压字 —— */
+html[data-theme='magazine'] .curtain-bg {
+  filter: brightness(0.88) saturate(1.05);
+  transform: scale(1.03);
+  inset: 0;
+}
+html[data-theme='magazine'] .curtain-veil {
+  background: linear-gradient(180deg, rgba(10, 8, 6, 0.42), rgba(10, 8, 6, 0) 30%, rgba(10, 8, 6, 0) 52%, rgba(10, 8, 6, 0.56) 100%);
+}
+html[data-theme='magazine'] .invite-cover {
+  background: transparent;
+  border: none;
+  box-shadow: none;
+}
+html[data-theme='magazine'] .emblem-inner {
+  justify-content: space-between;
+  align-items: flex-start;
+  text-align: left;
+}
+html[data-theme='magazine'] .em-mag-logo {
+  font-size: clamp(56px, 19vw, 84px);
+  color: #fff;
+  text-shadow: 0 3px 20px rgba(0, 0, 0, 0.4);
+}
+html[data-theme='magazine'] .em-mag-issue {
+  color: rgba(255, 255, 255, 0.9);
+}
+html[data-theme='magazine'] .em-mag-names {
+  margin-top: 0;
+  font-size: clamp(34px, 10vw, 46px);
+  color: #fff;
+  text-shadow: 0 3px 18px rgba(0, 0, 0, 0.45);
+}
+html[data-theme='magazine'] .em-mag-names i {
+  color: rgba(255, 255, 255, 0.8);
+}
+html[data-theme='magazine'] .em-mag-bar {
+  margin: 16px 0;
+  background: #fff;
+}
+html[data-theme='magazine'] .em-mag-copy {
+  color: rgba(255, 255, 255, 0.85);
+  margin-bottom: 12px;
+}
+html[data-theme='magazine'] .emblem-hint {
+  color: rgba(255, 255, 255, 0.85);
+}
+html[data-theme='magazine'] .emblem-hint .dot {
+  background: #fff;
+}
+
+/* —— 日报：整版头版纸面 —— */
+html[data-theme='newspaper'] .curtain-veil {
+  display: none;
+}
+html[data-theme='newspaper'] .invite-cover {
+  background:
+    var(--t-bg-texture),
+    var(--c-paper);
+  border: none;
+  box-shadow: none;
+}
+html[data-theme='newspaper'] .emblem-inner {
+  justify-content: flex-start;
+  padding-top: max(56px, env(safe-area-inset-top));
+}
+html[data-theme='newspaper'] .em-news-mast {
+  font-size: clamp(46px, 14vw, 64px);
+}
+html[data-theme='newspaper'] .em-news-rule {
+  width: min(84%, 340px);
+}
+html[data-theme='newspaper'] .em-news-head {
+  font-size: clamp(20px, 6vw, 26px);
+  margin-top: 26px;
+}
+html[data-theme='newspaper'] .em-news-date {
+  margin-top: 16px;
+}
+html[data-theme='newspaper'] .emblem-hint {
+  margin-top: auto;
+}
+
+/* —— 像素：CRT 开机画面（扫描线 + 棋盘底） —— */
+html[data-theme='pixel'] .invite-cover {
+  background:
+    var(--t-bg-texture),
+    var(--c-bg);
+  border: none;
+  box-shadow: none;
+}
+/* 扫描线用 veil 层承担 */
+html[data-theme='pixel'] .curtain-veil {
+  background: repeating-linear-gradient(0deg, rgba(51, 38, 31, 0.045) 0 2px, transparent 2px 4px);
+  z-index: 4;
+  pointer-events: none;
+}
+html[data-theme='pixel'] .emblem-inner {
+  justify-content: space-evenly;
+}
+
+/* —— 极简：纯色静页 —— */
+html[data-theme='zen'] .curtain-veil {
+  display: none;
+}
+html[data-theme='zen'] .invite-cover {
+  background: var(--c-bg);
+  border: none;
+  box-shadow: none;
+}
+/* 新中式帖面 */
+.em-gn-kicker {
+  display: block;
+  font-family: var(--font-kai);
+  font-size: 12px;
+  letter-spacing: 0.5em;
+  text-indent: 0.5em;
+  color: var(--c-muted);
+}
+.em-gn-line {
+  display: block;
+  width: 1px;
+  height: 34px;
+  background: rgba(var(--c-line-rgb), 0.65);
+  margin: 20px auto;
+}
+.em-gn-names {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 14px;
+  font-family: var(--font-serif);
+  font-weight: 600;
+  font-size: 25px;
+  letter-spacing: 0.22em;
+  color: var(--c-ink);
+}
+.em-gn-seal {
+  width: 30px;
+  height: 30px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-family: var(--font-kai);
+  font-size: 15px;
+  letter-spacing: 0;
+  color: #fdf6f0;
+  background: #b5493f;
+  border-radius: 3px;
+}
+.em-gn-date {
+  margin: 16px 0 10px;
+  font-family: var(--font-serif);
+  font-size: 11px;
+  letter-spacing: 0.2em;
+  color: var(--c-muted);
+}
+.em-gn-copy {
+  font-family: var(--font-kai);
+  font-size: 13px;
+  letter-spacing: 0.26em;
+  color: var(--c-ink-soft);
+  margin-bottom: 30px;
+}
+/* 老中式婚书面 */
+.em-go-top {
+  display: block;
+  font-size: 10px;
+  letter-spacing: 0.6em;
+  text-indent: 0.6em;
+  color: var(--c-line);
+}
+.em-go-xi {
+  margin: 14px auto 8px;
+  width: 76px;
+  height: 76px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 44px;
+  line-height: 1;
+  color: var(--c-line);
+  border: 2px solid rgba(var(--c-line-rgb), 0.75);
+  border-radius: 50%;
+  box-shadow: inset 0 0 0 3px rgba(126, 37, 48, 0.8), inset 0 0 0 4px rgba(var(--c-line-rgb), 0.4);
+}
+.em-go-title {
+  font-family: var(--font-kai);
+  font-size: 18px;
+  letter-spacing: 0.6em;
+  text-indent: 0.6em;
+  color: #f7e7c3;
+  margin-bottom: 14px;
+}
+.em-go-names {
+  font-family: var(--font-kai);
+  font-size: 24px;
+  letter-spacing: 0.18em;
+  color: #f7e7c3;
+}
+.em-go-date {
+  margin-top: 12px;
+  font-family: var(--font-kai);
+  font-size: 12px;
+  letter-spacing: 0.22em;
+  color: rgba(247, 231, 195, 0.85);
+}
+.em-go-lunar {
+  margin-top: 6px;
+  margin-bottom: 26px;
+  font-size: 11px;
+  opacity: 0.85;
+}
+/* 老中式婚书面上提示点与文字颜色适配红底 */
+html[data-theme='guofeng-old'] .emblem-hint {
+  color: rgba(247, 231, 195, 0.8);
+}
+html[data-theme='guofeng-old'] .emblem-hint .dot {
+  background: var(--c-line);
+}
+.emblem-seal-char {
+  font-size: 20px;
+  line-height: 1;
+  font-family: var(--t-font-title);
+  color: var(--c-primary);
+}
+/* 杂志刊头 */
+.em-mag-logo {
+  display: block;
+  font-family: var(--font-display);
+  font-weight: 700;
+  font-size: 54px;
+  letter-spacing: 0.16em;
+  color: var(--c-ink);
+  line-height: 1;
+}
+.em-mag-issue {
+  display: block;
+  margin-top: 10px;
+  font-family: var(--font-cinzel);
+  font-size: 10px;
+  letter-spacing: 0.4em;
+  color: var(--c-muted);
+}
+.em-mag-names {
+  margin-top: 40px;
+  font-family: var(--font-display);
+  font-weight: 700;
+  font-size: 30px;
+  letter-spacing: 0.05em;
+  color: var(--c-ink);
+}
+.em-mag-names i {
+  font-style: italic;
+  font-weight: 400;
+  margin: 0 0.16em;
+  color: var(--c-muted);
+}
+.em-mag-bar {
+  width: 46px;
+  height: 4px;
+  background: var(--c-ink);
+  margin: 22px auto;
+}
+.em-mag-copy {
+  font-family: var(--font-cinzel);
+  font-size: 10px;
+  letter-spacing: 0.34em;
+  color: var(--c-muted);
+  margin-bottom: 34px;
+}
+/* 号外报头 */
+.em-news-vol {
+  display: block;
+  font-family: var(--font-serif);
+  font-size: 10px;
+  letter-spacing: 0.4em;
+  color: var(--c-muted);
+}
+.em-news-mast {
+  margin-top: 14px;
+  font-family: var(--font-serif);
+  font-weight: 700;
+  font-size: 44px;
+  letter-spacing: 0.2em;
+  text-indent: 0.2em;
+  color: var(--c-ink);
+  line-height: 1.2;
+}
+.em-news-rule {
+  width: 72%;
+  height: 5px;
+  border-top: 1px solid var(--c-ink);
+  border-bottom: 3px double var(--c-ink);
+  margin: 14px auto 22px;
+}
+.em-news-head {
+  font-family: var(--font-serif);
+  font-weight: 700;
+  font-size: 19px;
+  letter-spacing: 0.12em;
+  color: var(--c-ink-soft);
+}
+.em-news-date {
+  margin: 12px 0 30px;
+  font-family: var(--font-serif);
+  font-size: 11px;
+  letter-spacing: 0.18em;
+  color: var(--c-muted);
+}
+/* 像素标题屏 */
+.em-px-top {
+  display: block;
+  font-family: var(--font-pixel);
+  font-size: 12px;
+  letter-spacing: 0.3em;
+  color: var(--c-line);
+}
+.em-px-heart {
+  margin: 22px auto 18px;
+  width: 58px;
+  height: 58px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 30px;
+  color: var(--c-on-primary);
+  background: var(--c-primary);
+  border: 3px solid var(--c-ink);
+  box-shadow: 5px 5px 0 rgba(var(--c-line-rgb), 0.5);
+  animation: emPxBeat 1.3s steps(2) infinite;
+}
+@keyframes emPxBeat {
+  0%, 100% { transform: scale(1); }
+  50% { transform: scale(1.08); }
+}
+.em-px-names {
+  font-family: var(--font-pixel);
+  font-size: 21px;
+  letter-spacing: 0.08em;
+  color: var(--c-primary);
+  text-shadow: 3px 3px 0 rgba(var(--c-line-rgb), 0.4);
+}
+.em-px-date {
+  margin: 12px 0 26px;
+  font-family: var(--font-pixel);
+  font-size: 11px;
+  color: var(--c-ink-soft);
+}
+.em-px-start {
+  font-family: var(--font-pixel);
+  font-size: 13px;
+  letter-spacing: 0.12em;
+  color: var(--c-ink);
+  animation: emPxBlink 1.1s steps(1) infinite;
+  margin-bottom: 8px;
+}
+@keyframes emPxBlink {
+  0%, 60% { opacity: 1; }
+  61%, 100% { opacity: 0; }
+}
+/* 极简轴线 */
+.em-zen-kicker {
+  display: block;
+  font-size: 9px;
+  letter-spacing: 0.6em;
+  text-indent: 0.6em;
+  color: var(--c-muted);
+}
+.em-zen-line {
+  display: block;
+  width: 1px;
+  height: 40px;
+  background: rgba(var(--c-line-rgb), 0.7);
+  margin: 22px auto;
+}
+.em-zen-names {
+  font-size: 24px;
+  font-weight: 300;
+  letter-spacing: 0.3em;
+  text-indent: 0.3em;
+  color: var(--c-ink);
+}
+.em-zen-names em {
+  font-style: normal;
+  font-size: 0.6em;
+  color: var(--c-muted);
+}
+.em-zen-date {
+  margin: 18px 0 40px;
+  font-size: 10px;
+  letter-spacing: 0.3em;
+  color: var(--c-muted);
+}
+
+/* ============================================================
+   邀请文案页变体（第二屏）
+   ============================================================ */
+/* 新中式：竖排 + 窗棂角 + 朱砂印 */
+.formal-gfnew {
+  position: relative;
+  padding: 34px 30px;
+}
+.fgn-corner {
+  position: absolute;
+  width: 42px;
+  height: 42px;
+  border: 1px solid rgba(var(--c-primary-rgb), 0.5);
+  pointer-events: none;
+}
+.fgn-corner::before {
+  content: '';
+  position: absolute;
+  inset: 5px;
+  border: 1px solid rgba(var(--c-line-rgb), 0.5);
+}
+.fgn-corner-tl { top: 0; left: 0; border-right: 0; border-bottom: 0; }
+.fgn-corner-tl::before { border-right: 0; border-bottom: 0; }
+.fgn-corner-br { bottom: 0; right: 0; border-left: 0; border-top: 0; }
+.fgn-corner-br::before { border-left: 0; border-top: 0; }
+.fgn-cols {
+  display: flex;
+  justify-content: center;
+  gap: 34px;
+  height: 21rem;
+}
+.fgn-main {
+  font-family: var(--font-serif);
+  font-weight: 600;
+  font-size: 19px;
+  letter-spacing: 0.3em;
+  line-height: 1.9;
+  color: var(--c-ink);
+}
+.fgn-main-2 {
+  margin-top: 44px;
+  color: var(--c-ink-soft);
+  font-size: 16px;
+}
+.fgn-side {
+  font-family: var(--font-kai);
+  font-size: 12px;
+  letter-spacing: 0.4em;
+  color: var(--c-muted);
+  margin-top: 84px;
+}
+.fgn-seal {
+  position: absolute;
+  right: 16px;
+  bottom: 18px;
+  width: 30px;
+  height: 30px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-family: var(--font-kai);
+  font-size: 15px;
+  color: #fdf6f0;
+  background: #b5493f;
+  border-radius: 3px;
+  opacity: 0.92;
+}
+/* 老中式：红底金框婚书卷 */
+.formal-gfold {
+  width: 100%;
+  max-width: 330px;
+}
+.fgo-scroll {
+  position: relative;
+  padding: 26px 22px 24px;
+  text-align: center;
+  background:
+    radial-gradient(ellipse at 50% 10%, rgba(216, 90, 90, 0.26), transparent 50%),
+    linear-gradient(174deg, #ab3641, #8c2833);
+  border: 2px solid rgba(var(--c-line-rgb), 0.8);
+  box-shadow:
+    0 18px 44px rgba(70, 16, 22, 0.3),
+    inset 0 0 0 5px rgba(126, 37, 48, 0.9),
+    inset 0 0 0 6px rgba(var(--c-line-rgb), 0.45);
+}
+.fgo-head {
+  display: block;
+  font-family: var(--font-kai);
+  font-size: 15px;
+  letter-spacing: 0.5em;
+  text-indent: 0.5em;
+  color: var(--c-line);
+  margin-bottom: 20px;
+}
+.fgo-cols {
+  display: flex;
+  justify-content: center;
+  gap: 30px;
+  height: 19rem;
+}
+.fgo-main {
+  font-family: var(--font-kai);
+  font-size: 18px;
+  letter-spacing: 0.28em;
+  line-height: 1.9;
+  color: #f7e7c3;
+}
+.fgo-main-2 {
+  margin-top: 40px;
+  font-size: 15px;
+  color: rgba(247, 231, 195, 0.82);
+}
+.fgo-foot {
+  display: block;
+  margin-top: 18px;
+  font-family: var(--font-kai);
+  font-size: 11px;
+  letter-spacing: 0.3em;
+  color: rgba(var(--c-line-rgb), 0.9);
+}
+/* 杂志 pull-quote */
+.formal-mag {
+  position: relative;
+  max-width: 320px;
+  text-align: left;
+  padding: 0 8px;
+}
+.fm-quote {
+  position: absolute;
+  top: -58px;
+  left: -8px;
+  font-family: var(--font-display);
+  font-size: 120px;
+  line-height: 1;
+  color: rgba(var(--c-primary-rgb), 0.14);
+  pointer-events: none;
+}
+.fm-text {
+  margin: 0 0 18px;
+  font-family: var(--font-serif);
+  font-size: 19px;
+  line-height: 2;
+  letter-spacing: 0.06em;
+  color: var(--c-ink);
+  white-space: pre-wrap;
+}
+.fm-text-2 {
+  color: var(--c-ink-soft);
+  font-size: 15px;
+}
+.fm-foot {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-top: 26px;
+}
+.fm-foot i {
+  width: 34px;
+  height: 3px;
+  background: var(--c-ink);
+}
+.fm-foot span {
+  font-family: var(--font-cinzel);
+  font-size: 10px;
+  letter-spacing: 0.3em;
+  color: var(--c-muted);
+}
+/* 日报结婚启事 */
+.formal-news {
+  max-width: 320px;
+  width: 100%;
+  text-align: center;
+  border: 1px solid var(--c-ink);
+  outline: 1px solid var(--c-ink);
+  outline-offset: 4px;
+  padding: 26px 22px;
+  background: var(--c-paper);
+}
+.fn-title {
+  font-family: var(--font-serif);
+  font-weight: 700;
+  font-size: 24px;
+  letter-spacing: 0.3em;
+  color: var(--c-ink);
+}
+.fn-rule {
+  width: 56px;
+  height: 3px;
+  border-top: 1px solid var(--c-ink);
+  border-bottom: 1px solid var(--c-ink);
+  margin: 14px auto 18px;
+}
+.fn-body {
+  margin: 0 0 12px;
+  font-family: var(--font-serif);
+  font-size: 13px;
+  line-height: 2.1;
+  letter-spacing: 0.08em;
+  text-align: justify;
+  color: var(--c-ink-soft);
+  white-space: pre-wrap;
+}
+.fn-sign {
+  margin-top: 16px;
+  font-family: var(--font-serif);
+  font-size: 12px;
+  letter-spacing: 0.14em;
+  color: var(--c-muted);
+}
+/* 像素对话框 */
+.formal-px {
+  width: 100%;
+  max-width: 330px;
+}
+.fp-box {
+  position: relative;
+  border: 3px solid var(--c-ink);
+  box-shadow: 6px 6px 0 rgba(var(--c-line-rgb), 0.45);
+  background: var(--c-card);
+  padding: 24px 18px 30px;
+}
+.fp-tag {
+  position: absolute;
+  top: -12px;
+  left: 12px;
+  padding: 3px 10px;
+  font-family: var(--font-pixel);
+  font-size: 10px;
+  letter-spacing: 0.14em;
+  color: var(--c-on-primary);
+  background: var(--c-primary);
+  border: 2px solid var(--c-ink);
+}
+.fp-line {
+  margin: 0 0 12px;
+  font-family: var(--font-pixel);
+  font-size: 13px;
+  line-height: 2;
+  letter-spacing: 0.05em;
+  color: var(--c-ink);
+  white-space: pre-wrap;
+}
+.fp-next {
+  position: absolute;
+  right: 12px;
+  bottom: 8px;
+  font-size: 12px;
+  color: var(--c-primary);
+  animation: emPxBlink 1s steps(1) infinite;
+}
+/* 极简横排 */
+.formal-zen {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 26px;
+  max-width: 300px;
+  text-align: center;
+}
+.formal-zen p {
+  margin: 0;
+  font-size: 14px;
+  font-weight: 300;
+  line-height: 2.3;
+  letter-spacing: 0.22em;
+  color: var(--c-ink-soft);
+  white-space: pre-wrap;
+}
+.formal-zen i {
+  width: 1px;
+  height: 30px;
+  background: rgba(var(--c-line-rgb), 0.6);
+}
+
+/* ============================================================
+   layout 主题：页面级覆盖与收尾落款
+   ============================================================ */
+/* 收尾落款 */
+.ending-layout-foot {
+  margin-top: 26px;
+  text-align: center;
+}
+.elf {
+  font-size: 10px;
+  letter-spacing: 0.3em;
+  color: var(--c-muted);
+}
+.elf-mag {
+  font-family: var(--font-cinzel);
+  letter-spacing: 0.44em;
+}
+.elf-news {
+  font-family: var(--font-serif);
+}
+.elf-pixel {
+  font-family: var(--font-pixel);
+  color: var(--c-primary);
+  font-size: 11px;
+}
+.elf-zen {
+  font-family: var(--font-display);
+  font-style: italic;
+  font-size: 13px;
+  letter-spacing: 0.2em;
+}
+.elf-gfnew {
+  font-family: var(--font-kai);
+  font-size: 12px;
+  letter-spacing: 0.32em;
+  color: var(--c-ink-soft);
+}
+.elf-gfnew b {
+  display: inline-flex;
+  width: 20px;
+  height: 20px;
+  align-items: center;
+  justify-content: center;
+  margin: 0 6px;
+  font-size: 11px;
+  font-weight: 400;
+  color: #fdf6f0;
+  background: #b5493f;
+  border-radius: 2px;
+  vertical-align: middle;
+}
+.elf-gfold {
+  font-family: var(--font-kai);
+  font-size: 12px;
+  letter-spacing: 0.26em;
+  color: var(--c-primary);
+}
+
+/* 杂志：正式页/日程等的衬线气质 + 无框感 */
+html[data-theme='magazine'] .curtain-veil {
+  background: linear-gradient(180deg, rgba(245, 242, 236, 0.5), rgba(234, 230, 221, 0.42));
+}
+html[data-theme='magazine'] .invite-cover {
+  border-radius: 0;
+  border-width: 2px;
+  border-color: var(--c-ink);
+  box-shadow: 10px 10px 0 rgba(31, 28, 25, 0.12);
+}
+html[data-theme='magazine'] .invite-cover::before,
+html[data-theme='magazine'] .invite-cover::after {
+  display: none;
+}
+html[data-theme='magazine'] .ending-photo {
+  border-radius: 0;
+}
+
+/* 日报：报纸底色 + 直角部件 + 衬线 */
+html[data-theme='newspaper'] .invite-cover {
+  border-radius: 0;
+  border: 1px solid var(--c-ink);
+  box-shadow: 0 0 0 4px var(--c-paper), 0 0 0 5px var(--c-ink), 0 22px 50px rgba(0, 0, 0, 0.18);
+}
+html[data-theme='newspaper'] .ending-photo {
+  border-radius: 0;
+  filter: grayscale(0.3) contrast(1.03);
+}
+html[data-theme='newspaper'] .schedule-node i {
+  border-radius: 0;
+}
+
+/* 像素：方角 + 硬阴影（像素字体由 --t-font-body 全局接管） */
+html[data-theme='pixel'] .invite-cover {
+  border-radius: 0;
+  border: 3px solid var(--c-ink);
+  box-shadow: 8px 8px 0 rgba(var(--c-line-rgb), 0.45);
+}
+html[data-theme='pixel'] .invite-cover::before,
+html[data-theme='pixel'] .invite-cover::after {
+  display: none;
+}
+html[data-theme='pixel'] .rsvp-cta,
+html[data-theme='pixel'] .map-cta,
+html[data-theme='pixel'] .calendar-card,
+html[data-theme='pixel'] .ending-photo {
+  border-radius: 0 !important;
+}
+html[data-theme='pixel'] .rsvp-cta,
+html[data-theme='pixel'] .map-cta {
+  border: 2px solid var(--c-ink);
+  box-shadow: 4px 4px 0 rgba(var(--c-line-rgb), 0.5);
+}
+html[data-theme='pixel'] .preview-img,
+html[data-theme='pixel'] .ending-photo img {
+  image-rendering: auto;
+}
+html[data-theme='pixel'] .schedule-node i {
+  border-radius: 0;
+}
+html[data-theme='pixel'] .section-dot {
+  border-radius: 0;
+}
+
+/* 极简：去圆角、细字、去装饰花字 */
+html[data-theme='zen'] .invite-cover {
+  border-radius: 0;
+  border: 1px solid rgba(var(--c-line-rgb), 0.7);
+  box-shadow: none;
+  background: var(--c-paper);
+}
+html[data-theme='zen'] .invite-cover::after {
+  display: none;
+}
+html[data-theme='zen'] .emblem-seal {
+  border-radius: 0;
+  border-width: 1px;
+}
+html[data-theme='zen'] .ending-photo {
+  border-radius: 0;
+  box-shadow: none;
+}
+html[data-theme='zen'] .rsvp-cta,
+html[data-theme='zen'] .map-cta {
+  border-radius: 0;
+  box-shadow: none;
+}
+html[data-theme='zen'] .rsvp-cta-deco,
+html[data-theme='zen'] .ek-mark {
+  display: none;
+}