/* ==========================================================================
   财神文化典藏 · 全站样式
   基调：宣纸白 / 墨黑 / 朱砂红 / 赤金 / 青蓝 —— 典雅、庄重、留白、秩序感
   深色模式：暗褐底色，不刺眼；动效克制，尊重 prefers-reduced-motion
   ========================================================================== */

/* ---------- 设计变量 ---------- */
:root {
  --paper: #F0E6D7;
  --paper-2: #E6D6C1;
  --paper-3: #D3BCA0;
  --ink: #211512;
  --ink-2: #49362F;
  --ink-3: #755F53;
  --cinnabar: #832C2A;
  --cinnabar-soft: #A0433B;
  --gold: #B78C4A;
  --gold-deep: #79531F;
  --teal: #244A43;
  --line: rgba(92, 48, 38, .18);
  --line-strong: rgba(92, 48, 38, .34);
  --line-gold: rgba(183, 139, 62, .58);
  --shadow: 0 5px 18px rgba(55, 35, 17, .12);
  --shadow-lg: 0 18px 48px rgba(42, 25, 12, .22);
  --font-serif: "Noto Serif SC", "Source Han Serif SC", "Source Han Serif CN", "Songti SC", "SimSun", serif;
  --font-kai: "LXGW WenKai", "Kaiti SC", "KaiTi", "STKaiti", "FangSong", serif;
  --container: 68rem;
  --radius: 4px;
  --header-h: 4.25rem;
  --font-scale: 1;
  --pattern-huiwen: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='28' viewBox='0 0 48 28'%3E%3Cpath d='M4 14 H20 V24 H44 V8 H24 V14 Z' fill='none' stroke='%23A67C00' stroke-width='2' stroke-opacity='0.4'/%3E%3C/svg%3E");
  --pattern-yunwen: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='80' viewBox='0 0 160 80'%3E%3Cg fill='none' stroke='%23A67C00' stroke-width='2' stroke-opacity='0.3'%3E%3Cpath d='M26 66 C12 58 12 40 26 36 C28 20 50 16 56 32 C72 26 82 40 73 51 C64 58 48 56 46 66 Z'/%3E%3Cpath d='M106 66 C92 58 92 40 106 36 C108 20 130 16 136 32 C152 26 162 40 153 51 C144 58 128 56 126 66 Z'/%3E%3C/g%3E%3C/svg%3E");
  --pattern-shuiwen: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='30' viewBox='0 0 140 30'%3E%3Cpath d='M0 15 C20 2 40 28 60 15 S100 2 120 15 S138 26 140 15' fill='none' stroke='%23274753' stroke-width='2' stroke-opacity='0.32'/%3E%3C/svg%3E");
  --pattern-tongqian: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23A67C00' stroke-opacity='0.3'%3E%3Ccircle cx='32' cy='32' r='24' stroke-width='2'/%3E%3Crect x='23' y='23' width='18' height='18' stroke-width='1.5'/%3E%3C/g%3E%3C/svg%3E");
  --pattern-ruyi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='84' viewBox='0 0 84 84'%3E%3Cpath d='M36 22 C44 16 52 24 46 32 C40 40 30 38 28 32 C26 26 32 21 37 24 C40 26 39 29 36 31 M36 31 C36 44 41 56 47 64' fill='none' stroke='%23A67C00' stroke-width='2.5' stroke-linecap='round' stroke-opacity='0.32'/%3E%3C/svg%3E");
  --pattern-yuanbao: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='118' height='70' viewBox='0 0 118 70'%3E%3Cg fill='none' stroke='%23A67C00' stroke-width='1.8' stroke-opacity='.28'%3E%3Cpath d='M20 45c8 15 40 15 48 0l-8-24c-11 7-22 7-32 0z'/%3E%3Cpath d='M28 21c7-12 25-12 32 0M31 45c7-7 20-7 27 0'/%3E%3C/g%3E%3C/svg%3E");
  --pattern-jubaopen: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='92' viewBox='0 0 150 92'%3E%3Cg fill='none' stroke='%23A67C00' stroke-width='1.8' stroke-opacity='.25'%3E%3Cpath d='M35 43h80c-5 29-20 39-40 39S40 72 35 43z'/%3E%3Cpath d='M46 43c8-12 50-12 58 0M54 29l9-15 11 15 10-16 10 16'/%3E%3Ccircle cx='42' cy='27' r='8'/%3E%3Crect x='38' y='23' width='8' height='8'/%3E%3Ccircle cx='109' cy='28' r='8'/%3E%3Crect x='105' y='24' width='8' height='8'/%3E%3C/g%3E%3C/svg%3E");
  --pattern-yaoqianshu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cg fill='none' stroke='%23274753' stroke-width='1.6' stroke-opacity='.2'%3E%3Cpath d='M80 145V42M80 69 48 48M80 86l35-27M80 105l-38-23M80 116l39-25M48 145h64M58 145c6-21 39-21 46 0'/%3E%3Ccircle cx='45' cy='45' r='13'/%3E%3Crect x='39' y='39' width='12' height='12'/%3E%3Ccircle cx='118' cy='55' r='13'/%3E%3Crect x='112' y='49' width='12' height='12'/%3E%3Ccircle cx='39' cy='79' r='11'/%3E%3Crect x='34' y='74' width='10' height='10'/%3E%3Ccircle cx='123' cy='88' r='11'/%3E%3Crect x='118' y='83' width='10' height='10'/%3E%3C/g%3E%3C/svg%3E");
}
html[data-theme="dark"] {
  --paper: #17110D;
  --paper-2: #241A13;
  --paper-3: #34261A;
  --ink: #F2E5C8;
  --ink-2: #DCCBA9;
  --ink-3: #AA9879;
  --cinnabar: #C4564D;
  --cinnabar-soft: #D16A5D;
  --gold: #D0AD67;
  --gold-deep: #E1C17E;
  --teal: #76A090;
  --line: rgba(242, 229, 200, .15);
  --line-strong: rgba(242, 229, 200, .3);
  --line-gold: rgba(208, 173, 103, .52);
  --shadow: 0 2px 14px rgba(0, 0, 0, .5);
  --shadow-lg: 0 12px 36px rgba(0, 0, 0, .6);
}

