/* ============================================================
   仙坛命理 · 共享样式体系
   设计令牌与组件完全继承 guiyin-xiantan（梅山观音香坛落地页）：
   宣纸米白底 / 深檀墨 / 香灰金 / 朱砂红；思源宋体 + 马善政楷体；
   全篇无蓝/紫色调。新增部分仅为排盘工具页的盘面组件。
   ============================================================ */
:root{
  --paper:#f7f1e3;        /* 宣纸米白 */
  --surface:#fbf6ea;      /* 卡片浅面 */
  --ink:#2b2118;          /* 深檀墨色 */
  --ink-soft:#5c4a37;     /* 次级文字 */
  --sand:#d9c8a9;         /* 分割线/浅纹 */
  --gold:#a8802f;         /* 香灰金 */
  --gold-bright:#d4a94e;  /* 亮金 */
  --cinnabar:#9e2b25;     /* 朱砂红 */
  --cinnabar-deep:#7a1f1a;
  --wood:#3a2a1c;         /* 深檀木 */
  --wood-deep:#241a10;
  --shadow:0 10px 30px rgba(43,33,24,.12);
  --radius:14px;
  --serif:"Noto Serif SC","Songti SC","STZhongsong","SimSun",serif;
  --brush:"Ma Shan Zheng","Kaiti SC",KaiTi,STKaiti,cursive;
  --maxw:1120px;
  /* 五行色（传统五色，属红黄棕绿黑谱系，不引入蓝紫） */
  --wx-mu:#3e6a3a;   /* 木·青绿 */
  --wx-huo:#a33520; /* 火·朱红 */
  --wx-tu:#8a6a26;  /* 土·黄棕 */
  --wx-jin:#8f8574; /* 金·缟白灰金 */
  --wx-shui:#2f3743;/* 水·玄色（近黑蓝，作墨色用） */
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--serif);
  background:var(--paper);
  color:var(--ink);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
section{position:relative}

/* 滚动进场 */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s ease}
.reveal.on{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}

/* ============ 顶部导航 ============ */
.topbar{
  position:fixed;top:0;left:0;right:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 24px;
  transition:background .4s ease,box-shadow .4s ease;
}
.topbar.solid{background:rgba(247,241,227,.94);backdrop-filter:blur(8px);box-shadow:0 1px 0 var(--sand)}
.topbar .brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:2px;color:#fff;transition:color .4s}
.topbar.solid .brand{color:var(--ink)}
.topbar .brand svg{width:26px;height:26px;flex:none}
.topbar nav{display:none;gap:22px;font-size:15px;color:var(--paper)}
.topbar.solid nav{color:var(--ink-soft)}
.topbar nav a:hover{color:var(--gold-bright)}
@media(min-width:960px){.topbar nav{display:flex}}
.topbar nav a{position:relative;padding:4px 0}
.topbar nav a::after{content:"";position:absolute;left:50%;bottom:-2px;width:0;height:2px;border-radius:2px;background:var(--gold-bright);transform:translateX(-50%);transition:width .35s ease}
.topbar nav a:hover::after{width:70%}
.topbar nav a.active{color:var(--gold-bright)}
.topbar nav a.active::after{width:100%}
.topbar.solid nav a.active{color:var(--cinnabar)}
.top-actions{display:flex;align-items:center;gap:10px}
.music-btn{
  display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  font-family:var(--serif);font-size:14px;font-weight:700;letter-spacing:2px;
  border:1px solid rgba(212,169,78,.8);color:var(--gold-bright);
  padding:7px 14px;border-radius:999px;background:rgba(36,26,16,.35);
  transition:background .3s,color .3s,border-color .3s;-webkit-tap-highlight-color:transparent;
}
.topbar.solid .music-btn{background:transparent;border-color:var(--sand);color:var(--cinnabar)}
.music-btn:hover{border-color:var(--gold-bright)}
.music-btn .eq{display:inline-flex;align-items:flex-end;gap:2px;height:15px}
.music-btn .eq i{width:3px;height:5px;background:currentColor;border-radius:2px;display:block;transition:height .2s ease}
.music-btn.playing .eq i{animation:eq 1s ease-in-out infinite}
.music-btn.playing .eq i:nth-child(2){animation-delay:.18s}
.music-btn.playing .eq i:nth-child(3){animation-delay:.36s}
.music-btn.playing .eq i:nth-child(4){animation-delay:.54s}
@keyframes eq{0%,100%{height:4px}50%{height:15px}}
.music-btn .lbl{display:none}
@media(min-width:520px){.music-btn .lbl{display:inline}}
@media (prefers-reduced-motion: reduce){ .music-btn.playing .eq i{animation:none;height:12px} }

/* ============ Hero ============ */
.hero{
  min-height:100svh;display:flex;align-items:center;justify-content:center;
  text-align:center;color:#fdf6e8;overflow:hidden;
  background:var(--wood-deep);
}
.hero-bg{
  position:absolute;inset:0;
  background:url("../img/hero-xiantan.png") center/cover no-repeat;
  animation:kenburns 26s ease-in-out infinite alternate;
  will-change:transform;
}
@keyframes kenburns{
  from{transform:scale(1.02) translate(0,0)}
  to{transform:scale(1.12) translate(-1.5%,-1%)}
}
.hero::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(120% 90% at 50% 115%, rgba(158,43,37,.28), transparent 55%),
    linear-gradient(180deg, rgba(36,26,16,.62) 0%, rgba(36,26,16,.38) 42%, rgba(36,26,16,.78) 100%);
}
.hero-inner{position:relative;z-index:2;padding:110px 22px 90px;max-width:860px}
.hero .seal{
  display:inline-flex;align-items:center;gap:12px;
  font-size:14px;letter-spacing:6px;color:var(--gold-bright);
  margin-bottom:26px;
}
.hero .seal::before,.hero .seal::after{content:"";width:46px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-bright))}
.hero .seal::after{background:linear-gradient(270deg,transparent,var(--gold-bright))}
.hero h1{
  font-size:clamp(38px,7.5vw,72px);font-weight:900;letter-spacing:10px;
  line-height:1.25;margin-bottom:10px;
  text-shadow:0 4px 30px rgba(0,0,0,.55);
}
.hero .h1-sub{font-size:clamp(15px,2.6vw,19px);letter-spacing:4px;color:#eadbc0;margin-bottom:30px}
.hero .pitch{
  font-size:clamp(15px,2.4vw,18px);line-height:2;color:#f3e7cf;
  background:rgba(36,26,16,.42);border:1px solid rgba(212,169,78,.35);
  border-radius:var(--radius);padding:18px 26px;margin:0 auto 34px;max-width:660px;
}
.hero .pitch b{color:var(--gold-bright)}
.cta-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:30px}
.btn-tel{
  display:inline-flex;align-items:center;gap:10px;
  font-size:17px;font-weight:700;letter-spacing:1px;
  padding:16px 30px;border-radius:999px;
  background:linear-gradient(135deg,var(--cinnabar),var(--cinnabar-deep));
  color:#fdf3e3;border:1px solid rgba(212,169,78,.55);
  box-shadow:0 8px 26px rgba(122,31,26,.45);
  transition:transform .25s ease,box-shadow .25s ease;
}
.btn-tel:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(122,31,26,.55)}
.btn-tel small{display:block;font-size:12px;font-weight:400;opacity:.85;letter-spacing:2px}
.btn-tel.ghost{background:linear-gradient(135deg,#8a6a26,#6b4f1a);box-shadow:0 8px 26px rgba(107,79,26,.4)}
.trust-tags{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.trust-tags span{
  font-size:13px;letter-spacing:2px;color:#eedcae;
  border:1px solid rgba(238,220,174,.45);border-radius:999px;padding:5px 14px;
  background:rgba(36,26,16,.35);
}
.scroll-hint{
  position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:2;
  color:#eedcae;font-size:12px;letter-spacing:3px;text-align:center;opacity:.85;
  animation:bob 2.2s ease-in-out infinite;
}
.scroll-hint svg{display:block;margin:6px auto 0;width:18px;height:18px}
@keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}}
@media(max-width:768px){
  .cta-row{flex-direction:column;padding:0 6px}
  .btn-tel{justify-content:center;width:100%}
  .hero h1{letter-spacing:6px}
  .hero .pitch{padding:16px 18px}
}

/* ============ 子页型 Hero（紧凑） ============ */
.hero.hero-slim{min-height:58svh}
.hero.hero-slim .hero-inner{padding:120px 22px 64px}
.hero.hero-slim h1{font-size:clamp(30px,5.5vw,50px)}

/* ============ 章节通用 ============ */
.sec{padding:96px 0}
.sec-head{text-align:center;margin-bottom:52px}
.sec-head .en{font-size:12px;letter-spacing:6px;color:var(--gold);margin-bottom:8px}
.sec-head h2{font-size:clamp(26px,4.5vw,38px);font-weight:900;letter-spacing:4px}
.sec-head .orn{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:16px}
.sec-head .orn::before,.sec-head .orn::after{content:"";width:64px;height:1px;background:linear-gradient(90deg,transparent,var(--gold));transform:scaleX(0);transition:transform 1s cubic-bezier(.22,.61,.36,1)}
.sec-head .orn::before{transform-origin:right}
.sec-head .orn::after{background:linear-gradient(270deg,transparent,var(--gold));transform:scaleX(0);transform-origin:left}
.sec-head.on .orn::before,.sec-head.on .orn::after{transform:scaleX(1)}
.sec-head .orn svg{width:22px;height:22px;opacity:0;transform:scale(.4) rotate(-45deg);transition:opacity .6s ease .45s,transform .7s cubic-bezier(.34,1.56,.64,1) .45s}
.sec-head.on .orn svg{opacity:1;transform:none}
.sec-head .lead{margin:18px auto 0;max-width:660px;color:var(--ink-soft);font-size:16px}

/* ============ 卡片网格 ============ */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.cards{grid-template-columns:1fr}}
.card{
  background:var(--surface);border:1px solid var(--sand);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.card:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:0 16px 38px rgba(168,128,47,.22)}