/* ---------- 基础 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: calc(100% * var(--font-scale)); -webkit-text-size-adjust: 100%; scroll-behavior: smooth; overflow-x: hidden; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  position: relative;
  margin: 0;
  font-family: var(--font-serif);
  font-size: 1.0625rem;
  line-height: 1.9;
  color: var(--ink-2);
  background:
    linear-gradient(rgba(131,44,42,.032), rgba(131,44,42,.032)),
    var(--paper);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(90deg, rgba(128,31,34,.035) 1px, transparent 1px),
    linear-gradient(rgba(128,31,34,.025) 1px, transparent 1px),
    radial-gradient(circle at 16% 13%, rgba(183,139,62,.08), transparent 22rem),
    radial-gradient(circle at 88% 82%, rgba(36,74,67,.055), transparent 24rem);
  background-size: 56px 56px, 56px 56px, auto, auto;
}
img, svg { max-width: 100%; height: auto; }
svg { display: inline-block; vertical-align: middle; }
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-serif);
  color: var(--ink);
  font-weight: 700;
  line-height: 1.42;
  margin: 0 0 .55em;
}
h1 { font-size: clamp(1.9rem, 4.6vw, 2.6rem); letter-spacing: .08em; }
h2 { font-size: clamp(1.4rem, 3vw, 1.75rem); letter-spacing: .06em; }
h3 { font-size: 1.22rem; letter-spacing: .04em; }
h4 { font-size: 1.08rem; }
p { margin: 0 0 1em; }
a { color: var(--teal); text-decoration: none; }
a:hover { color: var(--cinnabar); }
html[data-theme="dark"] a { color: var(--gold); }
html[data-theme="dark"] a:hover { color: var(--cinnabar); }
ul, ol { padding-left: 1.4em; }
blockquote { margin: 1.4em 0; padding: .4em 1.2em; border-left: 3px solid var(--line-gold); color: var(--ink-3); }
hr { border: none; border-top: 1px solid var(--line); margin: 2.4em 0; }
small { color: var(--ink-3); }
::selection { background: var(--cinnabar); color: var(--paper); }
:focus-visible { outline: 3px solid var(--teal); outline-offset: 2px; border-radius: 2px; }
html[data-theme="dark"] :focus-visible { outline-color: var(--gold); }

.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: 1rem; top: -4rem; z-index: 200;
  background: var(--ink); color: var(--paper); padding: .6rem 1.1rem;
  border-radius: 0 0 var(--radius) var(--radius); transition: top .2s;
}
.skip-link:focus { top: 0; color: var(--paper); }

/* ---------- 布局 ---------- */
.container { max-width: var(--container); margin-inline: auto; padding-inline: clamp(1.1rem, 4.5vw, 2rem); }
main { display: block; }
.section { padding-block: clamp(3rem, 7vw, 5.25rem); }
.section { position: relative; overflow: hidden; }
.section > .container { position: relative; z-index: 1; }
.section:nth-of-type(even)::before {
  content: ""; position: absolute; width: 18rem; height: 18rem; right: -8rem; bottom: -7rem;
  background: var(--pattern-tongqian) repeat; opacity: .14; transform: rotate(8deg); pointer-events: none;
  -webkit-mask-image: radial-gradient(circle, #000 25%, transparent 72%);
  mask-image: radial-gradient(circle, #000 25%, transparent 72%);
}
.section--alt {
  background:
    linear-gradient(90deg, rgba(131,44,42,.045), rgba(183,140,74,.08) 50%, rgba(131,44,42,.045)),
    var(--paper-2);
  border-block: 1px solid var(--line-gold);
}
.section--bordered { border-top: 1px solid var(--line); }
.section--water::after {
  content: ""; display: block; height: 30px; margin-top: clamp(2.4rem, 5vw, 4rem);
  background-image: var(--pattern-shuiwen); background-repeat: repeat-x; opacity: .8;
}
.section-head { text-align: center; max-width: 44rem; margin: 0 auto clamp(2rem, 5vw, 3rem); }
.section-head h2 {
  display: inline-block; position: relative; margin-inline: 2.5rem;
  color: var(--cinnabar); letter-spacing: .28em;
}
.section-head h2::before, .section-head h2::after {
  content: ""; position: absolute; top: 50%; width: 1.5rem; height: 1px;
  background: var(--gold); box-shadow: 0 -4px 0 rgba(183,139,62,.3), 0 4px 0 rgba(183,139,62,.3);
}
.section-head h2::before { right: calc(100% + .8rem); }
.section-head h2::after { left: calc(100% + .8rem); }
.section-head p { color: var(--ink-3); margin: 0; }
.ornament-divider { display: block; margin: 1.1rem auto 0; color: var(--gold); }

/* ---------- 页眉 ---------- */
.site-header {
  position: sticky; top: 0; z-index: 60;
  color: #F3E5C6;
  background:
    linear-gradient(90deg, rgba(57,20,17,.52), transparent 24%, transparent 76%, rgba(57,20,17,.52)),
    #54231F;
  border-bottom: 1px solid rgba(208,173,103,.6);
  box-shadow: 0 7px 24px rgba(20,10,4,.28);
}
.site-header::before {
  content: ""; display: block; height: 6px;
  background-image: var(--pattern-huiwen); background-repeat: repeat-x; background-size: 48px 28px;
  background-position: center -14px; opacity: .9;
}
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1.4rem; min-height: var(--header-h); }
.brand { display: inline-flex; align-items: center; gap: .8rem; color: #F3E5C6; flex-shrink: 0; }
.brand:hover { color: #D7B66F; }
.brand-coin { width: 2.55rem; height: 2.55rem; flex-shrink: 0; color: #D0AD67; filter: drop-shadow(0 2px 5px rgba(0,0,0,.5)); }
.brand-text { display: flex; flex-direction: column; line-height: 1.25; }
.brand-name { font-weight: 700; font-size: 1.18rem; letter-spacing: .14em; }
.brand-sub { font-size: .7rem; letter-spacing: .28em; color: #A99672; }
.header-right { display: flex; align-items: center; gap: 1.1rem; }
.primary-nav ul { display: flex; gap: 1.6rem; list-style: none; margin: 0; padding: 0; }
.primary-nav a {
  display: block; padding: .5rem .15rem; color: #D8C7A7; letter-spacing: .12em;
  font-size: .98rem; border-bottom: 2px solid transparent;
}
.primary-nav a:hover { color: #F0D28D; }
.primary-nav a.is-active, .primary-nav a[aria-current="page"] {
  color: #F0D28D; border-bottom-color: #CDA55C; font-weight: 700;
}
html[data-theme="dark"] .primary-nav a.is-active, html[data-theme="dark"] .primary-nav a[aria-current="page"] { color: #F0D28D; border-bottom-color: #CDA55C; }
.header-controls { display: flex; align-items: center; gap: .5rem; }
.ctrl-btn {
  appearance: none; cursor: pointer; font-family: var(--font-serif);
  background: rgba(255,255,255,.025); color: #D8C7A7;
  border: 1px solid rgba(208,173,103,.35); border-radius: 2px;
  min-width: 2.1rem; height: 2.1rem; padding: 0 .5rem; font-size: .82rem; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
}
.ctrl-btn:hover { border-color: #D0AD67; color: #F0D28D; background: rgba(208,173,103,.1); }
html[data-theme="dark"] .ctrl-btn:hover { color: var(--gold); }
.ctrl-btn svg { width: 1.05rem; height: 1.05rem; }
.nav-toggle { display: none; }
.nav-toggle-box { display: inline-block; width: 1.4rem; height: 1rem; position: relative; }
.nav-toggle-box span {
  position: absolute; left: 0; right: 0; height: 2px; background: currentColor; transition: transform .2s, opacity .2s;
}
.nav-toggle-box span:nth-child(1) { top: 0; }
.nav-toggle-box span:nth-child(2) { top: 50%; transform: translateY(-50%); }
.nav-toggle-box span:nth-child(3) { bottom: 0; }
.nav-toggle[aria-expanded="true"] .nav-toggle-box span:nth-child(1) { top: 50%; transform: translateY(-50%) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle-box span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] .nav-toggle-box span:nth-child(3) { bottom: 50%; transform: translateY(50%) rotate(-45deg); }

/* ---------- 首页英雄区 ---------- */
.hero {
  position: relative; overflow: hidden;
  min-height: calc(100svh - var(--header-h) - 6px);
  display: grid; place-items: center; text-align: center;
  padding-block: clamp(3.5rem, 8vw, 6rem);
  color: #F1E4C8;
  background:
    linear-gradient(90deg, rgba(52,19,16,.88), rgba(87,31,27,.42) 18%, rgba(104,40,34,.12) 50%, rgba(87,31,27,.42) 82%, rgba(52,19,16,.88)),
    radial-gradient(ellipse at 50% 42%, rgba(151,59,49,.62), transparent 55%),
    var(--pattern-yuanbao),
    #642823;
  background-size: auto, auto, 177px 105px, auto;
  background-position: center, center, center, center;
}
.hero::before {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(67,23,20,.08), transparent 30%, rgba(48,17,14,.42)),
    linear-gradient(90deg, transparent 4%, rgba(208,173,103,.34) 4%, rgba(208,173,103,.34) calc(4% + 1px), transparent calc(4% + 1px), transparent 96%, rgba(208,173,103,.34) 96%, rgba(208,173,103,.34) calc(96% + 1px), transparent calc(96% + 1px));
  pointer-events: none;
}
.hero::after {
  content: ""; position: absolute; inset: clamp(1rem, 3vw, 2.25rem);
  border: 1px solid rgba(208,173,103,.48);
  box-shadow: inset 0 0 0 5px rgba(128,31,34,.22), inset 0 0 0 6px rgba(208,173,103,.18);
  pointer-events: none;
}
.hero-inner {
  position: relative; z-index: 1; max-width: 49rem; padding: clamp(2rem, 5vw, 3.5rem);
  background: radial-gradient(ellipse, rgba(76,24,21,.58), rgba(76,24,21,.16) 62%, transparent 74%);
}
.hero-inner::before,
.hero-inner::after {
  content: ""; position: absolute; top: 9%; width: 7.5rem; height: 12rem; pointer-events: none;
  background: var(--pattern-yaoqianshu) center / contain no-repeat; opacity: .3;
}
.hero-inner::before { right: calc(100% + 1.5rem); }
.hero-inner::after { left: calc(100% + 1.5rem); transform: scaleX(-1); }
.hero-kicker {
  font-family: var(--font-kai); color: #D8BA79; font-size: 1.06rem;
  letter-spacing: .42em; margin-bottom: 1.5rem;
}
.hero-title {
  position: relative; display: inline-block;
  font-size: clamp(2.7rem, 7.7vw, 4.65rem); font-weight: 900; letter-spacing: .2em;
  color: #F4E8CD; text-shadow: 0 3px 14px rgba(0,0,0,.78);
  margin-bottom: 1.35rem; padding: .1em .35em .2em;
}
.hero-title::after {
  content: ""; position: absolute; left: 14%; right: 14%; bottom: 0; height: 2px;
  background: linear-gradient(90deg, transparent, #D0AD67 20%, #D0AD67 80%, transparent);
}
.hero-title .dot { color: #D6AA58; }
.hero-sub { font-size: clamp(1rem, 2.4vw, 1.2rem); color: #C9B895; letter-spacing: .16em; margin-bottom: 2.7rem; }
.search-wrap { position: relative; max-width: 34rem; margin-inline: auto; text-align: left; }
.search-box {
  display: flex; align-items: center; border: 1px solid rgba(208,173,103,.62); border-radius: 2px;
  background: rgba(243,233,213,.96); box-shadow: 0 12px 36px rgba(0,0,0,.35), inset 0 0 0 3px rgba(128,31,34,.08);
}
.search-box svg { width: 1.2rem; height: 1.2rem; margin-left: 1rem; color: var(--cinnabar); flex-shrink: 0; }
.search-box input {
  flex: 1; min-width: 0; border: none; background: transparent; outline: none;
  font-family: var(--font-serif); font-size: 1rem; color: #18130F;
  padding: .85rem 1rem; letter-spacing: .06em;
}
.search-box input::placeholder { color: #70614E; }
.search-box:focus-within { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(39,71,83,.16); }
html[data-theme="dark"] .search-box:focus-within { box-shadow: 0 0 0 3px rgba(127,163,178,.22); }
.search-results {
  position: absolute; top: calc(100% + .5rem); left: 0; right: 0; z-index: 40;
  background: var(--paper); border: 1px solid var(--line-strong); border-radius: var(--radius);
  box-shadow: var(--shadow-lg); overflow: hidden; max-height: 26rem; overflow-y: auto;
}
.search-results[hidden] { display: none; }
.search-item { display: flex; align-items: baseline; gap: .7rem; padding: .7rem 1rem; border-bottom: 1px solid var(--line); color: var(--ink-2); }
.search-item:last-child { border-bottom: none; }
.search-item:hover, .search-item:focus { background: var(--paper-2); color: var(--ink); }
.search-type { flex-shrink: 0; font-size: .74rem; color: var(--gold-deep); border: 1px solid var(--line-gold); border-radius: 2px; padding: 0 .4em; letter-spacing: .08em; }
html[data-theme="dark"] .search-type { color: var(--gold); }
.search-sub { margin-left: auto; color: var(--ink-3); font-size: .86rem; }
.search-empty { margin: 0; padding: .9rem 1rem; color: var(--ink-3); font-size: .92rem; }
.hero-hint { margin-top: 1.7rem; font-size: .84rem; letter-spacing: .32em; color: #A99672; }
.auspicious-band { width: min(44rem, 94vw); margin: 1.6rem auto -1.2rem; color: #D0AD67; opacity: .8; }
.auspicious-band svg { display: block; width: 100%; }
.auspicious-band path, .auspicious-band circle, .auspicious-band rect {
  fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.auspicious-band .auspicious-line { stroke-width: 1; stroke-dasharray: 3 7; }

/* ---------- 按钮 / 徽标 / 卡片 ---------- */
.btn {
  display: inline-flex; align-items: center; gap: .5em; cursor: pointer;
  font-family: var(--font-serif); font-size: .95rem; letter-spacing: .1em;
  color: var(--paper); background: var(--cinnabar);
  border: 1px solid var(--cinnabar); border-radius: var(--radius);
  padding: .55em 1.5em; transition: background .18s, border-color .18s, color .18s;
}
.btn:hover { background: var(--cinnabar-soft); border-color: var(--cinnabar-soft); color: var(--paper); }
.btn--ghost { background: transparent; color: var(--ink-2); border-color: var(--line-strong); }
.btn--ghost:hover { color: var(--cinnabar); border-color: var(--cinnabar); background: transparent; }
html[data-theme="dark"] .btn--ghost { color: var(--ink-2); }
.tag {
  display: inline-block; font-size: .78rem; letter-spacing: .1em; line-height: 1;
  padding: .3em .7em; border-radius: 2px; border: 1px solid var(--line-strong);
  color: var(--ink-3); background: transparent;
}
.tag--文财神 { color: var(--teal); border-color: rgba(39,71,83,.5); }
.tag--武财神 { color: var(--cinnabar); border-color: rgba(158,43,37,.5); }
.tag--正财神 { color: var(--gold-deep); border-color: var(--line-gold); }
.tag--偏财神 { color: var(--ink-3); border-color: var(--line-strong); }
.tag--五路财神 { color: var(--cinnabar); border-color: rgba(158,43,37,.4); background: rgba(158,43,37,.06); }
html[data-theme="dark"] .tag--文财神 { color: var(--teal); border-color: rgba(127,163,178,.55); }
html[data-theme="dark"] .tag--正财神 { color: var(--gold); }
.note-check {
  display: inline-flex; align-items: center; gap: .35em;
  font-size: .78rem; letter-spacing: .1em; color: var(--gold-deep);
  border: 1px solid var(--line-gold); border-radius: 2px; padding: .2em .6em; background: rgba(166,124,0,.05);
}
html[data-theme="dark"] .note-check { color: var(--gold); }
.card {
  position: relative; isolation: isolate; overflow: hidden;
  display: block;
  background:
    linear-gradient(135deg, rgba(255,255,255,.32), transparent 42%),
    linear-gradient(180deg, rgba(131,44,42,.035), transparent 36%),
    var(--paper-2);
  border: 1px solid var(--line-gold); border-radius: 2px; padding: 1.7rem;
  box-shadow: var(--shadow), inset 0 0 0 4px rgba(128,31,34,.035);
  transition: transform .18s, border-color .18s, box-shadow .18s;
}
.card::before { content: ""; position: absolute; inset: .42rem; z-index: -1; border: 1px solid rgba(183,139,62,.2); pointer-events: none; }
.card::after {
  content: ""; position: absolute; z-index: -1; width: 8rem; height: 8rem; right: -3.4rem; bottom: -3rem;
  background: var(--pattern-ruyi) center / 100% no-repeat; opacity: .36; pointer-events: none;
}
.card:hover { transform: translateY(-4px); border-color: var(--gold); box-shadow: var(--shadow-lg); }
.guide-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; }
.guide-card { color: var(--ink-2); }
.guide-card:hover { color: var(--ink-2); }
.guide-icon { width: 2.5rem; height: 2.5rem; color: var(--cinnabar); margin-bottom: 1rem; filter: drop-shadow(0 2px 0 rgba(183,139,62,.18)); }
.guide-card h3 { margin-bottom: .4rem; }
.guide-card h3 span { color: var(--cinnabar); font-weight: 400; font-size: .95rem; margin-left: .4em; }
.guide-card p { margin: 0; font-size: .92rem; color: var(--ink-3); }

/* ---------- 财神卡片 ---------- */
.deity-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(14.5rem, 1fr)); gap: 1.4rem; }
#deity-grid[data-featured="true"] { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem; }
#deity-grid[data-featured="true"] .deity-card { display: grid; grid-template-columns: minmax(10rem, 42%) minmax(0, 1fr); }
#deity-grid[data-featured="true"] .deity-card-media { aspect-ratio: auto; min-height: 23rem; border-right: 3px double var(--line-gold); border-bottom: 0; }
#deity-grid[data-featured="true"] .deity-card-body { padding: clamp(1.3rem, 3vw, 2rem); justify-content: center; }
#deity-grid[data-featured="true"] .deity-card-name { font-size: 1.55rem; }
.deity-card {
  position: relative; isolation: isolate;
  display: flex; flex-direction: column; overflow: hidden;
  background:
    linear-gradient(180deg, rgba(131,44,42,.04), transparent 32%),
    var(--paper-2);
  border: 1px solid var(--line-gold); border-radius: 2px;
  color: var(--ink-2); box-shadow: var(--shadow), inset 0 0 0 4px rgba(128,31,34,.035);
  transition: transform .18s, border-color .18s, box-shadow .18s;
}
.deity-card::after {
  content: ""; position: absolute; z-index: -1; width: 9.5rem; height: 6rem; right: -2.5rem; bottom: -.8rem;
  background: var(--pattern-yuanbao) center / contain no-repeat; opacity: .32; pointer-events: none;
}
.deity-card:hover { transform: translateY(-5px); border-color: var(--gold); box-shadow: var(--shadow-lg); color: var(--ink-2); }
.deity-card-media { position: relative; aspect-ratio: 8 / 11; overflow: hidden; background: var(--paper-3); border-bottom: 3px double var(--line-gold); }
.deity-card-media::after { content: ""; position: absolute; inset: .6rem; border: 1px solid rgba(183,139,62,.45); box-shadow: inset 0 0 0 3px rgba(128,31,34,.09); pointer-events: none; }
.deity-card-media img { width: 100%; height: 100%; object-fit: cover; }
.deity-card-body { padding: 1.1rem 1.2rem 1.25rem; display: flex; flex-direction: column; flex: 1; }
.deity-card-name { margin-bottom: .15rem; color: var(--cinnabar); letter-spacing: .1em; }
.deity-card-title { color: var(--gold-deep); font-size: .86rem; letter-spacing: .12em; margin-bottom: .55rem; }
html[data-theme="dark"] .deity-card-title { color: var(--gold); }
.deity-card-tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .7rem; }
.deity-card-summary { font-size: .88rem; color: var(--ink-3); margin-bottom: .8rem; }
.deity-card-more { margin-top: auto; font-size: .88rem; letter-spacing: .1em; color: var(--cinnabar); }
.deity-card-more.is-disabled { color: var(--ink-3); }
.deity-card--no-link { cursor: default; }

/* ---------- 筛选 ---------- */
.filter-group { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-bottom: 2rem; }
.filter-btn {
  appearance: none; cursor: pointer; font-family: var(--font-serif); font-size: .92rem;
  letter-spacing: .1em; color: var(--ink-2);
  background: rgba(255,255,255,.18); border: 1px solid var(--line-gold); border-radius: 2px;
  padding: .42em 1.25em; transition: background .15s, color .15s, border-color .15s;
}
.filter-btn:hover { border-color: var(--gold); color: var(--gold-deep); }
html[data-theme="dark"] .filter-btn:hover { color: var(--gold); }
.filter-btn.is-active, .filter-btn[aria-pressed="true"] {
  background: var(--cinnabar); border-color: var(--gold); color: #F5E8CC;
  box-shadow: inset 0 0 0 2px rgba(255,229,170,.13), 0 3px 10px rgba(128,31,34,.16);
}
.filter-count { text-align: center; font-size: .86rem; color: var(--ink-3); letter-spacing: .1em; min-height: 1.6em; margin-bottom: 1rem; }

/* ---------- 面包屑 / 详情页布局 ---------- */
.breadcrumb { font-size: .88rem; color: var(--ink-3); letter-spacing: .06em; padding-block: 1.2rem 0; }
.breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; }
.breadcrumb li + li::before { content: "／"; margin-right: .5rem; color: var(--line-strong); }
.breadcrumb a { color: var(--ink-3); }
.breadcrumb a:hover { color: var(--cinnabar); }
.breadcrumb [aria-current="page"] { color: var(--ink); }

.page-head { position: relative; padding-block: clamp(2.2rem, 5vw, 3.8rem) 0; }
.page-head h1 {
  display: inline-block; color: var(--cinnabar); padding: .2em .7em .28em;
  border-block: 1px solid var(--line-gold); text-shadow: 0 1px 0 rgba(255,255,255,.36);
}
.page-head::after {
  content: ""; display: block; width: min(18rem, 62vw); height: 1.3rem; margin-top: 1.5rem;
  background-image: var(--pattern-huiwen); background-repeat: repeat-x; background-size: 48px 28px;
  background-position: center -7px; opacity: .5;
}
.page-head-lead { max-width: 44rem; color: var(--ink-3); margin-top: .8rem; }
.page-head-meta { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }

.deity-layout { display: grid; grid-template-columns: 14.5rem minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: start; padding-block: 1.6rem; }
.toc { position: sticky; top: calc(var(--header-h) + 1.2rem); }
.toc-box {
  position: relative; overflow: hidden;
  background: var(--paper-2); border: 1px solid var(--line-gold); border-radius: 2px;
  border-top: 5px solid var(--cinnabar); padding: 1.2rem 1.3rem;
  box-shadow: var(--shadow), inset 0 0 0 4px rgba(128,31,34,.035);
}
.toc-box::after {
  content: ""; position: absolute; width: 7rem; height: 7rem; right: -2.8rem; bottom: -2.5rem;
  background: var(--pattern-tongqian) center / contain no-repeat; opacity: .26; pointer-events: none;
}
.toc-title { font-size: .9rem; letter-spacing: .2em; color: var(--gold-deep); margin-bottom: .7rem; }
html[data-theme="dark"] .toc-title { color: var(--gold); }
.toc-box ol { list-style: none; margin: 0; padding: 0; }
.toc-box a {
  display: block; padding: .3rem 0 .3rem .9rem; position: relative;
  color: var(--ink-3); font-size: .92rem; letter-spacing: .06em; border-left: 2px solid var(--line);
}
.toc-box a::before { content: ""; position: absolute; left: -2px; top: 0; bottom: 0; width: 2px; background: transparent; }
.toc-box a:hover { color: var(--cinnabar); }
.toc-box a.is-active { color: var(--cinnabar); border-left-color: var(--cinnabar); font-weight: 700; }

.article { min-width: 0; max-width: 46rem; }
.article h2 { margin-top: 2.6em; padding-top: .4em; scroll-margin-top: calc(var(--header-h) + 1rem); }
.article h2:first-child { margin-top: 0; }
.article h2:not(.visually-hidden) { color: var(--cinnabar); padding-bottom: .42em; border-bottom: 1px solid var(--line-gold); }
.article h2:not(.visually-hidden)::before { content: "◆"; color: var(--gold); font-size: .58em; margin-right: .75em; vertical-align: .16em; }
.article h3 { margin-top: 1.8em; color: var(--cinnabar); font-size: 1.12rem; }
html[data-theme="dark"] .article h3 { color: var(--cinnabar); }
.article p { text-align: justify; }
.article .lead { font-size: 1.12rem; color: var(--ink); letter-spacing: .04em; }
.article figure { margin: 1.6rem 0; }
.article figcaption { font-size: .84rem; color: var(--ink-3); text-align: center; margin-top: .6rem; letter-spacing: .06em; }

/* 宝诰 / 经文盒 */
.scripture-box {
  position: relative;
  background:
    linear-gradient(90deg, rgba(131,44,42,.035), transparent 24%, transparent 76%, rgba(131,44,42,.035)),
    var(--paper-2);
  border: 1px solid var(--line-gold); border-radius: 2px;
  padding: clamp(1.6rem, 4vw, 2.6rem); margin: 1.8rem 0;
  box-shadow: var(--shadow), inset 0 0 0 6px rgba(128,31,34,.04);
}
.scripture-box::after {
  content: ""; position: absolute; width: 9rem; height: 6rem; right: -2.8rem; bottom: -1.4rem;
  background: var(--pattern-jubaopen) center / contain no-repeat; opacity: .25; pointer-events: none;
}
.scripture-box::before {
  content: ""; position: absolute; top: -7px; left: 50%; transform: translateX(-50%);
  width: 88%; height: 14px; background-image: var(--pattern-huiwen);
  background-repeat: repeat-x; background-size: 48px 28px; background-position: center -14px;
}
.scripture-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }
.scripture-head h3 { margin: 0; }
.copy-btn {
  appearance: none; cursor: pointer; font-family: var(--font-serif); font-size: .82rem;
  letter-spacing: .1em; color: var(--gold-deep);
  background: transparent; border: 1px solid var(--line-gold); border-radius: var(--radius);
  padding: .3em .9em; display: inline-flex; align-items: center; gap: .4em;
}
html[data-theme="dark"] .copy-btn { color: var(--gold); }
.copy-btn:hover { color: var(--paper); background: var(--gold-deep); border-color: var(--gold-deep); }
.copy-btn.is-done { color: var(--teal); border-color: var(--teal); }
.scripture-text {
  font-family: var(--font-kai); font-size: 1.13rem; line-height: 2.15;
  color: var(--ink); white-space: pre-line; text-align: center; margin: 0;
}
.scripture-text.is-left { text-align: left; }
.scripture-source { margin: 1.2rem 0 0; font-size: .84rem; color: var(--ink-3); letter-spacing: .08em; }

/* 表格 */
.table-wrap { overflow-x: auto; margin: 1.5rem 0; border: 1px solid var(--line-gold); border-radius: 2px; background: var(--paper-2); box-shadow: var(--shadow); }
table.deity-table { width: 100%; border-collapse: collapse; font-size: .94rem; }
.deity-table caption { padding: .8rem; font-size: .84rem; color: var(--ink-3); letter-spacing: .1em; caption-side: bottom; }
.deity-table th, .deity-table td { padding: .7rem .9rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.deity-table thead th { background: rgba(128,31,34,.1); color: var(--cinnabar); letter-spacing: .12em; font-weight: 700; white-space: nowrap; }
.deity-table tbody tr:last-child td { border-bottom: none; }
.deity-table td:first-child, .deity-table th:first-child { color: var(--cinnabar); font-weight: 700; white-space: nowrap; }

/* 上下篇导航 */
.pager { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 3rem; }
.pager-card {
  display: block; padding: 1.2rem 1.4rem; background: var(--paper-2);
  border: 1px solid var(--line-gold); border-radius: 2px; color: var(--ink-2);
  box-shadow: inset 0 0 0 4px rgba(128,31,34,.035);
  transition: border-color .18s, transform .18s;
}
.pager-card:hover { border-color: var(--line-gold); transform: translateY(-2px); color: var(--ink-2); }
.pager-card--next { text-align: right; }
.pager-label { display: block; font-size: .78rem; letter-spacing: .2em; color: var(--gold-deep); margin-bottom: .3rem; }
html[data-theme="dark"] .pager-label { color: var(--gold); }
.pager-title { font-weight: 700; color: var(--ink); }
.pager-sub { display: block; font-size: .84rem; color: var(--ink-3); margin-top: .2rem; }

/* ---------- 文库 ---------- */
.scripture-list { display: grid; gap: 1.6rem; }
.scripture-item { scroll-margin-top: calc(var(--header-h) + 1rem); }
.scripture-index {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.9rem; height: 1.9rem; margin-right: .6rem;
  border: 1px solid var(--cinnabar); border-radius: 50%;
  color: var(--cinnabar); font-size: .95rem; font-weight: 700;
}
.related-link { font-size: .88rem; }

/* ---------- 图鉴 ---------- */
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1.4rem; }
.gallery-item {
  position: relative;
  margin: 0; display: flex; flex-direction: column;
  background:
    linear-gradient(180deg, rgba(131,44,42,.04), transparent 34%),
    var(--paper-2);
  border: 1px solid var(--line-gold); border-radius: 2px;
  overflow: hidden; box-shadow: var(--shadow), inset 0 0 0 4px rgba(128,31,34,.035);
  transition: transform .18s, border-color .18s;
}
.gallery-item::after {
  content: ""; position: absolute; width: 6rem; height: 6rem; right: -2.8rem; bottom: -2.8rem;
  background: var(--pattern-tongqian) center / contain no-repeat; opacity: .2; pointer-events: none;
}
.gallery-item:hover { transform: translateY(-4px); border-color: var(--gold); box-shadow: var(--shadow-lg); }
.gallery-item-btn {
  appearance: none; cursor: zoom-in; display: block; padding: 0; border: none;
  position: relative; background: var(--paper-3); aspect-ratio: 4 / 5; overflow: hidden; width: 100%;
}
.gallery-item-btn img { width: 100%; height: 100%; object-fit: cover; }
.gallery-item-btn::after {
  content: ""; position: absolute; inset: .55rem; border: 1px solid rgba(183,139,62,.42);
  box-shadow: inset 0 0 0 3px rgba(128,31,34,.08); pointer-events: none;
}
.gallery-item figcaption { padding: .9rem 1rem 1.1rem; }
.gallery-title { display: block; font-weight: 700; color: var(--ink); }
.gallery-meta { display: block; font-size: .78rem; letter-spacing: .14em; color: var(--gold-deep); margin-top: .2rem; }
html[data-theme="dark"] .gallery-meta { color: var(--gold); }
.gallery-caption { font-size: .86rem; color: var(--ink-3); margin: .5rem 0 0; }
.strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; }
.strip .gallery-item-btn { aspect-ratio: 4 / 3.4; }

/* 灯箱 */
.lightbox {
  position: fixed; inset: 0; z-index: 120; display: flex; align-items: center; justify-content: center;
  background: rgba(16, 13, 9, .93); padding: clamp(1rem, 4vw, 3rem);
}
.lightbox[hidden] { display: none; }
.lightbox-figure { margin: 0; max-width: min(60rem, 92vw); text-align: center; }
.lightbox-figure img { max-height: 76vh; width: auto; max-width: 100%; margin-inline: auto; box-shadow: var(--shadow-lg); border: 1px solid rgba(236,229,212,.2); }
.lightbox-figure figcaption { color: #D8CFBA; font-size: .92rem; margin-top: .9rem; letter-spacing: .06em; }
.lightbox-count { display: block; color: #B0A68F; font-size: .8rem; letter-spacing: .2em; margin-top: .35rem; }
.lb-btn {
  position: absolute; appearance: none; cursor: pointer; z-index: 2;
  width: 2.8rem; height: 2.8rem; border-radius: 50%;
  background: rgba(28,28,28,.55); border: 1px solid rgba(236,229,212,.45); color: #ECE5D4;
  font-size: 1.4rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center;
}
.lb-btn:hover { background: rgba(158,43,37,.8); }
.lb-close { top: 1rem; right: 1rem; }
.lb-prev { left: clamp(.5rem, 2vw, 1.5rem); top: 50%; transform: translateY(-50%); }
.lb-next { right: clamp(.5rem, 2vw, 1.5rem); top: 50%; transform: translateY(-50%); }

/* ---------- 提示与声明 ---------- */
.notice {
  border: 1px solid var(--line-gold); border-left: 4px solid var(--cinnabar);
  background: linear-gradient(90deg, rgba(128,31,34,.065), rgba(183,139,62,.035));
  border-radius: 2px; box-shadow: inset 0 0 0 3px rgba(183,139,62,.045);
  padding: 1rem 1.3rem; margin: 1.8rem 0; font-size: .93rem; color: var(--ink-2);
}
.notice strong { color: var(--gold-deep); }
html[data-theme="dark"] .notice strong { color: var(--gold); }
.notice--teal { border-color: rgba(39,71,83,.4); border-left-color: var(--teal); background: rgba(39,71,83,.06); }
.notice--teal strong { color: var(--teal); }
html[data-theme="dark"] .notice--teal strong { color: var(--teal); }

/* ---------- 页脚 ---------- */
.site-footer {
  position: relative;
  background:
    linear-gradient(90deg, rgba(67,22,19,.34), transparent 25%, transparent 75%, rgba(67,22,19,.34)),
    var(--pattern-tongqian),
    #54231F;
  background-size: auto, 96px 96px, auto;
  color: #CFC7B6; margin-top: clamp(3rem, 7vw, 5rem);
  border-top: 1px solid #CDA55C;
}
.site-footer::after {
  content: ""; position: absolute; inset: 1.4rem; border: 1px solid rgba(208,173,103,.16); pointer-events: none;
}
.site-footer::before {
  content: ""; display: block; height: 22px;
  background-image: var(--pattern-huiwen); background-repeat: repeat-x;
  background-size: 48px 28px; background-position: center -6px; opacity: .5;
}
.footer-inner { padding-block: 2.6rem 1.6rem; }
.footer-grid { display: grid; grid-template-columns: 1.2fr 1fr 1.2fr; gap: 2rem; }
.site-footer h2 { color: #E6C77F; font-size: .95rem; letter-spacing: .24em; border-bottom: 1px solid rgba(208,173,103,.34); padding-bottom: .6rem; }
.site-footer p { font-size: .88rem; color: #A9A08E; margin: 0; }
.site-footer a { color: #CDA55C; }
.site-footer a:hover { color: #E0B97A; }
.footer-nav { list-style: none; margin: 0; padding: 0; column-count: 2; }
.footer-nav a { display: inline-block; padding: .18rem 0; font-size: .9rem; }
.footer-bottom { border-top: 1px solid rgba(236,229,212,.14); padding-block: 1.1rem; text-align: center; }
.footer-bottom p { font-size: .82rem; letter-spacing: .06em; }

/* ---------- 阅读进度条 ---------- */
.reading-progress {
  position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 130; pointer-events: none;
  background: transparent;
}

/* ---------- 入场渐显（克制，JS 主动加类，无 JS 时内容始终可见） ---------- */
.will-reveal { opacity: 0; transform: translateY(10px); transition: opacity .45s ease, transform .45s ease; }
.will-reveal.in-view { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .will-reveal { opacity: 1; transform: none; transition: none; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ---------- 响应式 ---------- */
@media (max-width: 1020px) {
  .guide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #deity-grid[data-featured="true"] { grid-template-columns: 1fr; }
  .deity-layout { grid-template-columns: 1fr; }
  .toc { position: static; }
  .toc-box ol { display: flex; flex-wrap: wrap; gap: .2rem 1rem; }
  .toc-box a { border-left: none; padding: .2rem 0; }
}
@media (max-width: 880px) {
  .hero-inner::before, .hero-inner::after { display: none; }
  .nav-toggle { display: inline-flex; }
  .primary-nav {
    position: absolute; top: 100%; left: 0; right: 0;
    background: linear-gradient(rgba(128,31,34,.12), rgba(128,31,34,.03)), #17110D;
    border-bottom: 1px solid rgba(208,173,103,.55); box-shadow: var(--shadow-lg);
    display: none; padding: .6rem clamp(1.1rem, 4.5vw, 2rem) 1rem;
  }
  .primary-nav.is-open { display: block; }
  .primary-nav ul { flex-direction: column; gap: 0; }
  .primary-nav a { padding: .75rem .2rem; border-bottom: 1px solid rgba(208,173,103,.18); font-size: 1.02rem; }
  .primary-nav a.is-active, .primary-nav a[aria-current="page"] { border-bottom-color: rgba(208,173,103,.18); border-left: 3px solid #D0AD67; padding-left: .8rem; }
  html[data-theme="dark"] .primary-nav a.is-active { border-left-color: var(--gold); }
  .header-right { gap: .7rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 1.4rem; }
}
@media (max-width: 640px) {
  .guide-grid { grid-template-columns: 1fr; }
  .strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pager { grid-template-columns: 1fr; }
  .pager-card--next { text-align: left; }
  .hero { min-height: calc(100svh - var(--header-h) - 6px); }
  .hero::after { inset: .65rem; }
  .hero-inner { padding: 2.2rem 1rem; }
  .hero-title { letter-spacing: .12em; padding-inline: .1em; }
  .auspicious-band { margin-top: 1rem; opacity: .56; }
  #deity-grid[data-featured="true"] .deity-card { display: flex; }
  #deity-grid[data-featured="true"] .deity-card-media { aspect-ratio: 8 / 9; min-height: 0; border-right: 0; border-bottom: 3px double var(--line-gold); }
  .section-head h2 { margin-inline: 1.4rem; letter-spacing: .18em; }
  .section-head h2::before, .section-head h2::after { width: .8rem; }
  .scripture-text { font-size: 1.05rem; }
}

/* ==========================================================================
   传统元素增强层
   宣纸颗粒 · 回纹边饰 · 朱砂印章 · 烫金角标 · 竖排题签 · 云纹题头 · 卷轴分隔
   全部尊重 prefers-reduced-motion，深浅双主题均可用
   ========================================================================== */

/* ---------- 宣纸纤维颗粒 ---------- */
body::after {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23g)' opacity='.42'/%3E%3C/svg%3E");
  opacity: .55; mix-blend-mode: multiply;
}
html[data-theme="dark"] body::after { opacity: .3; mix-blend-mode: overlay; }

/* ---------- 页眉回纹压边 / 页脚水纹压边 ---------- */
.site-header::after {
  content: ""; display: block; height: 7px;
  background-image: var(--pattern-huiwen); background-repeat: repeat-x;
  background-size: auto 7px; opacity: .34;
}
/* 页脚顶部压边沿用既有回纹，此处不再重复定义 */

/* ---------- 回纹 / 水纹边饰 ---------- */
.rule-fret {
  display: block; height: 12px; border: 0; margin: 0;
  background-image: var(--pattern-huiwen); background-repeat: repeat-x;
  background-size: auto 12px; opacity: .5;
}
.rule-fret--water { background-image: var(--pattern-shuiwen); background-size: auto 12px; opacity: .55; }
.rule-fret--space { margin-block: clamp(1.8rem, 4vw, 2.8rem); }

/* 卷轴分隔：两端轴头 + 中间画心 */
.scroll-band {
  position: relative; height: 2.1rem; margin-block: clamp(2rem, 5vw, 3.2rem);
  border-top: 1px solid var(--line-gold); border-bottom: 1px solid var(--line-gold);
  background: linear-gradient(var(--paper-2), var(--paper-2)) padding-box;
}
.scroll-band::before, .scroll-band::after {
  content: ""; position: absolute; top: -3px; bottom: -3px; width: .95rem;
  border: 1px solid var(--line-gold); border-radius: 5px;
  background: linear-gradient(180deg, var(--gold), var(--gold-deep));
  box-shadow: 0 2px 6px rgba(55, 35, 17, .28);
}
.scroll-band::before { left: -1.15rem; }
.scroll-band::after { right: -1.15rem; }

/* ---------- 朱砂印章 ---------- */
.seal {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.6rem; padding: .18em .42em;
  font-family: var(--font-serif); font-size: .78rem; font-weight: 700;
  line-height: 1.25; letter-spacing: .06em; text-align: center;
  color: #F6EAD2; background: var(--cinnabar);
  border: 2px solid var(--cinnabar); border-radius: 3px;
  box-shadow: inset 0 0 0 1px rgba(246, 234, 210, .55);
  transform: rotate(-2deg);
}
.seal--lg { min-width: 3.4rem; font-size: 1rem; padding: .3em .5em; }
.seal--square { border-radius: 2px; transform: none; }
.seal--ghost {
  color: var(--cinnabar); background: transparent;
  box-shadow: inset 0 0 0 1px rgba(131, 44, 42, .45);
}
html[data-theme="dark"] .seal { color: #1B1109; background: var(--cinnabar-soft); border-color: var(--cinnabar-soft); }
html[data-theme="dark"] .seal--ghost { color: var(--cinnabar-soft); background: transparent; box-shadow: inset 0 0 0 1px rgba(209, 106, 93, .5); }

/* 印章落款 */
.colophon {
  display: flex; align-items: center; gap: .7rem; justify-content: flex-end;
  margin-top: 1.4rem; font-size: .82rem; letter-spacing: .12em; color: var(--ink-3);
}
.colophon .seal { transform: rotate(-3deg); }

/* ---------- 烫金角标 ---------- */
.corner-marks { position: relative; }
.corner-marks::before, .corner-marks::after {
  content: ""; position: absolute; width: .85rem; height: .85rem; pointer-events: none;
  border: 1px solid var(--gold); opacity: .5; transition: opacity .3s ease;
}
.corner-marks::before { top: .35rem; left: .35rem; border-width: 1px 0 0 1px; }
.corner-marks::after { bottom: .35rem; right: .35rem; border-width: 0 1px 1px 0; }
.corner-marks:hover::before, .corner-marks:hover::after { opacity: 1; }

/* 卡片双层描边（画心 + 内框），与既有 .card::before 协同 */
.card.corner-marks::before { inset: .34rem; }

/* ---------- 竖排题签 ---------- */
.v-label {
  writing-mode: vertical-rl; text-orientation: upright;
  font-family: var(--font-serif); font-size: .8rem; letter-spacing: .28em;
  color: var(--gold-deep); align-self: stretch;
  border-left: 1px solid var(--line-gold); padding-left: .5rem;
  flex-shrink: 0;
}
html[data-theme="dark"] .v-label { color: var(--gold); }
.v-label--seal {
  color: #F6EAD2; background: var(--cinnabar); border-left: 0;
  padding: .7rem .35rem; border-radius: 2px; font-weight: 700;
}
html[data-theme="dark"] .v-label--seal { color: #1B1109; background: var(--cinnabar-soft); }

/* ---------- 云纹题头 ---------- */
.section-head { position: relative; }
.section-head::before {
  content: ""; position: absolute; inset: -1.2rem -2rem auto; height: 5.4rem; z-index: -1;
  background: var(--pattern-yunwen) center top / auto 5.4rem no-repeat;
  opacity: .3; pointer-events: none;
  -webkit-mask-image: radial-gradient(ellipse at center, #000 32%, transparent 76%);
  mask-image: radial-gradient(ellipse at center, #000 32%, transparent 76%);
}

/* ---------- 金色细线 + 菱形点缀 ---------- */
.gold-rule {
  display: flex; align-items: center; justify-content: center; gap: .6rem;
  margin-block: clamp(1.4rem, 3vw, 2.2rem); color: var(--gold);
}
.gold-rule::before, .gold-rule::after {
  content: ""; height: 1px; flex: 1; max-width: 9rem;
  background: linear-gradient(90deg, transparent, var(--line-gold), transparent);
}
.gold-rule > i {
  width: .5rem; height: .5rem; background: var(--gold); transform: rotate(45deg); flex: none;
}

/* ---------- 铜钱 / 元宝装饰串 ---------- */
.coin-row { display: flex; align-items: center; justify-content: center; gap: .55rem; color: var(--gold); }
.coin-row svg { width: 1.5rem; height: 1.5rem; opacity: .85; }

/* ---------- 朱砂印章按钮 ---------- */
.btn--seal {
  background: var(--cinnabar); border-color: var(--cinnabar); color: #F6EAD2;
  letter-spacing: .18em; box-shadow: 0 4px 14px rgba(131, 44, 42, .28);
}
.btn--seal:hover {
  background: var(--cinnabar-soft); border-color: var(--cinnabar-soft); color: #FFF6E2;
  transform: translateY(-2px);
}
.btn--gold {
  background: linear-gradient(180deg, var(--gold), var(--gold-deep));
  border-color: var(--gold-deep); color: #2A1B08; letter-spacing: .14em;
}
.btn--gold:hover { background: var(--gold-deep); color: #FFF6E2; border-color: var(--gold-deep); }
html[data-theme="dark"] .btn--seal { color: #1B1109; }
html[data-theme="dark"] .btn--gold { color: #20150A; }

/* ---------- 飘落金箔（首页 / 策问页） ---------- */
.gold-motes { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.gold-motes span {
  position: absolute; top: -8%; width: .42rem; height: .42rem; border-radius: 50%;
  background: linear-gradient(135deg, var(--gold), var(--gold-deep));
  opacity: 0; animation: mote-fall linear infinite;
}
@keyframes mote-fall {
  0%   { transform: translate3d(0, -10vh, 0) rotate(0deg); opacity: 0; }
  12%  { opacity: .85; }
  88%  { opacity: .5; }
  100% { transform: translate3d(var(--dx, 2rem), 108vh, 0) rotate(420deg); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .gold-motes { display: none; }
}

/* ---------- 竖排引文（经文/签诗） ---------- */
.v-quote {
  writing-mode: vertical-rl; text-orientation: upright;
  font-family: var(--font-kai); line-height: 2.1; letter-spacing: .22em;
  max-height: 22rem; overflow-x: auto; margin-inline: auto;
  padding: 1.2rem .8rem; border: 1px solid var(--line-gold);
  background: linear-gradient(rgba(183, 139, 62, .05), rgba(183, 139, 62, .05)), var(--paper-2);
}

/* ---------- 锦囊 / 签筒卡片通用面 ---------- */
.ritual-surface {
  position: relative;
  background:
    linear-gradient(180deg, rgba(131, 44, 42, .05), rgba(183, 139, 62, .07)),
    var(--paper-2);
  border: 1px solid var(--line-gold);
  box-shadow: var(--shadow);
}
.ritual-surface::before {
  content: ""; position: absolute; inset: .5rem; pointer-events: none;
  border: 1px solid rgba(183, 139, 62, .32);
  box-shadow: inset 0 0 0 3px rgba(128, 31, 34, .05);
}
.ritual-surface > * { position: relative; z-index: 1; }

/* ==========================================================================
   财运策问 · 组件样式
   ========================================================================== */

/* ---------- 方式页签 ---------- */
.ritual-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.6rem; }
.ritual-tab {
  display: flex; align-items: center; gap: .85rem; text-align: left;
  padding: .95rem 1.1rem; cursor: pointer;
  font-family: var(--font-serif); color: var(--ink-2);
  background: var(--paper); border: 1px solid var(--line-strong);
  border-radius: var(--radius); transition: all .22s ease;
}
.ritual-tab:hover { border-color: var(--gold); color: var(--ink); }
.ritual-tab.is-active {
  border-color: var(--cinnabar); color: var(--ink);
  background: linear-gradient(rgba(131, 44, 42, .07), rgba(183, 139, 62, .08)), var(--paper);
  box-shadow: var(--shadow);
}
.ritual-tab-icon { width: 2.3rem; height: 2.3rem; flex: none; color: var(--gold-deep); }
.ritual-tab.is-active .ritual-tab-icon { color: var(--cinnabar); }
.ritual-tab-icon svg { width: 100%; height: 100%; }
.ritual-tab-text { display: flex; flex-direction: column; line-height: 1.45; }
.ritual-tab-text strong { font-size: 1.06rem; letter-spacing: .1em; }
.ritual-tab-text small { font-size: .78rem; color: var(--ink-3); letter-spacing: .04em; }
html[data-theme="dark"] .ritual-tab-icon { color: var(--gold); }
html[data-theme="dark"] .ritual-tab.is-active .ritual-tab-icon { color: var(--cinnabar-soft); }

/* ---------- 步骤 ---------- */
.ritual-step { margin-bottom: 1.2rem; }
.ritual-step h3 {
  display: flex; align-items: center; gap: .6rem;
  font-size: 1.1rem; letter-spacing: .12em; color: var(--ink); margin-bottom: .3rem;
}
.ritual-step .seal { flex: none; min-width: 2rem; font-size: .74rem; }
.ritual-hint { margin: 0 0 1rem; font-size: .9rem; color: var(--ink-3); }

/* 主题选择 */
.topic-chips { display: flex; flex-wrap: wrap; gap: .55rem; margin-bottom: 1.1rem; }
.topic-chip {
  display: flex; flex-direction: column; align-items: flex-start; gap: .1rem;
  padding: .5rem .85rem; cursor: pointer; text-align: left;
  background: var(--paper); border: 1px solid var(--line-strong);
  border-radius: var(--radius); color: var(--ink-2);
  font-family: var(--font-serif); transition: all .2s ease;
}
.topic-chip strong { font-size: .98rem; letter-spacing: .1em; }
.topic-chip small { font-size: .74rem; color: var(--ink-3); }
.topic-chip:hover { border-color: var(--gold); }
.topic-chip.is-active {
  border-color: var(--cinnabar); color: var(--cinnabar);
  background: rgba(131, 44, 42, .07); box-shadow: inset 0 0 0 1px rgba(131, 44, 42, .18);
}
html[data-theme="dark"] .topic-chip.is-active { color: var(--cinnabar-soft); }

/* 输入 */
.ritual-field { display: block; }
.ritual-field-label { display: block; font-size: .82rem; letter-spacing: .08em; color: var(--ink-3); margin-bottom: .4rem; }
.ritual-field input {
  width: 100%; padding: .7rem .9rem; font-family: var(--font-serif); font-size: .98rem;
  color: var(--ink); background: var(--paper);
  border: 1px solid var(--line-strong); border-radius: var(--radius);
}
.ritual-field input:focus-visible { border-color: var(--teal); }
html[data-theme="dark"] .ritual-field input { background: var(--paper-2); }

/* ---------- 铜钱台 ---------- */
.coin-stage { text-align: center; padding-block: .6rem 1rem; }
.coin-tray { display: flex; justify-content: center; gap: 1.1rem; perspective: 700px; }
.coin {
  position: relative; width: 3.6rem; height: 3.6rem; display: grid; place-items: center;
  color: var(--gold-deep); transform-style: preserve-3d;
}
.coin svg { width: 100%; height: 100%; }
.coin.is-yang {
  background: radial-gradient(circle at 35% 30%, var(--gold), var(--gold-deep));
  border-radius: 50%; color: #3A2609;
  box-shadow: 0 3px 9px rgba(90, 60, 15, .32), inset 0 0 0 1px rgba(255, 245, 220, .35);
}
.coin.is-yin {
  background: var(--paper); border-radius: 50%; color: var(--gold-deep);
  box-shadow: inset 0 0 0 2px var(--gold-deep), 0 2px 6px rgba(55, 35, 17, .18);
}
.coin.is-flipping { animation: coin-flip .28s ease-out; }
@keyframes coin-flip { 0% { transform: rotateY(0) scale(1); } 50% { transform: rotateY(90deg) scale(1.08); } 100% { transform: rotateY(180deg) scale(1); } }
.coin-readout {
  margin: 1rem 0 0; font-size: .92rem; letter-spacing: .14em; color: var(--cinnabar);
  min-height: 1.6em;
}
html[data-theme="dark"] .coin-readout { color: var(--cinnabar-soft); }

/* 六爻槽位 */
.yao-stack { display: grid; gap: .35rem; max-width: 15rem; margin: 0 auto 1.4rem; }
.yao-slot {
  display: flex; align-items: center; gap: .7rem; padding: .32rem .7rem;
  border: 1px dashed var(--line-strong); border-radius: 2px; font-size: .84rem; color: var(--ink-3);
}
.yao-slot.is-filled { border-style: solid; border-color: var(--line-gold); color: var(--ink-2); background: rgba(183, 139, 62, .07); }
.yao-slot-no { flex: none; width: 1.2rem; text-align: center; color: var(--gold-deep); font-weight: 700; }
html[data-theme="dark"] .yao-slot-no { color: var(--gold); }
.yao-slot-text { letter-spacing: .08em; }

.ritual-actions { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; }

/* ---------- 签筒 ---------- */
.lot-stage { display: grid; place-items: center; padding-block: 1.4rem 1.8rem; }
.lot-tube {
  position: relative; width: 7rem; height: 9.5rem;
  display: flex; align-items: flex-end; justify-content: center;
}
.lot-tube-body {
  position: absolute; inset: auto 1.1rem 0; height: 7.4rem;
  background: linear-gradient(180deg, rgba(131, 44, 42, .1), rgba(131, 44, 42, .22)), var(--paper-2);
  border: 1px solid var(--line-gold); border-radius: 0 0 .6rem .6rem;
  box-shadow: var(--shadow);
}
.lot-tube-body::after {
  content: ""; position: absolute; inset: .35rem .3rem 0; border-top: 1px solid rgba(183, 139, 62, .4);
}
.lot-stick {
  position: absolute; bottom: 1.2rem; width: .38rem; height: 4.6rem;
  background: linear-gradient(180deg, var(--gold), var(--gold-deep));
  border-radius: 2px; box-shadow: 0 1px 3px rgba(55, 35, 17, .3);
  transform-origin: bottom center;
}
.lot-stick.s1 { transform: rotate(-16deg); height: 5.1rem; }
.lot-stick.s2 { transform: rotate(-8deg);  height: 4.4rem; }
.lot-stick.s3 { transform: rotate(0deg);   height: 5.4rem; }
.lot-stick.s4 { transform: rotate(8deg);   height: 4.2rem; }
.lot-stick.s5 { transform: rotate(15deg);  height: 4.9rem; }
.lot-tube.is-shaking { animation: tube-shake .9s ease-in-out; }
.lot-tube.is-shaking .lot-stick { animation: stick-jump .9s ease-in-out; }
@keyframes tube-shake {
  0%, 100% { transform: translateX(0) rotate(0); }
  20% { transform: translateX(-4px) rotate(-2deg); }
  45% { transform: translateX(5px) rotate(2deg); }
  70% { transform: translateX(-3px) rotate(-1deg); }
}
@keyframes stick-jump {
  0%, 100% { transform: translateY(0) rotate(0); }
  30% { transform: translateY(-.55rem) rotate(4deg); }
  60% { transform: translateY(-.25rem) rotate(-3deg); }
}
@media (prefers-reduced-motion: reduce) {
  .lot-tube.is-shaking, .lot-tube.is-shaking .lot-stick { animation: none; }
}

/* ---------- 结果区 ---------- */
.divination-result { margin-top: 2rem; }
.divination-result[hidden] { display: none; }
.result-head {
  display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem;
  padding-bottom: 1rem; border-bottom: 3px double var(--line-gold);
}
.result-head .seal { flex: none; }
.result-kicker { margin: 0 0 .15rem; font-size: .82rem; letter-spacing: .1em; color: var(--ink-3); }
.result-head h3 { margin: 0; font-size: 1.5rem; letter-spacing: .1em; color: var(--cinnabar); }
.result-gua-meta { font-size: .82rem; font-weight: 400; letter-spacing: .08em; color: var(--ink-3); }

/* 卦画 */
.gua-pair { display: flex; flex-wrap: wrap; gap: clamp(1.4rem, 4vw, 3rem); justify-content: center; margin-bottom: 1.8rem; }
.gua-figure { text-align: center; }
.gua-figure-label { display: block; font-size: .82rem; letter-spacing: .18em; color: var(--gold-deep); margin-bottom: .7rem; }
html[data-theme="dark"] .gua-figure-label { color: var(--gold); }
.gua-lines { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; width: 9rem; }
.yao { position: relative; display: flex; gap: .55rem; height: .95rem; align-items: center; }
.yao-bar { flex: 1; height: 100%; background: var(--ink); border-radius: 1px; }
.yao--yin .yao-bar { background: var(--ink); }
.yao.is-moving .yao-bar { background: var(--gold-deep); box-shadow: 0 0 0 1px rgba(183, 139, 62, .45); }
.yao-mark { position: absolute; right: -1.7rem; font-size: .85rem; color: var(--cinnabar); font-weight: 700; }
html[data-theme="dark"] .yao-mark { color: var(--cinnabar-soft); }

/* 结果正文 */
.result-body { display: grid; gap: 1rem; }
.result-block { padding: 1rem 1.15rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }
.result-block h4 { margin: 0 0 .5rem; font-size: .95rem; letter-spacing: .12em; color: var(--ink); display: flex; align-items: center; gap: .5rem; }
.result-block p { margin: 0; text-align: justify; }
.result-block--classic { background: linear-gradient(rgba(183, 139, 62, .06), rgba(183, 139, 62, .06)), var(--paper-2); border-color: var(--line-gold); }
.result-classic { font-family: var(--font-kai); font-size: 1.08rem; line-height: 2; letter-spacing: .06em; color: var(--ink); }
.result-block--advice { border-color: var(--line-gold); background: linear-gradient(rgba(131, 44, 42, .05), rgba(183, 139, 62, .06)), var(--paper); }
.result-source { margin: .7rem 0 0; font-size: .78rem; letter-spacing: .06em; color: var(--ink-3); }
.tag--modern { color: var(--teal); border-color: rgba(39, 71, 83, .5); }
html[data-theme="dark"] .tag--modern { color: #8FB6C3; border-color: rgba(143, 182, 195, .5); }

/* 动爻指引 */
.yao-hint-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.yao-hint { display: flex; align-items: flex-start; gap: .7rem; font-size: .92rem; }
.yao-hint .seal { flex: none; min-width: 2rem; }

/* 签文卡 */
.lot-card {
  padding: 1.6rem 1.2rem; margin-bottom: 1.6rem; text-align: center;
  border: 1px solid var(--line-gold); border-radius: var(--radius);
  background: linear-gradient(rgba(131, 44, 42, .06), rgba(183, 139, 62, .1)), var(--paper-2);
  box-shadow: var(--shadow);
}
.lot-poem {
  margin: 0; font-family: var(--font-kai); font-size: clamp(1.05rem, 2.6vw, 1.28rem);
  line-height: 2.3; letter-spacing: .16em; color: var(--ink);
}
.lot-card.rank--上上 { border-color: var(--cinnabar); box-shadow: 0 0 0 1px rgba(131, 44, 42, .18), var(--shadow); }
.lot-card.rank--下下 { border-color: var(--ink-3); background: linear-gradient(rgba(60, 60, 60, .06), rgba(60, 60, 60, .04)), var(--paper-2); }

.lot-yiji { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.lot-yi, .lot-ji { padding: .9rem 1.1rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }
.lot-yi { border-left: 3px solid var(--teal); }
.lot-ji { border-left: 3px solid var(--cinnabar); }
.lot-yi h4, .lot-ji h4 { margin: 0 0 .4rem; display: flex; align-items: center; gap: .5rem; font-size: .9rem; letter-spacing: .14em; }
.lot-yi p, .lot-ji p { margin: 0; font-size: .92rem; color: var(--ink-2); }

.result-actions { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; margin-top: 1.5rem; }

/* ---------- 历史记录 ---------- */
.ritual-history { margin-top: clamp(2rem, 5vw, 3rem); }
.history-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.history-item {
  display: flex; align-items: center; gap: .8rem; padding: .55rem .85rem;
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper);
  font-size: .9rem;
}
.history-badge {
  flex: none; padding: .1em .5em; font-size: .74rem; letter-spacing: .1em;
  color: #F6EAD2; background: var(--gold-deep); border-radius: 2px;
}
html[data-theme="dark"] .history-badge { color: #20150A; }
.history-main { display: flex; flex-direction: column; line-height: 1.5; min-width: 0; flex: 1; }
.history-main strong { font-weight: 600; color: var(--ink); }
.history-sub { font-size: .8rem; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.history-time { flex: none; font-size: .78rem; color: var(--ink-3); letter-spacing: .04em; }

@media (max-width: 640px) {
  .ritual-tabs { grid-template-columns: 1fr; }
  .lot-yiji { grid-template-columns: 1fr; }
  .coin { width: 2.9rem; height: 2.9rem; }
  .gua-lines { width: 7.5rem; }
  .history-item { flex-wrap: wrap; }
  .history-time { width: 100%; padding-left: 2.4rem; }
}

/* ==========================================================================
   现代增强层 v2
   财神符号系统 · 烫金质感 · 现代排版节奏 · 克制微交互
   在既有「宣纸 / 朱砂 / 描金」骨架之上做现代增强，不推翻原有体例
   ========================================================================== */

/* ---------- 设计令牌 ---------- */
:root {
  /* 朱砂（更饱和的中国红，用于强调与转化按钮） */
  --cinnabar-vivid: #C8161D;
  --cinnabar-700: #8E1418;
  --cinnabar-100: #FBE9E5;
  /* 描金（烫金渐变与流光） */
  --gold-100: #FBF1D5;
  --gold-300: #E8CE8C;
  --gold-500: #C9A24A;
  --gold-700: #8E6A1F;
  --gold-gradient: linear-gradient(135deg, #F6E3AC 0%, #D9B667 34%, #A67C00 68%, #EDD28C 100%);
  --gold-foil: linear-gradient(115deg, transparent 16%, rgba(255, 247, 222, .6) 46%, transparent 74%);
  /* 墨色层次 */
  --ink-hi: #0F0B08;
  --ink-mid: #4A372F;
  --ink-low: #8A7365;
  /* 现代节奏 */
  --sp-1: .35rem; --sp-2: .6rem; --sp-3: .9rem; --sp-4: 1.35rem;
  --sp-5: 2rem;   --sp-6: 3rem;  --sp-7: 4.5rem;
  --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-xl: 26px;
  --sh-1: 0 2px 8px rgba(58, 36, 14, .08);
  --sh-2: 0 10px 30px rgba(58, 36, 14, .13);
  --sh-3: 0 24px 60px rgba(42, 25, 12, .22);
  --sh-gold: 0 12px 34px rgba(166, 124, 0, .26);
  --ease-out: cubic-bezier(.22, .61, .36, 1);
  --ease-spring: cubic-bezier(.34, 1.36, .64, 1);
  --container-wide: 78rem;
}
html[data-theme="dark"] {
  --cinnabar-vivid: #E2655A;
  --cinnabar-100: #33140F;
  --gold-100: #F7EAC4; --gold-300: #E7C67F; --gold-500: #C9A24A; --gold-700: #F0D28D;
  --gold-gradient: linear-gradient(135deg, #FBEEC6 0%, #E3C179 33%, #C9A24A 66%, #F7E7BC 100%);
  --ink-hi: #FFF6E2; --ink-mid: #D9C7A7; --ink-low: #A99672;
  --sh-1: 0 2px 10px rgba(0, 0, 0, .5);
  --sh-2: 0 12px 32px rgba(0, 0, 0, .55);
  --sh-3: 0 26px 64px rgba(0, 0, 0, .66);
  --sh-gold: 0 12px 36px rgba(224, 190, 116, .2);
}

/* ---------- 财神符号系统 ---------- */
.sprite-host { position: absolute !important; width: 0; height: 0; overflow: hidden; }
.cs-ico {
  width: 1em; height: 1em; display: inline-block; vertical-align: -.14em;
  fill: none; stroke: currentColor; stroke-width: 1.7;
  stroke-linecap: round; stroke-linejoin: round;
}
.cs-ico--solid { fill: currentColor; stroke: none; }

/* ---------- 符号徽章 ---------- */
.icon-badge {
  display: inline-grid; place-items: center; flex: none;
  width: 3rem; height: 3rem; border-radius: 50%;
  color: var(--gold-700);
  background: radial-gradient(circle at 32% 26%, var(--gold-100), rgba(201, 162, 74, .14));
  box-shadow: inset 0 0 0 1px rgba(201, 162, 74, .5), 0 4px 14px rgba(166, 124, 0, .16);
  transition: transform .3s var(--ease-spring), box-shadow .3s var(--ease-out);
}
.icon-badge .cs-ico { width: 1.5rem; height: 1.5rem; }
html[data-theme="dark"] .icon-badge {
  color: var(--gold-300);
  background: radial-gradient(circle at 32% 26%, rgba(240, 210, 141, .2), rgba(201, 162, 74, .06));
  box-shadow: inset 0 0 0 1px rgba(224, 190, 116, .4), 0 4px 14px rgba(0, 0, 0, .4);
}

/* ---------- 烫金文字 ---------- */
.foil-text {
  background: var(--gold-gradient); background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text;
  color: transparent; -webkit-text-fill-color: transparent;
}
.foil-shine { animation: foil-pan 11s linear infinite; }
@keyframes foil-pan { from { background-position: 0% 50%; } to { background-position: 220% 50%; } }
@media (prefers-reduced-motion: reduce) { .foil-shine { animation: none; } }

/* ---------- 光泽扫过（子元素实现，避免与既有 ::after 装饰冲突） ---------- */
.sheen-layer {
  position: absolute; inset: 0; z-index: 3; pointer-events: none; border-radius: inherit;
  background: var(--gold-foil); transform: translateX(-135%);
  transition: transform .85s var(--ease-out);
}
.card:hover > .sheen-layer,
.deity-card:hover > .sheen-layer,
.gallery-item:hover > .sheen-layer,
.guide-card:hover > .sheen-layer,
.product-card:hover > .sheen-layer,
.btn:hover > .sheen-layer,
a:focus-visible > .sheen-layer, button:focus-visible > .sheen-layer { transform: translateX(135%); }
@media (prefers-reduced-motion: reduce) { .sheen-layer { display: none; } }

/* ---------- 现代圆角与阴影（统一既有组件的边角语言） ---------- */
.card, .deity-card, .gallery-item, .toc-box, .scripture-box,
.table-wrap, .pager-card, .search-results, .rule-fret { border-radius: var(--r-md); }
.filter-btn, .copy-btn, .tag, .seal, .note-check, .history-badge { border-radius: var(--r-sm); }
.card::before, .deity-card-media::after, .gallery-item-btn::after, .ritual-surface::before { border-radius: calc(var(--r-md) - 3px); }
.btn { border-radius: 999px; padding: .62em 1.7em; font-weight: 600; }
.btn:hover { transform: translateY(-2px); box-shadow: var(--sh-2); }
.btn { transition: transform .22s var(--ease-out), box-shadow .22s var(--ease-out), background .18s, border-color .18s, color .18s; }
@media (prefers-reduced-motion: reduce) { .btn:hover { transform: none; } }

/* ---------- 首页英雄区（现代构图） ---------- */
.hero--modern { isolation: isolate; }
.hero--modern .hero-inner { max-width: 54rem; }
.hero--modern .hero-inner::before,
.hero--modern .hero-inner::after { display: none; }

.hero-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.hero-orb {
  position: absolute; left: 50%; top: 44%; width: 46rem; height: 46rem;
  margin: -23rem 0 0 -23rem; border-radius: 50%;
  background: radial-gradient(circle, rgba(224, 178, 96, .22), rgba(200, 22, 29, .1) 46%, transparent 68%);
  filter: blur(6px);
}
.hero-ring {
  position: absolute; left: 50%; top: 46%; width: 0; height: 0;
  animation: ring-spin 140s linear infinite;
}
.hero-ring i {
  position: absolute; left: 0; top: 0; width: 2.9rem; height: 2.9rem; margin: -1.45rem;
  color: rgba(224, 190, 116, .55);
  transform: rotate(var(--a)) translateY(-17.5rem);
}
.hero-ring i:nth-child(even) { color: rgba(200, 22, 29, .3); }
.hero-ring .cs-ico { width: 100%; height: 100%; }
@keyframes ring-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.hero-clouds {
  position: absolute; inset: auto 0 -2rem; height: 14rem;
  background: var(--pattern-yunwen) repeat-x center bottom / auto 11rem;
  opacity: .3;
  -webkit-mask-image: linear-gradient(transparent, #000 72%);
  mask-image: linear-gradient(transparent, #000 72%);
}
@media (prefers-reduced-motion: reduce) { .hero-ring { animation: none; } }

.hero-badge {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .32rem 1rem .32rem .35rem; margin-bottom: 1.4rem;
  font-size: .82rem; letter-spacing: .18em; color: #EFD9A4;
  border: 1px solid rgba(224, 190, 116, .5); border-radius: 999px;
  background: rgba(84, 35, 31, .5);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.hero-badge .cs-ico { width: 1.15rem; height: 1.15rem; color: var(--gold-300); }

.hero-cta { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: center; margin-top: 1.9rem; }
.btn--gold { border-radius: 999px; }
.btn--ghost-light {
  background: rgba(243, 233, 213, .06); color: #EFD9A4;
  border-color: rgba(224, 190, 116, .55);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.btn--ghost-light:hover {
  color: #1A120A; background: var(--gold-300); border-color: var(--gold-300);
}
html[data-theme="dark"] .btn--ghost-light:hover { color: #1A120A; }

@media (max-width: 900px) {
  .hero-ring, .hero-orb { display: none; }
}

/* ---------- 导览卡片现代化 ---------- */
.guide-grid { gap: 1.35rem; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.guide-card {
  display: flex; flex-direction: column; gap: .1rem;
  padding: 1.6rem 1.5rem 1.5rem; border-radius: var(--r-lg);
  box-shadow: var(--sh-1);
}
.guide-card:hover { transform: translateY(-6px); box-shadow: var(--sh-3); }
.guide-card .icon-badge { margin-bottom: 1.05rem; }
.guide-card:hover .icon-badge { transform: translateY(-2px) scale(1.06); box-shadow: inset 0 0 0 1px rgba(201, 162, 74, .8), var(--sh-gold); }
.guide-card h3 { display: flex; align-items: center; gap: .45rem; margin-bottom: .35rem; }
.guide-card h3 span { transition: transform .25s var(--ease-out); }
.guide-card:hover h3 span { transform: translateX(4px); }

/* ---------- 财神卡片现代化 ---------- */
.deity-card { border-radius: var(--r-lg); }
.deity-card:hover { transform: translateY(-7px); box-shadow: var(--sh-3); }
.deity-card-media { position: relative; }
.deity-card-media::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(131, 44, 42, .16), transparent 42%, rgba(31, 16, 8, .28));
  transition: opacity .3s var(--ease-out);
}
.deity-card:hover .deity-card-media::before { opacity: .55; }
.deity-card-media img { transition: transform .6s var(--ease-out); }
.deity-card:hover .deity-card-media img { transform: scale(1.045); }
.deity-card-name { font-size: 1.32rem; }
#deity-grid[data-featured="true"] .deity-card { border-radius: var(--r-lg); }
#deity-grid[data-featured="true"] .deity-card-media { border-right-width: 3px; }

/* ---------- 图鉴卡片现代化 ---------- */
.gallery-item { border-radius: var(--r-lg); }
.gallery-item-btn img { transition: transform .6s var(--ease-out); }
.gallery-item:hover .gallery-item-btn img { transform: scale(1.05); }

/* ---------- 符号带（装饰分隔） ---------- */
.symbol-strip {
  display: flex; align-items: center; justify-content: center; gap: clamp(1rem, 4vw, 2.6rem);
  color: var(--gold-500); opacity: .5; margin-block: clamp(1.6rem, 4vw, 2.6rem);
}
.symbol-strip::before, .symbol-strip::after {
  content: ""; height: 1px; flex: 1; max-width: 8rem;
  background: linear-gradient(90deg, transparent, currentColor, transparent);
}
.symbol-strip .cs-ico { width: 1.5rem; height: 1.5rem; }
.symbol-strip .cs-ico:nth-child(even) { opacity: .55; }

/* ---------- 现代数据块 ---------- */
.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 1rem; }
.stat {
  text-align: center; padding: 1.1rem .8rem;
  border: 1px solid var(--line-gold); border-radius: var(--r-md);
  background: linear-gradient(180deg, rgba(183, 139, 62, .07), transparent), var(--paper-2);
}
.stat-num { display: block; font-size: 1.75rem; font-weight: 700; color: var(--cinnabar); letter-spacing: .04em; }
.stat-label { display: block; font-size: .8rem; letter-spacing: .16em; color: var(--ink-3); margin-top: .15rem; }

/* ---------- 通用：容器加宽 ---------- */
.container--wide { max-width: var(--container-wide); }

/* ---------- 焦点态现代化 ---------- */
:focus-visible { outline: 2px solid var(--gold-500); outline-offset: 3px; }

/* ==========================================================================
   财运策问 · 增强组件（今日财运 / 值坛财神 / 分享卡片）
   ========================================================================== */

/* ---------- 今日财运 ---------- */
.daily-card { padding: clamp(1.3rem, 3.5vw, 2rem); border-radius: var(--r-lg); }
.daily-head {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
  padding-bottom: 1rem; margin-bottom: 1.1rem; border-bottom: 3px double var(--line-gold);
}
.daily-head .seal { flex: none; }
.daily-head-text { min-width: 0; }
.daily-date { display: block; font-size: .78rem; letter-spacing: .2em; color: var(--ink-3); margin-bottom: .1rem; }
.daily-head h3 { margin: 0; font-size: 1.25rem; letter-spacing: .1em; color: var(--ink); }
.daily-aura {
  margin-left: auto; display: inline-flex; align-items: baseline; gap: .5rem;
  padding: .35rem .9rem; border: 1px solid var(--line-gold); border-radius: 999px;
  background: linear-gradient(rgba(183, 139, 62, .1), rgba(183, 139, 62, .04));
}
.daily-aura strong { font-size: 1.35rem; color: var(--cinnabar); letter-spacing: .1em; }
.daily-aura span { font-size: .82rem; color: var(--ink-3); }

.daily-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 1rem; }
.daily-cell {
  padding: .9rem 1.05rem; border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--paper);
}
.daily-cell h4 { margin: 0 0 .45rem; display: flex; align-items: center; gap: .45rem; font-size: .84rem; letter-spacing: .18em; color: var(--ink-3); }
.daily-cell ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .28rem; }
.daily-cell li { font-size: .92rem; color: var(--ink-2); }
.daily-cell li::before { content: "·"; color: var(--gold-500); margin-right: .45em; font-weight: 700; }
.daily-cell--yi { border-left: 3px solid var(--teal); }
.daily-cell--ji { border-left: 3px solid var(--cinnabar); }
.daily-cell--keeper { border-left: 3px solid var(--gold-500); }
.daily-keeper-name { font-size: 1.02rem; font-weight: 700; color: var(--cinnabar); letter-spacing: .06em; }
.daily-keeper-trait { font-size: .78rem; color: var(--gold-700); letter-spacing: .14em; }
html[data-theme="dark"] .daily-keeper-trait { color: var(--gold-300); }
.daily-quote {
  margin: .55rem 0 0; font-family: var(--font-kai); font-size: .95rem; line-height: 1.9;
  color: var(--ink); letter-spacing: .04em;
}
.daily-source { display: block; margin-top: .35rem; font-size: .74rem; color: var(--ink-3); letter-spacing: .08em; }
.daily-foot { margin: 1rem 0 0; font-size: .8rem; color: var(--ink-3); letter-spacing: .06em; }

/* ---------- 值坛财神选择 ---------- */
.keeper-chips { margin-top: .5rem; }
.keeper-chip small { letter-spacing: .04em; }
.keeper-chip.is-active small { color: inherit; opacity: .75; }
.keeper-tag {
  display: inline-block; margin-left: .4rem; padding: 0 .4em; font-size: .72rem;
  border: 1px solid currentColor; border-radius: 2px; opacity: .7;
}

/* ---------- 分享卡片（Canvas 生成） ---------- */
.share-canvas { display: none; }
.share-hint { font-size: .78rem; color: var(--ink-3); letter-spacing: .06em; text-align: center; margin: .6rem 0 0; }

@media (max-width: 640px) {
  .daily-aura { margin-left: 0; width: 100%; justify-content: center; }
}

/* ---------- 打印 ---------- */
@media print {
  .site-header, .site-footer, .reading-progress, .header-controls, .toc, .lb-btn,
  .copy-btn, .search-wrap, .hero-bg, .gold-motes, .sheen-layer, .symbol-strip { display: none !important; }
  body { background: #fff; color: #000; }
  .article { max-width: none; }
}