.card details{summary{list-style:none;cursor:pointer}}
.card details::-webkit-details-marker{display:none}
.card .q{display:flex;gap:14px;align-items:flex-start;padding:22px 22px 18px}
.card .q .ic{flex:none;width:40px;height:40px;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#e7c479,var(--gold));
  display:flex;align-items:center;justify-content:center;color:#fff}
.card .q .ic svg{width:22px;height:22px}
.card .q .t{font-size:17px;font-weight:700;line-height:1.5}
.card .q .t em{display:block;font-style:normal;font-size:13px;font-weight:400;color:var(--gold);letter-spacing:2px;margin-top:6px}
.card .q .chev{margin-left:auto;flex:none;color:var(--gold);transition:transform .3s;align-self:center}
.card details[open] .chev{transform:rotate(180deg)}
.card .a{
  color:var(--ink-soft);font-size:14.5px;
  border-top:1px dashed var(--sand);margin:0 22px;padding:16px 0 20px;
}
.card .go{
  display:inline-block;margin-top:10px;font-size:13px;color:var(--cinnabar);font-weight:700;
  border-bottom:1px solid var(--cinnabar);
}
.card.urgent{border-color:rgba(158,43,37,.5)}
.card.urgent .q .ic{background:radial-gradient(circle at 32% 28%,#c1554d,var(--cinnabar-deep))}

/* ============ 三条规矩式深色手写区 ============ */
.rules{background:linear-gradient(160deg,var(--wood) 0%,var(--wood-deep) 100%);color:#f2e6cc;padding:110px 0;overflow:hidden}
.rules::before{
  content:"";position:absolute;inset:0;opacity:.08;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cpath d='M8 8h56v56H8z M20 20h32v32H20z M30 30h12v12h-12z' fill='none' stroke='%23d4a94e' stroke-width='1.4'/%3E%3C/svg%3E");
}
.rules .wrap{position:relative}
.rules .sec-head h2{color:#f7ead0}
.rules .sec-head .en{color:var(--gold-bright)}
.rule-list{max-width:760px;margin:0 auto;display:grid;gap:34px}
.rule{border-left:3px solid var(--gold);padding:6px 0 6px 26px;position:relative}
.rule .no{
  position:absolute;left:-19px;top:4px;width:36px;height:36px;border-radius:50%;
  background:var(--gold);color:var(--wood-deep);font-weight:900;
  display:flex;align-items:center;justify-content:center;font-size:16px;
}
.rule h3{font-family:var(--brush);font-size:clamp(26px,4vw,34px);font-weight:400;letter-spacing:3px;color:var(--gold-bright);margin-bottom:8px}
.rule p{font-family:var(--brush);font-size:clamp(18px,2.6vw,22px);line-height:2;letter-spacing:1.5px;color:#f0e4c8;font-weight:400}
.rules .vow{text-align:center;margin-top:44px;font-family:var(--brush);font-size:20px;color:#e8d6ac;letter-spacing:2px}

/* ============ 图文分栏（story） ============ */
.story{background:var(--surface)}
.story-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center}
@media(max-width:900px){.story-grid{grid-template-columns:1fr}}
.story-figs{display:grid;grid-template-columns:1.25fr 1fr;grid-template-rows:auto auto;gap:16px}
.story-figs figure{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--sand)}
.story-figs figure:first-child{grid-row:span 2}
.story-figs img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.story-figs figure:hover img{transform:scale(1.05)}
.story-figs figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:10px 14px;font-size:12.5px;letter-spacing:2px;color:#f5ead2;
  background:linear-gradient(transparent,rgba(36,26,16,.72));
}
.story h2{font-size:clamp(26px,4vw,36px);font-weight:900;letter-spacing:4px;margin-bottom:22px}
.story h2 em{font-style:normal;color:var(--cinnabar)}
.story p{color:var(--ink-soft);margin-bottom:16px;font-size:16px}
.story .tagbar{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.story .tagbar span{font-size:13px;letter-spacing:2px;color:var(--cinnabar-deep);border:1px solid var(--sand);border-radius:999px;padding:6px 15px;background:var(--paper)}

/* ============ 步骤时间轴 ============ */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
@media(max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
.step{position:relative;text-align:center;padding:38px 20px 30px;background:var(--surface);border:1px solid var(--sand);border-radius:var(--radius);box-shadow:var(--shadow)}
.step::before{
  content:"";position:absolute;top:59px;right:-27px;width:26px;height:2px;
  background:repeating-linear-gradient(90deg,var(--gold) 0 6px,transparent 6px 12px);
}
.step:last-child::before{display:none}
@media(max-width:900px){.step::before{display:none}}
.step .lotus{
  width:58px;height:58px;margin:0 auto 16px;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#e7c479,var(--gold));
  display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 6px 18px rgba(168,128,47,.4)
}
.step .lotus svg{width:30px;height:30px}
.step h3{font-size:17px;letter-spacing:1px;margin-bottom:8px;color:var(--ink)}
.step p{font-size:14px;color:var(--ink-soft)}
.step .tag{position:absolute;top:14px;left:16px;font-size:12px;color:var(--gold);letter-spacing:2px;font-weight:700}
.flow-close{text-align:center;margin-top:40px;font-family:var(--brush);font-size:22px;letter-spacing:3px;color:var(--cinnabar-deep)}

/* ============ FAQ ============ */
.faq{background:var(--surface)}
.faq-list{max-width:820px;margin:0 auto;display:grid;gap:14px}
.faq details{background:var(--paper);border:1px solid var(--sand);border-radius:12px;transition:border-color .3s}
.faq details[open]{border-color:var(--gold)}
.faq summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;
  padding:18px 22px;font-size:16.5px;font-weight:700;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary .mark{flex:none;width:26px;height:26px;border-radius:6px;background:var(--cinnabar);color:#f7ead0;font-size:15px;display:flex;align-items:center;justify-content:center;font-weight:900}
.faq summary .plus{margin-left:auto;flex:none;color:var(--gold);font-size:20px;transition:transform .3s;line-height:1}
.faq details[open] .plus{transform:rotate(45deg)}
.faq .ans{padding:0 22px 20px 62px;color:var(--ink-soft);font-size:15px}
@media(max-width:640px){.faq .ans{padding-left:22px}}
@keyframes ansIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.faq details[open] .ans,.card details[open] .a{animation:ansIn .45s ease}

/* ============ 表单面板（深色 form-box 同款） ============ */
.form-box{
  background:linear-gradient(160deg,var(--wood),var(--wood-deep));color:#f2e6cc;
  border-radius:var(--radius);padding:34px 32px;box-shadow:var(--shadow);position:relative;overflow:hidden;
}
.form-box::before{
  content:"";position:absolute;inset:0;opacity:.1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40'%3E%3Cpath d='M0 40c10-20 30-20 40-20s30 0 40 20' fill='none' stroke='%23d4a94e' stroke-width='1'/%3E%3C/svg%3E");
}
.form-box h3{position:relative;font-size:22px;letter-spacing:3px;margin-bottom:6px}
.form-box .sub{position:relative;font-size:13.5px;color:#d9c9a4;margin-bottom:22px}
.form-box label,.panel label{position:relative;display:block;font-size:13px;letter-spacing:2px;color:#d9c9a4;margin-bottom:6px}
.form-box input,.form-box textarea,.form-box select,.panel input,.panel textarea,.panel select{
  position:relative;width:100%;margin-bottom:16px;padding:13px 15px;font-size:15px;font-family:var(--serif);
  color:#f7ead0;background:rgba(247,234,208,.07);border:1px solid rgba(212,169,78,.4);border-radius:9px;outline:none;
  transition:border-color .3s, background .3s;
}
.form-box select option{color:#2b2118;background:#fbf6ea}
.form-box input:focus,.form-box textarea:focus,.form-box select:focus{border-color:var(--gold-bright);background:rgba(247,234,208,.12)}
.form-box textarea{min-height:92px;resize:vertical}
.form-box button,.panel button{
  position:relative;width:100%;padding:15px;border:none;border-radius:999px;cursor:pointer;
  font-family:var(--serif);font-size:17px;font-weight:900;letter-spacing:6px;color:var(--wood-deep);
  background:linear-gradient(135deg,#e7c479,var(--gold-bright));
  box-shadow:0 8px 24px rgba(212,169,78,.35);transition:transform .25s,box-shadow .25s;
}
.form-box button:hover,.panel button:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(212,169,78,.5)}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;position:relative}
.f-row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 16px;position:relative}
@media(max-width:640px){.f-row,.f-row3{grid-template-columns:1fr}}
.f-inline{display:flex;gap:14px;flex-wrap:wrap;position:relative}
.f-inline label{display:flex;align-items:center;gap:7px;font-size:13.5px;color:#e6d5ae;margin-bottom:14px;cursor:pointer;letter-spacing:1px}
.f-inline input[type=radio],.f-inline input[type=checkbox]{width:auto;margin:0;accent-color:var(--gold-bright)}
.f-hint{font-size:12px;color:#b6a483;margin:-10px 0 14px;line-height:1.7;position:relative}
.form-msg{position:relative;display:none;margin-top:14px;font-size:14px;color:#ffce9a;text-align:center}
.form-msg.err{color:#ffb4a8}
fieldset.fset{position:relative;border:1px dashed rgba(212,169,78,.4);border-radius:12px;padding:16px 16px 4px;margin-bottom:18px}
fieldset.fset legend{font-size:13px;letter-spacing:3px;color:var(--gold-bright);padding:0 10px}

/* ============ 工具页浅面板（宣纸底表单） ============ */
.panel{
  background:var(--surface);border:1px solid var(--sand);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:30px 32px;position:relative;
}
.panel label{color:var(--ink-soft)}
.panel input,.panel select,.panel textarea{
  color:var(--ink);background:var(--paper);border:1px solid var(--sand);
}
.panel input:focus,.panel select:focus,.panel textarea:focus{border-color:var(--gold);background:#fffaf0}
.panel select option{color:#2b2118;background:#fbf6ea}
.panel button{color:var(--wood-deep)}
.f-hint.lite{color:var(--ink-soft)}
fieldset.fset.lite{border-color:var(--sand)}
fieldset.fset.lite legend{color:var(--gold)}

/* ============ 结果盘面通用 ============ */
.result-wrap{display:grid;gap:26px}
.result-sec{background:var(--surface);border:1px solid var(--sand);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px 30px}
.result-sec > h3{
  display:flex;align-items:center;gap:12px;font-size:19px;letter-spacing:3px;margin-bottom:16px;color:var(--cinnabar-deep);
}
.result-sec > h3::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--sand),transparent)}
.result-sec > h3 svg{width:22px;height:22px;flex:none;color:var(--gold)}
.result-sec .meta{font-size:13.5px;color:var(--ink-soft);margin-bottom:14px}
.conc-box{
  background:linear-gradient(160deg,var(--wood),var(--wood-deep));color:#f2e6cc;
  border-radius:var(--radius);padding:28px 30px;box-shadow:var(--shadow);position:relative;overflow:hidden;
}
.conc-box::before{
  content:"";position:absolute;inset:0;opacity:.1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40'%3E%3Cpath d='M0 40c10-20 30-20 40-20s30 0 40 20' fill='none' stroke='%23d4a94e' stroke-width='1'/%3E%3C/svg%3E");
}
.conc-box h3{position:relative;font-size:20px;letter-spacing:4px;color:var(--gold-bright);margin-bottom:12px}
.conc-box p{position:relative;font-size:15.5px;line-height:2;color:#f0e4c8}
.conc-box p b{color:#ffd79a}

/* 四柱表 */
.pillar-table{width:100%;border-collapse:collapse;font-size:15px}
.pillar-table th,.pillar-table td{border:1px solid var(--sand);padding:10px 8px;text-align:center}
.pillar-table th{background:var(--paper);color:var(--gold);letter-spacing:2px;font-weight:700}
.pillar-table td.gz{font-size:21px;font-weight:900;letter-spacing:2px}
.pillar-table .big{font-size:24px;font-weight:900}
.wx-mu{color:var(--wx-mu)}.wx-huo{color:var(--wx-huo)}.wx-tu{color:var(--wx-tu)}.wx-jin{color:#6f6555}.wx-shui{color:var(--wx-shui)}
.tg-tag{display:inline-block;font-size:12px;border:1px solid var(--sand);border-radius:6px;padding:1px 7px;margin:2px;color:var(--ink-soft);background:var(--paper)}

/* 五行能量条 */
.wx-bars{display:grid;gap:10px;margin-top:8px}
.wx-bar{display:grid;grid-template-columns:2.6em 1fr 4.2em;align-items:center;gap:10px;font-size:14px}
.wx-bar .track{height:12px;border-radius:999px;background:var(--paper);border:1px solid var(--sand);overflow:hidden}
.wx-bar .fill{height:100%;border-radius:999px}
.wx-bar .val{color:var(--ink-soft);text-align:right;font-variant-numeric:tabular-nums}
.wx-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.wx-chips span{font-size:13px;border:1px dashed var(--cinnabar);color:var(--cinnabar);border-radius:999px;padding:2px 12px}

/* 大运时间轴 */
.dayun-row{display:flex;gap:12px;overflow-x:auto;padding:6px 2px 14px}
.du{flex:none;min-width:104px;text-align:center;background:var(--paper);border:1px solid var(--sand);border-radius:12px;padding:12px 10px}
.du .gz{font-size:19px;font-weight:900;letter-spacing:2px}
.du .age{font-size:12px;color:var(--gold);margin-top:2px}
.du .yr{font-size:12px;color:var(--ink-soft)}
.du .shens{font-size:12px;color:var(--ink-soft);margin-top:4px}
.du.good{border-color:rgba(158,43,37,.001)}
.du.luck-xi{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.du.luck-ji{border-style:dashed}
.du.now{background:linear-gradient(160deg,#fff7e6,var(--surface));box-shadow:0 6px 16px rgba(168,128,47,.25)}
.du.child{border-style:dotted;min-width:84px}

/* 流年/通用小表 */
.mini-table{width:100%;border-collapse:collapse;font-size:13.5px}
.mini-table th,.mini-table td{border-bottom:1px dotted var(--sand);padding:7px 8px;text-align:left}
.mini-table th{color:var(--gold);font-weight:700;letter-spacing:1px;background:var(--paper)}
.mini-table tr:last-child td{border-bottom:none}
.num-tab{font-variant-numeric:tabular-nums}

/* 解读块（黑哥解读→坛上解读白话框） */
.read-item{padding:12px 0;border-bottom:1px dashed var(--sand)}
.read-item:last-child{border-bottom:none}
.read-item h4{font-size:15.5px;color:var(--ink);letter-spacing:1px;margin-bottom:4px}
.read-item p{font-size:14.5px;color:var(--ink-soft)}
.basis{display:inline-block;font-size:11.5px;letter-spacing:1px;color:var(--gold);border:1px solid rgba(168,128,47,.45);border-radius:6px;padding:0 7px;margin:4px 6px 0 0;background:rgba(168,128,47,.06)}
.geiyu{
  border:1px solid rgba(168,128,47,.5);border-radius:12px;background:rgba(168,128,47,.07);
  padding:14px 18px;margin-top:14px;font-family:var(--brush);font-size:17.5px;line-height:2;letter-spacing:1px;color:var(--cinnabar-deep);
}
.geiyu::before{content:"坛上解读 · 白话说 ";font-family:var(--serif);font-size:12px;letter-spacing:3px;color:var(--gold);display:block;margin-bottom:4px}

/* 紫微十二宫 4×4 盘 */
.zw-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media(max-width:700px){.zw-grid{font-size:12px}}
.zw-cell{border:1px solid var(--sand);border-radius:10px;background:var(--paper);padding:10px;min-height:118px;position:relative}
.zw-cell.on-ming{border-color:var(--cinnabar);box-shadow:0 0 0 1px var(--cinnabar)}
.zw-cell .pname{font-size:12px;color:var(--gold);letter-spacing:2px}
.zw-cell .pgz{font-size:11px;color:var(--ink-soft);position:absolute;top:10px;right:10px}
.zw-cell .stars{font-size:14px;font-weight:700;margin-top:6px;line-height:1.8}
.zw-cell .sihua{color:var(--cinnabar);font-size:12px}
.zw-cell .xia{color:var(--gold);font-size:11.5px}
.zw-cell .zihua{color:var(--ink-soft);font-size:11px}
.zw-center{grid-column:2/4;grid-row:2/4;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;border:1px dashed var(--gold);border-radius:10px;padding:14px;text-align:center;background:rgba(168,128,47,.05)}
.zw-center b{letter-spacing:2px}
@media(max-width:700px){.zw-center{grid-column:1/5;grid-row:auto}}

/* 奇门九宫 */
.qm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:760px;margin:0 auto}
.qm-cell{border:1px solid var(--sand);border-radius:10px;background:var(--paper);padding:10px 12px;min-height:128px;font-size:13.5px;line-height:1.9}
.qm-cell .palace{position:absolute}
.qm-cell .shen{color:var(--cinnabar);font-weight:700}
.qm-cell .star{color:#1f2a44;color:var(--wx-shui);font-weight:700}
.qm-cell .door{color:var(--gold);font-weight:700}
.qm-cell .gans b{font-size:16px;letter-spacing:2px}
.qm-cell .gans .dipan{color:var(--ink-soft)}
.qm-cell .marks{font-size:11.5px;color:var(--cinnabar-deep)}
.qm-cell .kying{font-size:11.5px;color:var(--gold)}
.qm-cell.center5{background:transparent;border-style:dashed;color:var(--ink-soft)}

/* 六爻卦象 */
.yao-rows{display:grid;gap:8px;max-width:640px}
.yao-row{display:grid;grid-template-columns:4.5em 4em 5.2em 1fr 3em 4.5em;gap:8px;align-items:center;font-size:14.5px;padding:7px 10px;border:1px solid var(--sand);border-radius:10px;background:var(--paper)}
.yao-row.moving{border-color:var(--cinnabar);background:rgba(158,43,37,.05)}
.yao-row .sym{font-size:19px;letter-spacing:1px;color:var(--ink)}
.yao-row .sym.dong-y{color:var(--cinnabar)}
.yao-row .shen{color:var(--gold)}
.yao-row .pq{font-weight:900;letter-spacing:2px}
.yao-row .flag{color:var(--cinnabar);font-weight:700}
.yao-row .bian{color:var(--ink-soft);font-size:12.5px}
.gua-cards{display:flex;gap:18px;flex-wrap:wrap;align-items:flex-start}
.gua-card{flex:1;min-width:180px;text-align:center;border:1px solid var(--sand);border-radius:12px;background:var(--paper);padding:16px}
.gua-card b{display:block;font-size:18px;letter-spacing:2px;margin-bottom:8px}
.gua-lines{display:inline-flex;flex-direction:column-reverse;gap:5px}
.gua-lines i{display:block;width:96px;height:10px;border-radius:3px;background:var(--ink);position:relative}
.gua-lines i.yin{background:transparent}
.gua-lines i.yin::before,.gua-lines i.yin::after{content:"";position:absolute;top:0;bottom:0;width:42px;background:var(--ink);border-radius:3px}
.gua-lines i.yin::before{left:0}.gua-lines i.yin::after{right:0}
.gua-lines i.dong{background:var(--cinnabar)}
.gua-lines i.dong.yin{background:transparent}
.gua-lines i.dong.yin::before,.gua-lines i.dong.yin::after{background:var(--cinnabar)}

/* 卦辞/结论提示条 */
.tip-strip{border:1px dashed var(--gold);border-radius:12px;padding:14px 18px;font-size:14.5px;color:var(--ink-soft);background:rgba(168,128,47,.05);margin-top:14px;line-height:2}
.tip-strip b{color:var(--cinnabar-deep)}

/* JSON 原样输出 */
.raw-box{margin-top:8px}
.raw-box summary{cursor:pointer;font-size:13px;color:var(--gold);letter-spacing:2px;list-style:none}
.raw-box summary::-webkit-details-marker{display:none}
.raw-box pre{
  margin-top:10px;max-height:420px;overflow:auto;background:var(--wood-deep);color:#e8d6ac;
  border-radius:12px;padding:18px;font-size:12px;line-height:1.7;font-family:ui-monospace,Consolas,monospace;
}

/* 警告与局限 */
.note-warn{border-left:3px solid var(--gold);background:rgba(168,128,47,.08);border-radius:0 10px 10px 0;padding:12px 16px;font-size:13.5px;color:var(--ink-soft);margin:10px 0}
.note-warn b{color:var(--cinnabar-deep)}

/* ============ 页脚 ============ */
footer{background:var(--wood-deep);color:#cbb894;padding:56px 0;font-size:14px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:36px;padding-bottom:36px;border-bottom:1px solid rgba(212,169,78,.22)}
@media(max-width:768px){.foot-grid{grid-template-columns:1fr}}
.foot-brand{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:900;letter-spacing:4px;color:#f2e6cc;margin-bottom:14px}
.foot-brand svg{width:28px;height:28px;color:var(--gold-bright)}
.foot-nav{display:flex;flex-wrap:wrap;gap:12px 26px;align-content:flex-start}
.foot-nav a:hover{color:var(--gold-bright)}
.foot-legal{padding-top:22px;font-size:12.5px;line-height:2;color:#9d8a6a}
.foot-legal a{color:var(--gold-bright)}

/* ============ 吸底转化条 ============ */
.sticky-tel{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  display:flex;align-items:center;justify-content:center;gap:12px;
  padding:14px 18px calc(14px + env(safe-area-inset-bottom));
  background:linear-gradient(135deg,var(--cinnabar),var(--cinnabar-deep));
  color:#fdf3e3;font-size:16.5px;font-weight:900;letter-spacing:2px;
  box-shadow:0 -6px 24px rgba(36,26,16,.35);
}
.sticky-tel svg{width:20px;height:20px;flex:none;animation:ring 1.8s ease-in-out infinite}
@keyframes ring{0%,100%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-12deg)}30%{transform:rotate(8deg)}40%{transform:rotate(-6deg)}50%{transform:rotate(0)}}
@media(min-width:769px){
  .sticky-tel{
    left:auto;right:26px;bottom:26px;border-radius:999px;padding:14px 26px;
    box-shadow:0 10px 34px rgba(122,31,26,.5);
    opacity:0;pointer-events:none;transition:opacity .5s ease,transform .5s ease;
    transform:translateY(16px);
  }
  .sticky-tel.show{opacity:1;pointer-events:auto;transform:none}
}

/* ============ 顶部进度香 / 涟漪 / 浮动坞（同 guiyin） ============ */
.incense{position:fixed;top:0;left:0;height:3px;width:100%;z-index:70;pointer-events:none}
.incense i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--gold-bright),#f0d79a);box-shadow:0 0 8px rgba(212,169,78,.75)}
.incense::after{content:"";position:absolute;top:-1px;left:0;width:7px;height:5px;border-radius:50%;background:#f6e6b8;box-shadow:0 0 10px 2px rgba(212,169,78,.9);opacity:0;transition:opacity .3s}
.incense.lit::after{opacity:1}
.btn-tel,.music-btn,.form-box button,.panel button,.sticky-tel{position:relative;overflow:hidden}
.ripple{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,246,224,.6),rgba(255,246,224,0) 70%);transform:scale(0);animation:ripple .62s ease-out forwards;pointer-events:none}
@keyframes ripple{to{transform:scale(2.7);opacity:0}}
.hero-inner{will-change:transform,opacity}
.smoke{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.55;mix-blend-mode:screen}
.float-dock{position:fixed;left:16px;bottom:calc(76px + env(safe-area-inset-bottom));z-index:75;display:flex;flex-direction:column;gap:12px;opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .5s ease,transform .5s ease}
.float-dock.show{opacity:1;transform:none;pointer-events:auto}
@media(min-width:769px){.float-dock{left:26px;bottom:26px}}
.dock-btn{position:relative;width:52px;height:52px;border-radius:50%;border:1px solid rgba(212,169,78,.55);background:linear-gradient(160deg,var(--wood),var(--wood-deep));color:var(--gold-bright);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 22px rgba(36,26,16,.42);transition:transform .2s ease,box-shadow .2s ease;-webkit-tap-highlight-color:transparent}
.dock-btn:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(36,26,16,.5)}
.dock-btn:active{transform:scale(.9)}
.dock-btn svg{width:26px;height:26px}
.muyu .merit{position:absolute;top:-7px;right:-7px;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--cinnabar);color:#fdf3e3;font-size:11px;font-weight:900;display:flex;align-items:center;justify-content:center;border:1px solid rgba(212,169,78,.6);box-shadow:0 2px 6px rgba(36,26,16,.4)}
.muyu .fish{transform-origin:50% 40%}
.muyu.knock .fish{animation:knock .3s ease}
@keyframes knock{0%{transform:rotate(0)}35%{transform:rotate(-13deg) translateY(2px)}70%{transform:rotate(6deg)}100%{transform:rotate(0)}}
.float-txt{position:fixed;z-index:90;pointer-events:none;font-family:var(--brush);font-size:23px;color:var(--gold-bright);text-shadow:0 2px 8px rgba(36,26,16,.55);animation:floatUp 1s ease-out forwards}
@keyframes floatUp{0%{opacity:0;transform:translateY(0) scale(.8)}18%{opacity:1}100%{opacity:0;transform:translateY(-48px) scale(1.12)}}
@media (prefers-reduced-motion: reduce){
  .incense,.float-dock,.hero-inner{transition:none}
  .sec-head .orn::before,.sec-head .orn::after,.sec-head .orn svg{transform:none;opacity:1;transition:none}
  .ripple,.float-txt,.muyu.knock .fish,.faq details[open] .ans,.card details[open] .a{animation:none}
  .smoke{display:none}
}

/* ============ 首屏上香互动（同 guiyin） ============ */
.hero{--incense-h:252px}
.hero-inner{padding:84px 22px calc(var(--incense-h) + 6px)}
.hero h1{font-size:clamp(36px,7vw,62px)}
.hero .seal{margin-bottom:18px}
.hero .pitch{margin-bottom:22px}
.hero .cta-row{margin-bottom:20px}
.hero .scroll-hint{display:none}
.incense-stage{
  position:absolute;left:50%;bottom:0;transform:translateX(-50%);z-index:2;
  width:min(600px,96vw);height:var(--incense-h);
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
  pointer-events:none;
}
#incenseCv{flex:1 1 auto;min-height:0;width:100%;height:auto;display:block}
.incense-bar{position:relative;z-index:4;pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:9px;padding-bottom:12px}
.incense-btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.incense-btn{
  font-family:var(--serif);font-size:14px;letter-spacing:2px;font-weight:700;
  color:#f3e6c8;padding:9px 17px;border-radius:999px;cursor:pointer;
  background:rgba(36,26,16,.5);border:1px solid rgba(212,169,78,.55);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  transition:transform .2s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease;
  -webkit-tap-highlight-color:transparent;
}
.incense-btn:hover{background:rgba(158,43,37,.55);border-color:var(--gold-bright);transform:translateY(-2px);box-shadow:0 6px 18px rgba(122,31,26,.4)}
.incense-btn:active{transform:scale(.95)}
.incense-btn.lit{background:linear-gradient(135deg,var(--cinnabar),var(--cinnabar-deep));border-color:var(--gold-bright);color:#fff5e6}
.incense-btn:disabled{opacity:.5;cursor:default;transform:none;box-shadow:none}
.incense-hint{font-size:12.5px;letter-spacing:1px;color:#e9d6ab;opacity:.92;text-align:center;text-shadow:0 1px 4px rgba(0,0,0,.65);max-width:94vw;line-height:1.7}
@media (prefers-reduced-motion: reduce){ .incense-btn{transition:none} }
@media(max-width:768px){
  .hero{--incense-h:0px;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:64px}
  .hero-inner{padding:16px 22px 4px}
  .hero .cta-row{margin-bottom:16px}
  .incense-stage{position:static;transform:none;left:auto;width:min(440px,94vw);height:auto;margin:2px auto calc(80px + env(safe-area-inset-bottom))}
  #incenseCv{flex:none;height:168px}
  .incense-bar{padding-bottom:6px}
  .hero-slim{--incense-h:0px}
}
@media(max-width:768px){
  body{padding-bottom:58px}
}
