/* 玄問 XUAN·WEN — 神秘深色 ＋ 紋樣 A「羅盤線」 */
:root{
  --bg:#0E0B1F; --bg2:#120E28; --card:#161230; --card2:#1C1636;
  --line:#2A2350; --line2:#3A3160; --line3:#5B4F8F;
  --text:#EDE9FF; --muted:#A49DC2; --gold:#D4AF6A; --gold2:#F2D597; --gold-ink:#1A1430;
  --danger:#F08A8A;
  --tabbar-h:64px;
  --sat:env(safe-area-inset-top,0px); --sab:env(safe-area-inset-bottom,0px);
  --sal:env(safe-area-inset-left,0px); --sar:env(safe-area-inset-right,0px);
  --serif:'Noto Serif TC',serif; --sans:'Noto Sans TC',system-ui,-apple-system,'PingFang TC','Microsoft JhengHei',sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:var(--sans);
  -webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}
body{overscroll-behavior-y:none}
a{color:var(--gold)}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--gold2);outline-offset:2px}

/* 背景紋樣：固定在畫面後面，不跟著捲 */
.bgpat{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}

.app{position:relative;z-index:1;min-height:100%;max-width:560px;margin:0 auto;
  padding:calc(var(--sat) + 12px) calc(var(--sar) + 18px) calc(var(--sab) + var(--tabbar-h) + 20px) calc(var(--sal) + 18px)}

/* 頂列 */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-zh{font-family:var(--serif);font-size:24px;font-weight:900;letter-spacing:6px;color:var(--gold2)}
.brand-en{font-family:'Cinzel',serif;font-size:10px;letter-spacing:3px;color:var(--muted)}
.points{height:36px;padding:0 14px;border-radius:18px;background:#241D45;border:1px solid var(--gold);color:var(--gold);
  font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px;cursor:pointer}

.view{outline:none;display:flex;flex-direction:column;gap:18px;animation:fadein .25s ease}
@keyframes fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* 卡片與區塊 */
.ask{padding:16px;border-radius:20px;background:rgba(28,22,54,.92);border:1px solid var(--line3);display:flex;flex-direction:column;gap:10px}
.ask-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.ask-head label{font-family:var(--serif);font-size:18px;font-weight:700}
.ask-date{font-size:12px;color:var(--muted);white-space:nowrap}
.ask textarea{width:100%;resize:none;border:none;background:transparent;color:var(--text);font-size:16px;font-family:inherit;line-height:1.6;outline:none;min-height:52px}
.ask textarea::placeholder{color:#7D76A0}
.ask-foot{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ask-foot small{font-size:12px;color:var(--muted)}
.btn-gold{min-height:44px;padding:0 20px;border-radius:22px;border:none;background:var(--gold);color:var(--gold-ink);font-size:15px;font-weight:700;cursor:pointer}
.btn-gold:active{background:var(--gold2)}
.btn-ghost{min-height:44px;padding:0 18px;border-radius:22px;border:1px solid var(--line2);background:transparent;color:var(--text);font-size:15px;cursor:pointer}
.btn-block{width:100%}
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -18px;padding:0 18px}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;height:36px;padding:0 14px;border-radius:18px;border:1px solid var(--line2);background:rgba(14,11,31,.6);color:#D8D3F0;font-size:13px;cursor:pointer}

.sec{display:flex;flex-direction:column;gap:10px}
.sec-title{font-size:15px;font-weight:700;margin:0;display:flex;align-items:center;gap:8px}
.sec-title::before{content:"";width:4px;height:4px;transform:rotate(45deg);background:var(--gold)}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.mod{position:relative;min-height:76px;padding:12px;border-radius:14px;background:rgba(22,18,48,.92);border:1px solid var(--line);
  display:flex;flex-direction:column;gap:4px;text-decoration:none;color:var(--text);cursor:pointer;text-align:left;font:inherit}
.mod.center{align-items:center;text-align:center}
.mod.hl{border-color:var(--gold)}
.mod b{font-family:var(--serif);font-size:16px;font-weight:700}
.mod.hl b{color:var(--gold)}
.mod span{font-size:11px;color:var(--muted)}
.mod svg{width:26px;height:26px}
.soon{position:absolute;top:6px;right:6px;font-style:normal;font-size:10px;line-height:16px;padding:0 6px;border-radius:8px;background:#2A2350;color:var(--muted)}
.mod.has-soon{padding-top:26px}

/* 一般頁 */
.page-h{font-family:var(--serif);font-size:22px;font-weight:700;margin:4px 0 0}
.page-sub{color:var(--muted);font-size:14px;margin:0;line-height:1.7}
.guide-link{background:none;border:none;padding:0 0 0 6px;color:var(--gold2);font:inherit;font-size:13px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.gd-sec{margin:0 0 14px}.gd-sec h3{font-family:var(--serif);font-size:16px;color:var(--gold2);margin:0 0 6px}
.gd-sec ul{margin:0;padding-left:1.2em}.gd-sec li{font-size:14px;line-height:1.8;color:#D8D3F0;margin:2px 0}
.gd-ok li::marker{content:"○ ";color:#8fd19e}.gd-ng li::marker{content:"✕ ";color:#e58f8f}
.list{display:flex;flex-direction:column;gap:10px}
.row{display:flex;align-items:center;gap:12px;min-height:60px;padding:12px 14px;border-radius:14px;background:rgba(22,18,48,.92);border:1px solid var(--line);
  color:var(--text);text-decoration:none;cursor:pointer;font:inherit;text-align:left;width:100%}
.row .t{flex:1;display:flex;flex-direction:column;gap:2px}
.row .t b{font-size:15px}
.row .t span{font-size:12px;color:var(--muted)}
.row .arr{color:var(--muted)}
.price{font-size:12px;color:var(--gold);white-space:nowrap}
.note{font-size:12px;color:var(--muted);line-height:1.7}

/* 底部分頁列 */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:20;height:calc(var(--tabbar-h) + var(--sab));padding:6px calc(var(--sar) + 6px) var(--sab) calc(var(--sal) + 6px);
  background:rgba(18,14,40,.96);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.tabbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#9A93B8;text-decoration:none;font-size:11px}
.tabbar a svg{width:22px;height:22px}
.tabbar a.on{color:var(--gold)}
@media (min-width:600px){.tabbar{max-width:560px;margin:0 auto;border-left:1px solid var(--line);border-right:1px solid var(--line);border-radius:16px 16px 0 0}}

/* 底部彈出面板 */
.sheet{position:fixed;inset:0;z-index:50;display:flex;align-items:flex-end;justify-content:center}
.sheet[hidden]{display:none}
.sheet-mask{position:absolute;inset:0;background:rgba(5,3,14,.7)}
.sheet-card{position:relative;width:100%;max-width:560px;max-height:88vh;overflow:auto;padding:24px 20px calc(var(--sab) + 24px);
  background:var(--bg2);border:1px solid var(--line2);border-bottom:none;border-radius:22px 22px 0 0;animation:up .22s ease}
@keyframes up{from{transform:translateY(30px);opacity:.4}to{transform:none;opacity:1}}
.sheet-x{position:absolute;top:10px;right:10px;width:44px;height:44px;border:none;background:transparent;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center}
.sheet h2{font-family:var(--serif);font-size:20px;margin:0 0 6px}
.sheet p{color:var(--muted);font-size:14px;line-height:1.7;margin:0 0 14px}

/* 表單 */
.form{display:flex;flex-direction:column;gap:12px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:13px;color:var(--muted)}
.field input{height:46px;padding:0 14px;border-radius:12px;border:1px solid var(--line2);background:#0E0B1F;color:var(--text);font-size:16px;font-family:inherit}
.field select{height:46px;padding:0 12px;border-radius:12px;border:1px solid var(--line2);background:#0E0B1F;color:var(--text);font-size:16px;font-family:inherit;color-scheme:dark}
.check{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--muted);line-height:1.6}
.check input{width:18px;height:18px;margin-top:2px;accent-color:var(--gold)}
.err{color:var(--danger);font-size:13px;min-height:18px}
.or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;margin:6px 0}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line2)}
.social{display:flex;flex-direction:column;gap:10px;align-items:stretch}
.btn-line{min-height:44px;border-radius:22px;border:none;background:#06C755;color:#fff;font-size:15px;font-weight:700;cursor:pointer}
.linkbtn{background:none;border:none;color:var(--gold);font-size:14px;cursor:pointer;padding:8px 0;min-height:44px}
#gsiBtn{display:flex;justify-content:center;min-height:44px}

/* 首次導覽 */
.tour{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:24px calc(var(--sar) + 20px) calc(var(--sab) + 24px) calc(var(--sal) + 20px);background:rgba(5,3,14,.82)}
.tour[hidden]{display:none}
.tour-card{width:100%;max-width:400px;padding:26px 22px 20px;border-radius:24px;background:var(--bg2);border:1px solid var(--gold);text-align:center;
  box-shadow:0 0 0 6px rgba(212,175,106,.08)}
.tour-art{height:120px;display:flex;align-items:center;justify-content:center;margin-bottom:8px}
.tour-art svg{width:110px;height:110px}
.tour-title{font-family:var(--serif);font-size:21px;margin:0 0 8px;color:var(--gold2)}
.tour-text{font-size:15px;line-height:1.8;color:#D8D3F0;margin:0 0 16px;min-height:81px}
.tour-dots{display:flex;gap:6px;justify-content:center;margin-bottom:16px}
.tour-dots i{width:6px;height:6px;border-radius:3px;background:var(--line2);transition:width .2s}
.tour-dots i.on{width:18px;background:var(--gold)}
.tour-btns{display:flex;gap:10px}
.tour-btns button{flex:1}

/* 啟動畫面 */
.splash{position:fixed;inset:0;z-index:100;overflow:hidden;background:var(--bg);display:flex;align-items:center;justify-content:center;transition:opacity .45s ease}
.splash.out{opacity:0;pointer-events:none}
.sp-ring{position:absolute;width:0;height:0;z-index:2}
.sp-flash{position:absolute;inset:0;opacity:0;pointer-events:none;z-index:3}
.sp-rays{position:absolute;width:640px;height:640px;opacity:0;pointer-events:none;border-radius:50%;
  background:repeating-conic-gradient(from 0deg,rgba(242,213,151,.42) 0deg 3deg,transparent 3deg 15deg);
  -webkit-mask:radial-gradient(circle,#000 8%,rgba(0,0,0,.6) 30%,transparent 62%);mask:radial-gradient(circle,#000 8%,rgba(0,0,0,.6) 30%,transparent 62%)}
.sp-wave{position:absolute;width:90px;height:90px;border-radius:50%;border:2px solid #F2D597;box-shadow:0 0 18px rgba(242,213,151,.6),inset 0 0 18px rgba(242,213,151,.35);opacity:0;pointer-events:none}
.sp-pt{position:absolute;border-radius:50%;background:#F2D597;box-shadow:0 0 6px #F2D597;opacity:0;pointer-events:none}
.splash .splash-in{z-index:4}
.sp-ic{position:absolute;display:flex;flex-direction:column;align-items:center;gap:5px;transform:translate(-50%,-50%);opacity:0;pointer-events:none}
.sp-ic span{width:52px;height:52px;border-radius:50%;border:1px solid rgba(212,175,106,.6);background:rgba(22,18,48,.9);color:var(--gold);display:flex;align-items:center;justify-content:center;box-shadow:0 0 14px rgba(212,175,106,.18)}
.sp-ic svg{width:24px;height:24px}
.sp-ic b{font-family:var(--serif);font-size:12px;font-weight:500;color:var(--gold2);letter-spacing:2px}
.sp-slogan{margin:14px 0 0;min-height:22px;font-size:14px;letter-spacing:4px;color:var(--muted);opacity:0;transition:opacity .4s}
.sp-slogan.on{opacity:1}
.splash-in{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;animation:glow 1.4s ease}
.splash-logo{width:120px;height:120px;margin-bottom:10px}
.splash .brand-zh{font-size:34px;letter-spacing:12px;padding-left:12px}
@keyframes glow{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}

/* 提示 */
.toast{position:fixed;left:50%;bottom:calc(var(--sab) + var(--tabbar-h) + 18px);transform:translate(-50%,20px);z-index:70;max-width:86vw;
  padding:10px 16px;border-radius:12px;background:#2A2350;border:1px solid var(--line3);color:var(--text);font-size:14px;opacity:0;pointer-events:none;transition:.2s}
.toast.show{opacity:1;transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ═══ 命盤（第 2 步：紫微、八字、流年） ═══ */
.loading{display:flex;flex-direction:column;align-items:center;gap:12px;padding:60px 0;color:var(--muted);font-size:14px}
.loading svg{width:64px;height:64px;animation:spin 2.4s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.card{padding:16px;border-radius:16px;background:rgba(22,18,48,.94);border:1px solid var(--line)}
.card.hl{border-color:var(--gold)}
.card h3{font-family:var(--serif);font-size:17px;margin:0 0 8px;color:var(--gold2)}
.card h3 span{font-family:var(--sans);font-size:12px;color:var(--muted);font-weight:400;margin-left:6px}
.card p{font-size:14px;line-height:1.85;margin:0 0 8px;color:#D8D3F0}
.card p:last-child{margin-bottom:0}
.card dl{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0;font-size:14px;line-height:1.6}
.card dt{color:var(--muted);white-space:nowrap}
.card dd{margin:0;color:var(--text)}
.h3{font-family:var(--serif);font-size:16px;margin:6px 0 -6px;color:var(--gold2)}
.h3 small{font-family:var(--sans);font-size:11px;color:var(--muted);font-weight:400;margin-left:6px}
.warn{color:#F0A27A}
.gold{color:var(--gold2)}
.btn-ghost.sm{min-height:36px;padding:0 12px;font-size:13px}
.xc-body{display:flex;flex-direction:column;gap:14px}

/* 生日資料 */
.pf{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:rgba(28,22,54,.92);border:1px solid var(--line3)}
.pf-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pf-t b{font-family:var(--serif);font-size:17px}
.pf-t span{font-size:12px;color:var(--muted)}
.pf-row{padding:0;gap:0}
.pf-row .t{background:none;border:none;color:var(--text);text-align:left;padding:12px 14px;cursor:pointer;font:inherit;min-height:60px}
.pf-row.on{border-color:var(--gold)}
.pf-edit{background:none;border:none;border-left:1px solid var(--line);color:var(--gold);padding:0 16px;min-height:60px;cursor:pointer;font:inherit;font-size:13px}
.xc-form .flabel{font-size:13px;color:var(--muted)}
.xc-form select{height:46px;padding:0 10px;border-radius:12px;border:1px solid var(--line2);background:#0E0B1F;color:var(--text);font-size:16px;font-family:inherit;min-width:0}
.ymd{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:8px}
.seg2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.seg2 label{position:relative}
.seg2 input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.seg2 span{display:flex;align-items:center;justify-content:center;height:44px;border-radius:12px;border:1px solid var(--line2);color:var(--muted);font-size:15px}
.seg2 input:checked+span{border-color:var(--gold);color:var(--gold2);background:rgba(212,175,106,.1)}
.seg2 input:focus-visible+span{outline:2px solid var(--gold2);outline-offset:2px}
.btn-ghost.btn-block{margin-top:2px}

/* 紫微 / 八字 / 流年 分頁 */
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;padding:4px;border-radius:14px;background:rgba(14,11,31,.7);border:1px solid var(--line)}
.seg a{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:40px;border-radius:10px;color:var(--muted);text-decoration:none;font-size:15px;font-family:var(--serif);font-weight:700}
.seg a.on{background:var(--gold);color:var(--gold-ink)}
.seg a.off{opacity:.5}
.seg a small{font-family:var(--sans);font-size:9px;font-weight:400}
.seg3{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.seg3 button{min-height:36px;border-radius:18px;border:1px solid var(--line2);background:transparent;color:var(--muted);font-size:13px;cursor:pointer;font-family:inherit}
.seg3 button.on{border-color:var(--gold);color:var(--gold2);background:rgba(212,175,106,.12)}
.yr{display:flex;align-items:center;justify-content:center;gap:10px}
.yr b{font-family:var(--serif);font-size:16px;min-width:120px;text-align:center}
.yr.big b{font-size:19px;color:var(--gold2)}
.yr button{width:40px;height:40px;border-radius:20px;border:1px solid var(--line2);background:transparent;color:var(--gold);font-size:20px;cursor:pointer}
.yr select{height:36px;border-radius:10px;border:1px solid var(--line2);background:#0E0B1F;color:var(--text);font-size:15px;padding:0 8px}

/* 紫微 12 宮 */
.zgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(118px,auto));gap:2px;
  margin:0 -12px;padding:2px;border-radius:12px;background:var(--line);border:1px solid var(--line2)}
.zp{position:relative;display:flex;flex-direction:column;gap:2px;padding:4px 3px 3px;background:#14102C;border:1px solid transparent;color:var(--text);
  font:inherit;text-align:left;cursor:pointer;min-width:0;overflow:hidden}
.zp.ming{background:#1B1538}
.zp.tri{background:#221B45}
.zp.sel{background:#2A2152;border-color:var(--gold2)}
.zp.lm{box-shadow:inset 0 0 0 2px var(--gold)}
.zs{display:flex;flex-direction:column;gap:1px}
.zm{display:flex;flex-wrap:wrap;gap:0 4px;margin-top:2px}
.st{display:inline-flex;align-items:center;gap:1px;white-space:nowrap;line-height:1.35}
.st.maj{font-size:13px;font-weight:700;color:#F5E3B8;font-family:var(--serif)}
.st.good{font-size:10.5px;color:#9FC9E8}
.st.bad{font-size:10.5px;color:#E89A9A}
.st.mi{font-size:10.5px;color:#BDB6DA}
.st em{font-style:normal;font-size:9px;color:var(--muted);font-weight:400;font-family:var(--sans)}
.hz{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:3px;font-style:normal;font-size:9.5px;font-weight:700;
  color:#120E28;font-family:var(--sans);margin-left:1px;flex:none}
.hz-lu{background:#7FD18B}.hz-quan{background:#E6A85C}.hz-ke{background:#7DB7F0}.hz-ji{background:#F07A7A}
.hz.o{background:transparent;border:1px solid}
.hz.o.hz-lu{color:#7FD18B}.hz.o.hz-quan{color:#E6A85C}.hz.o.hz-ke{color:#7DB7F0}.hz.o.hz-ji{color:#F07A7A}
.zf{margin-top:auto;display:flex;justify-content:space-between;align-items:baseline;font-size:10px;color:var(--muted)}
.zl{color:var(--gold2);font-weight:700;font-size:11px}
.zb{display:flex;align-items:center;gap:3px;border-top:1px solid var(--line);padding-top:2px;font-size:10px;color:var(--muted)}
.zb b{font-family:var(--serif);font-size:13px;color:var(--gold);flex:1}
.zp.ming .zb b{color:var(--gold2)}
.shen{font-style:normal;font-size:9px;padding:0 3px;border-radius:3px;background:var(--line3);color:var(--text)}
.zc{grid-area:2/2/4/4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:8px;text-align:center;
  background:radial-gradient(circle,rgba(212,175,106,.08),transparent 70%),#110D26;font-size:11.5px;color:#C9C2E6;line-height:1.45}
.zc-n{font-family:var(--serif);font-size:18px;color:var(--gold2);margin-bottom:2px}
.zlegend{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:11px;color:var(--muted);margin:-4px 0 0}
.zstrip{font-size:13px;line-height:1.9;color:#D8D3F0;margin:0;padding:10px 12px;border-radius:12px;background:rgba(14,11,31,.7);border:1px dashed var(--line2)}
.zstrip .hz{margin-right:2px}
.zd dl{font-size:13px}
.read p b{color:var(--gold2)}
@media (min-width:420px){.zgrid{margin:0}.st.maj{font-size:14px}.st.good,.st.bad,.st.mi{font-size:11px}}

/* 付費按鈕列 */
.paycta{display:flex;align-items:center;gap:12px;padding:14px;border-radius:16px;border:1px solid var(--gold);background:linear-gradient(135deg,rgba(212,175,106,.14),rgba(22,18,48,.94))}
.paycta>div{flex:1;display:flex;flex-direction:column;gap:2px}
.paycta b{font-family:var(--serif);font-size:16px;color:var(--gold2)}
.paycta span{font-size:12px;color:var(--muted)}
.paycta .btn-gold{white-space:nowrap}

/* 八字 */
.bz-wrap{overflow-x:auto;border-radius:14px;border:1px solid var(--line);background:rgba(22,18,48,.94)}
.bz,.mt{width:100%;border-collapse:collapse;font-size:13px;text-align:center}
.bz th,.bz td,.mt th,.mt td{padding:7px 4px;border-bottom:1px solid var(--line)}
.bz tr:last-child th,.bz tr:last-child td,.mt tr:last-child td{border-bottom:none}
.bz thead th,.mt thead th{font-family:var(--serif);color:var(--gold);font-size:14px;font-weight:700}
.bz tbody th{color:var(--muted);font-weight:400;font-size:12px;white-space:nowrap;text-align:left;padding-left:10px}
.bz tr.big td b{font-family:var(--serif);font-size:26px;font-weight:900}
.bz small,.mt small{display:block;font-size:10.5px;color:var(--muted)}
.bz td small{display:inline;margin-left:2px}
.wx0{color:#7FD18B}.wx1{color:#F08A6A}.wx2{color:#D9B26A}.wx3{color:#E6E2F5}.wx4{color:#6FB1F0}
.wxbar{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.wxi{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;border-radius:12px;background:rgba(22,18,48,.94);border:1px solid var(--line)}
.wxi .wx{font-family:var(--serif);font-size:18px;font-weight:900}
.wxi i{display:block;width:70%;height:4px;border-radius:2px;background:linear-gradient(90deg,var(--gold) calc(var(--n)*12.5%),var(--line) 0)}
.wxi b{font-size:13px}
.kv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.kv>div{display:flex;flex-direction:column;gap:2px;padding:10px;border-radius:12px;background:rgba(22,18,48,.94);border:1px solid var(--line)}
.kv span{font-size:11px;color:var(--muted)}
.kv b{font-family:var(--serif);font-size:16px}
.kv small{font-family:var(--sans);font-size:10.5px;color:var(--muted);font-weight:400}
.dyrow{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -18px;padding:2px 18px 4px}
.dyrow::-webkit-scrollbar{display:none}
.dy{position:relative;flex:none;width:76px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;border-radius:12px;
  background:rgba(22,18,48,.94);border:1px solid var(--line);color:var(--text);cursor:pointer;font:inherit}
.dy b{font-family:var(--serif);font-size:20px}
.dy span{font-size:10.5px;color:#D8D3F0}
.dy small{font-size:10px;color:var(--muted)}
.dy.on{border-color:var(--gold);background:rgba(212,175,106,.12)}
.dy i{position:absolute;top:-7px;font-style:normal;font-size:9px;padding:0 6px;border-radius:7px;background:var(--gold);color:var(--gold-ink)}
.lngrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.ln{display:flex;flex-direction:column;align-items:center;gap:1px;padding:8px 2px;border-radius:10px;background:rgba(22,18,48,.94);border:1px solid var(--line)}
.ln b{font-family:var(--serif);font-size:16px}
.ln span{font-size:10px;color:#D8D3F0;white-space:nowrap}
.ln small{font-size:10px;color:var(--muted)}
.ln.now{border-color:var(--gold)}

/* 流年 */
.tsl{display:flex;flex-wrap:wrap;gap:8px}
.tsl span{display:flex;flex-direction:column;align-items:center;padding:6px 12px;border-radius:12px;border:1px solid var(--line2);font-family:var(--serif);font-size:17px}
.tsl span small{font-family:var(--sans);font-size:10px;color:var(--muted)}
.tsl span.me{border-color:#F0A27A;color:#F0A27A}
.fsgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;border-radius:14px;background:var(--line);border:1px solid var(--line2)}
.fs{display:flex;flex-direction:column;align-items:center;gap:1px;padding:10px 4px;background:#14102C;border-radius:8px}
.fs small{font-size:10px;color:var(--muted)}
.fs b{font-family:var(--serif);font-size:24px;font-weight:900}
.fs span{font-size:11px;color:#D8D3F0}
.fs em{font-style:normal;font-size:10.5px}
.fs.g b,.fs.g em{color:var(--gold2)}
.fs.b b,.fs.b em{color:#E89A9A}
.fs.c{background:#1F1840;box-shadow:inset 0 0 0 1px var(--gold)}
.mt td{font-family:var(--serif);font-size:14px}
.mt td small{font-family:var(--sans)}
.xc-form input[type=time]{color-scheme:dark;height:46px;padding:0 14px;border-radius:12px;border:1px solid var(--line2);background:#0E0B1F;color:var(--text);font-size:16px;font-family:inherit}

/* 第 3 步：點數交易紀錄 */
.wl-h{margin:14px 0 8px;font-size:14px;font-weight:600;color:var(--muted)}
.wl{max-height:46vh;overflow-y:auto;gap:8px}
.wl-row{min-height:52px}
.wl-n{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.wl-n b{font-size:16px}
.wl-n b.pos{color:var(--gold)}
.wl-n b.neg{color:var(--text)}
.wl-n span{font-size:11px;color:var(--muted)}
.field .check,#sheetBody>.check{margin:10px 0}


/* 第 5 步：開關、儀式、求籤、易經、解惑紀錄 */
.sw-row .sw{position:relative;flex:none;width:46px;height:26px;border-radius:13px;background:var(--line2);transition:background .2s}
.sw-row .sw::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#EDE9FF;transition:transform .2s}
.sw-row .sw.on{background:var(--gold)}
.sw-row .sw.on::after{transform:translateX(20px);background:var(--gold-ink)}


/* 儀式共用（靜心、長按點香、擲筊） */
.q-stage{display:flex;flex-direction:column;gap:14px}
.rt-wrap{display:flex;flex-direction:column;align-items:center;gap:14px;padding:18px 0 8px;text-align:center}
.rt-title{font-family:var(--serif);font-size:19px;color:var(--gold2);margin:0}
.rt-sub{font-size:13px;color:var(--muted);margin:0;line-height:1.7}
.rt-breath{position:relative;width:200px;height:200px;display:flex;align-items:center;justify-content:center}
.rt-circle{position:absolute;inset:0;border-radius:50%;border:2px solid var(--gold);background:radial-gradient(circle,rgba(212,175,106,.28),rgba(212,175,106,.04) 70%);transform:scale(.55);opacity:.55}
.rt-bt{position:relative;font-family:var(--serif);font-size:22px;color:var(--gold2)}
.rt-hold{position:relative;width:132px;height:132px;border-radius:50%;border:none;background:rgba(28,22,54,.92);color:var(--gold2);font:inherit;font-size:16px;font-family:var(--serif);cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.rt-hold svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.rt-ring0{fill:none;stroke:var(--line2);stroke-width:3}
.rt-ring{fill:none;stroke:var(--gold);stroke-width:4;stroke-linecap:round}
.rt-hold span{position:relative}
.rt-hold.on{background:rgba(212,175,106,.16)}
.rt-hold.done{background:rgba(212,175,106,.28)}
/* 三炷香 */
.q-incense{position:relative;width:64px;height:96px}
.q-incense b{position:absolute;left:30px;bottom:0;width:4px;height:58px;border-radius:2px;background:#8a6a3a}
.q-incense b:nth-of-type(1){left:16px;height:52px;transform:rotate(-6deg);transform-origin:bottom center}
.q-incense b:nth-of-type(3){left:44px;height:52px;transform:rotate(6deg);transform-origin:bottom center}
.q-incense b::before{content:"";position:absolute;top:-2px;left:-1px;width:6px;height:6px;border-radius:50%;background:#ff9a4a;box-shadow:0 0 8px #ff9a4a}
.q-incense i{position:absolute;left:29px;bottom:56px;width:2px;height:34px;border-radius:2px;background:linear-gradient(#EDE9FF00,#EDE9FF66);opacity:0;animation:smoke 3.2s ease-in infinite}
.q-incense i:nth-child(1){left:13px;bottom:52px}.q-incense i:nth-child(2){animation-delay:1s;left:31px;bottom:58px}.q-incense i:nth-child(3){animation-delay:2s;left:49px;bottom:52px}
/* 塔羅（西洋）：蠟燭，不燒香 */
.q-candle{position:relative;width:40px;height:96px}
.q-candle b{position:absolute;left:10px;bottom:0;width:20px;height:50px;border-radius:4px 4px 2px 2px;background:linear-gradient(90deg,#d9cfb8,#f4ecd8 45%,#cbbf9f)}
.q-candle i{position:absolute;left:14px;bottom:52px;width:12px;height:22px;border-radius:50% 50% 45% 45%/60% 60% 40% 40%;background:radial-gradient(circle at 50% 70%,#fff6d0,#ffb347 55%,#ff8a2a00 75%);box-shadow:0 0 18px 6px rgba(255,170,70,.35);animation:flicker 1.6s ease-in-out infinite;transform-origin:50% 90%}
@keyframes flicker{0%,100%{transform:scale(1) rotate(-1deg)}50%{transform:scale(1.06,.94) rotate(2deg)}}
@keyframes smoke{0%{opacity:0;transform:translateY(8px) scaleX(1)}30%{opacity:.8}100%{opacity:0;transform:translateY(-24px) translateX(6px) scaleX(2)}}
.q-prayer{font-family:var(--serif);font-size:17px;line-height:2;color:#EDE9FF;margin:0;max-width:30em}
.q-pick .seg2 span{flex-direction:column;height:56px;gap:2px}
.q-pick .seg2 small{font-size:11px;color:var(--muted)}
.q-jiao{display:flex;gap:22px;justify-content:center;height:78px;align-items:center}
.jb{display:block;width:74px}
.jb svg{display:block;width:100%;fill:#B5452E;stroke:#E8B27A;stroke-width:1.5}
.jb.flat svg{fill:#7A2E22;transform:scaleY(-1)}
.jb.round svg{fill:#C4553B}
.q-jiao.throw .jb{animation:jtoss 1s ease-out}
.q-jiao.throw .jb:nth-child(2){animation-delay:.08s}
@keyframes jtoss{0%{transform:translateY(0) rotate(0)}35%{transform:translateY(-70px) rotate(300deg)}60%{transform:translateY(0) rotate(540deg)}75%{transform:translateY(-14px) rotate(640deg)}100%{transform:translateY(0) rotate(720deg)}}
.q-jmsg{min-height:44px;display:flex;flex-direction:column;align-items:center;gap:2px;margin:0;font-size:13px;color:var(--muted)}
.q-jmsg b{font-family:var(--serif);font-size:22px}
.q-j-sheng{color:var(--gold2)}.q-j-xiao{color:#9FC9E8}.q-j-yin{color:#E89A9A}
.q-tube{width:150px;height:200px}
.q-tube .sticks rect{fill:#D9B26A}
.q-tube .tb{fill:#7A2E22;stroke:#E8B27A;stroke-width:1.5}.q-tube .tbr{stroke:#E8B27A;stroke-width:3;fill:none}.q-tube .tbl{stroke:#E8B27A;stroke-width:1;fill:none;opacity:.6}
.q-tube.shk{animation:shk .6s ease-in-out}
@keyframes shk{0%,100%{transform:rotate(0)}15%{transform:rotate(-14deg) translateY(-4px)}35%{transform:rotate(12deg)}55%{transform:rotate(-10deg) translateY(-3px)}75%{transform:rotate(8deg)}}
.q-dots{display:flex;gap:8px;margin:0}
.q-dots i{width:10px;height:10px;border-radius:50%;border:1px solid var(--gold)}
.q-dots i.on{background:var(--gold)}
.q-stick{padding:40px 14px 10px;min-width:64px;border-radius:6px;background:linear-gradient(#E8C98A,#C99A4E);color:#3b2410;animation:stk 1.2s ease-out both}
.q-stick b{writing-mode:vertical-rl;font-family:var(--serif);font-size:22px;letter-spacing:4px}
.q-stick.still{animation:none}
@keyframes stk{from{transform:translateY(-120px) rotate(-8deg);opacity:0}60%{transform:translateY(6px) rotate(3deg);opacity:1}to{transform:none}}
.q-paper{display:flex;flex-direction:column;gap:14px;padding:22px 20px;border-radius:14px;background:linear-gradient(180deg,#2a2146,#1c1636);border:1px solid var(--gold);overflow:hidden}
.q-paper.unroll{animation:unroll .9s ease-out}
@keyframes unroll{from{max-height:0;opacity:.3}to{max-height:2400px;opacity:1}}
.q-head{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.q-head small{color:var(--muted);font-size:12px;letter-spacing:2px}
.q-head h2{font-family:var(--serif);font-size:28px;margin:0;color:var(--gold2)}
.q-name{margin:0;font-size:15px;color:#D8D3F0}
.q-gua{margin:0;font-size:13px;letter-spacing:3px;color:var(--gold)}.q-el{margin:0;font-size:12.5px;color:var(--muted)}
.q-story{margin:0;text-align:center;font-size:12.5px;color:var(--muted)}
.q-jy{display:flex;flex-direction:column;gap:6px}.q-jy p{margin:0;font-size:13.5px;line-height:1.8;color:#D8D3F0}.q-jy b{color:var(--gold);font-family:var(--serif);margin-right:10px}
.q-lv{padding:2px 14px;border-radius:12px;font-size:13px;font-weight:700;color:var(--gold-ink)}
.lv1{background:#F2D597}.lv2{background:#D4AF6A}.lv3{background:#BDB6DA}.lv4{background:#E6A85C}.lv5{background:#E89A9A}
.q-poem{display:flex;flex-direction:column;gap:6px;text-align:center;padding:8px 0;border-top:1px dashed var(--line2);border-bottom:1px dashed var(--line2)}
.q-poem p{margin:0;font-family:var(--serif);font-size:21px;letter-spacing:3px;color:#F5E3B8}
.q-plain h3,.q-items h3{font-family:var(--serif);font-size:15px;margin:0 0 6px;color:var(--gold2)}
.q-plain p{margin:0;font-size:14.5px;line-height:1.85;color:#D8D3F0}
.q-items dl{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0;font-size:14px;line-height:1.6}
.q-items dt{color:var(--gold);white-space:nowrap}.q-items dd{margin:0}
.q-r{transition:opacity .8s ease,transform .8s ease}
.q-r.hid{opacity:0;transform:translateY(8px)}
.q-after{display:flex;flex-direction:column;transition:opacity .6s}
.q-after.hid{opacity:0;pointer-events:none}
.q-used p{font-size:14px}
.rec-body{max-height:56vh;overflow-y:auto;margin-top:10px}
/* 易經 */
.yj-hex{width:120px;height:auto;display:block;fill:var(--gold2)}
.yj-hex .mv{fill:#F0A27A}
.yj-hex text{fill:#F0A27A;font-size:14px;font-family:var(--sans)}
.yj-top{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;text-align:center}
.yj-top>div{display:flex;flex-direction:column;align-items:center;gap:4px}
.yj-top small{font-size:11px;color:var(--muted)}
.yj-top b{font-family:var(--serif);font-size:19px;color:var(--gold2)}
.yj-top span{font-size:12px;color:var(--muted)}
.yj-arrow{font-size:24px;color:var(--gold)}
.yj-day{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;font-size:13px;color:var(--muted)}
.yj-day b{color:var(--text);font-family:var(--serif)}
.yj-table table{width:100%;border-collapse:collapse;text-align:center;font-size:13.5px}
.yj-table th{font-family:var(--serif);color:var(--gold);font-size:13px;padding:6px 2px;border-bottom:1px solid var(--line)}
.yj-table td{padding:7px 2px;border-bottom:1px solid var(--line)}
.yj-table tr:last-child td{border-bottom:none}
.yj-table tr.mv{background:rgba(240,162,122,.08)}
.yj-table .b{color:var(--muted);font-size:12px}
.yj-table .l{display:flex;gap:6px;justify-content:center;align-items:center;height:30px}
.yj-table .l i{display:block;height:8px;border-radius:2px;background:var(--gold2)}
.yj-table .l .ln1{width:56px}.yj-table .l .ln0{width:25px}
.yj-table .l em{font-style:normal;color:#F0A27A;width:14px}
.yj-table .s{color:var(--gold);font-weight:700;font-family:var(--serif)}
.yj-pl{color:var(--muted);font-size:13.5px}
.yj-res{display:flex;flex-direction:column;gap:14px}
@media (min-width:1024px){.yj-res{max-width:860px;margin:0 auto;width:100%}.q-paper,.q-after,.q-pick{max-width:640px;margin:0 auto;width:100%}}
.yj-build{display:flex;flex-direction:column;gap:8px;min-height:130px;align-items:center;justify-content:flex-end}
.yj-build .yl{display:flex;gap:8px;align-items:center;animation:ylg .6s ease-out}
.yj-build .yl i{display:block;height:10px;border-radius:2px;background:var(--gold2)}
.yj-build .yl.y1 i:first-child{width:112px}.yj-build .yl.y1 i:nth-child(2){display:none}
.yj-build .yl.y0 i{width:52px}
.yj-build .yl em{font-style:normal;color:#F0A27A;width:16px}
.yj-build .yl.mv i{background:#F0A27A}
@keyframes ylg{from{opacity:0;transform:translateY(14px) scaleX(.4)}to{opacity:1;transform:none}}
.yj-coins{display:flex;gap:16px;height:64px;align-items:center}
.coin{position:relative;display:flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#F2D597,#B78B3E);color:#4a3210;font-family:var(--serif);font-weight:700;border:2px solid #8a6a3a}
.coin::before{content:"";position:absolute;width:14px;height:14px;border:2px solid #8a6a3a;opacity:.7}
.coin b,.coin i{position:relative;font-style:normal;font-size:15px;display:none;top:18px}
.coin.yang b,.coin.yin i{display:block}
.coin.flip{animation:cflip 1s ease-out both}
@keyframes cflip{0%{transform:translateY(0) rotateX(0)}40%{transform:translateY(-60px) rotateX(900deg)}70%{transform:translateY(0) rotateX(1440deg)}85%{transform:translateY(-10px) rotateX(1500deg)}100%{transform:translateY(0) rotateX(1800deg)}}
/* 命盤生成儀式 */
.rt-chart{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;background:rgba(10,8,24,.96);transition:opacity .35s}
.rt-chart.out{opacity:0}
.rt-chart-in{display:flex;flex-direction:column;align-items:center;gap:16px;width:min(86vw,420px)}
.rt-zw{width:100%;overflow:visible}
.rt-pal{fill:none;stroke:var(--gold);stroke-width:.6;opacity:.5}
.rt-dot{fill:var(--gold2)}
.rt-st{opacity:0}
.rt-chart.go .rt-st{animation:stIn calc(var(--T,4000ms)*.5) cubic-bezier(.2,.8,.3,1) both;animation-delay:var(--d)}
@keyframes stIn{from{opacity:0;transform:translate(var(--fx),var(--fy)) scale(.3)}to{opacity:1;transform:none}}
.rt-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%}
.rt-pillars>div{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 0;border-radius:10px;border:1px solid var(--line3);background:rgba(28,22,54,.9);opacity:0}
.rt-pillars small{font-size:11px;color:var(--muted)}
.rt-pillars b{display:block;width:14px;height:28px;border-radius:3px;background:var(--gold)}
.rt-chart.go .rt-pillars>div{animation:pDrop .7s ease-out both;animation-delay:var(--d)}
@keyframes pDrop{from{opacity:0;transform:translateY(-40px)}to{opacity:1;transform:none}}
.rt-chart:not(.go) .rt-st,.rt-chart:not(.go) .rt-pillars>div{opacity:1}


/* 第 6 步：塔羅、星座 */
.tr-deck{position:relative;width:150px;height:230px;border:none;background:none;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;padding:0}
.tr-bk{display:block}.tr-bk svg,.tr-card svg,.tr-front svg,.tr-rear svg{display:block;width:100%;height:auto}
.tr-deck .tr-bk{position:absolute;left:calc(var(--i)*3px);top:calc(var(--i)*-3px);width:140px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.tr-deck.shuf .tr-bk:nth-child(odd){animation:shufA .28s ease-in-out infinite alternate}
.tr-deck.shuf .tr-bk:nth-child(even){animation:shufB .28s ease-in-out infinite alternate}
@keyframes shufA{from{transform:translateX(-36px) rotate(-6deg)}to{transform:translateX(30px) rotate(4deg)}}
@keyframes shufB{from{transform:translateX(34px) rotate(5deg)}to{transform:translateX(-28px) rotate(-4deg)}}
.tr-bar{width:200px;height:4px;border-radius:2px;background:var(--line2);overflow:hidden}.tr-bar i{display:block;height:100%;width:0;background:var(--gold)}
.tr-piles{display:flex;gap:14px;justify-content:center}
.tr-pile{position:relative;width:86px;height:140px;border:none;background:none;cursor:pointer;padding:0;transition:transform .4s}
.tr-pile .tr-bk{position:absolute;left:calc(var(--i)*3px);top:calc(var(--i)*-3px);width:80px}
.tr-pile:hover{transform:translateY(-6px)}.tr-pile.chosen{transform:translateY(-22px) scale(1.06)}
.tr-fan{position:relative;width:100%;max-width:420px;height:230px;margin:0 auto}
.tr-fc{position:absolute;left:50%;bottom:0;width:78px;margin-left:-39px;border:none;background:none;padding:0;cursor:pointer;transform-origin:50% 240px;transform:rotate(var(--a));transition:transform .35s;animation:fanIn .6s ease-out both;animation-delay:var(--d)}
.tr-fc .tr-bk{filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.tr-fc:hover{transform:rotate(var(--a)) translateY(-12px)}.tr-fc.sel{transform:rotate(var(--a)) translateY(-30px);filter:drop-shadow(0 0 8px var(--gold))}
@keyframes fanIn{from{opacity:0;transform:rotate(0)}to{opacity:1;transform:rotate(var(--a))}}
.tr-res{display:flex;flex-direction:column;gap:28px;align-items:center}
.tr-one{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%}
.tr-one h3{font-family:var(--serif);font-size:17px;color:var(--gold2);margin:0}
.tr-flip,.tr-card{width:190px;perspective:900px;border:none;background:none;padding:0;display:block}
.tr-flip .tr-in{position:relative;display:block;aspect-ratio:200/320;transform-style:preserve-3d;transition:transform .9s}
.tr-flip .tr-front,.tr-flip .tr-rear{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.tr-flip .tr-rear{transform:rotateY(180deg)}
.tr-flip.flipped .tr-in{transform:rotateY(180deg)}
.tr-flip.ready{cursor:pointer;animation:pulse 1.6s ease-in-out infinite}
.tr-flip.wait{opacity:.55}
@keyframes pulse{50%{filter:drop-shadow(0 0 12px var(--gold))}}
.tr-card{perspective:none}
/* 牌面：1909 原版圖＋深色金框，逆位只轉圖、牌名維持正向 */
.tr-card .tr-face{aspect-ratio:200/320}
.tr-face{position:relative;display:flex;flex-direction:column;width:100%;height:100%;box-sizing:border-box;padding:7px 7px 0;border-radius:10px;background:linear-gradient(160deg,#1C1538,#0B0818);border:1px solid var(--gold);box-shadow:inset 0 0 0 3px #0B0818,inset 0 0 0 4px rgba(212,175,106,.45),0 4px 14px rgba(0,0,0,.55)}
.tr-img{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:5px;background:#0B0818}
.tr-img img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;border-radius:4px;transition:transform .3s}
.tr-img.svg svg{display:block;width:100%;height:100%}
.tr-face.rev .tr-img img,.tr-face.rev .tr-img.svg svg{transform:rotate(180deg)}
.tr-nm{flex:none;display:flex;flex-direction:column;align-items:center;padding:5px 2px 6px;line-height:1.25}
.tr-nm b{font-family:var(--serif);font-size:15px;color:var(--gold2);letter-spacing:1px}
.tr-nm small{font-size:10.5px;color:var(--gold);opacity:.85;letter-spacing:.5px}
.tr-revtag{position:absolute;top:12px;right:12px;padding:1px 8px;border-radius:9px;background:#E89A9A;color:var(--gold-ink);font-size:11.5px;font-weight:700;box-shadow:0 1px 4px rgba(0,0,0,.5)}
.tr-revnote{font-size:13px!important;color:#F0C4C4!important;margin:0}
.tr-mean{width:100%;max-width:520px;display:flex;flex-direction:column;gap:8px;text-align:left}
.tr-mean p{margin:0;font-size:14.5px;line-height:1.85;color:#D8D3F0}
.tr-mean dl{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0;font-size:14px;line-height:1.6}.tr-mean dt{color:var(--gold)}.tr-mean dd{margin:0}
.tr-mh{display:flex;align-items:center;gap:10px}.tr-mh b{font-family:var(--serif);font-size:20px;color:var(--gold2)}
.tr-pos{padding:1px 10px;border-radius:10px;font-size:12px;color:var(--gold-ink)}.tr-pos.up{background:var(--gold)}.tr-pos.rev{background:#E89A9A}
.tr-kw{color:var(--gold)!important;font-size:13px!important}
.tr-mbox{width:100%;display:flex;justify-content:center}
.hs-seg{grid-template-columns:repeat(2,1fr)}
.hs-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.hs-sign{display:flex;flex-direction:column;align-items:center;gap:1px;padding:10px 2px;border-radius:12px;border:1px solid var(--line);background:rgba(22,18,48,.92);color:var(--text);font:inherit;cursor:pointer}
.hs-sign b{font-size:24px;color:var(--gold);font-weight:400}.hs-sign span{font-size:13px}.hs-sign small{font-size:10px;color:var(--muted)}
.hs-sign.on{border-color:var(--gold);background:rgba(212,175,106,.14)}
.hs-card h4,.hs-res h4{font-family:var(--serif);font-size:14px;color:var(--gold);margin:12px 0 2px}
.hs-head{display:flex;align-items:center;gap:12px;margin-bottom:8px}.hs-head h3{margin:0}.hs-head span{font-size:12px;color:var(--muted)}
.hs-sym{font-size:38px;color:var(--gold2);line-height:1}
.hs-stars{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;font-size:13px;color:var(--gold2);margin:6px 0}.hs-off{opacity:.25}
.hs-lucky{display:flex;gap:18px;flex-wrap:wrap;margin-top:12px;font-size:13px;color:var(--muted)}.hs-lucky b{color:var(--gold2)}
.hs-res{margin-top:12px}
#hsBody select,#hsBody input[type=date],#hsBody input[type=time],#hsBody .ymd input{height:46px;padding:0 12px;border-radius:12px;border:1px solid var(--line2);background:#0E0B1F;color:var(--text);font-size:16px;font-family:inherit;color-scheme:dark;min-width:0}
.q-stage>.rt-hold{align-self:center}.q-stage>.rt-sub{text-align:center}   /* 儀式的按鈕與提醒一律置中 */
@media (min-width:1024px){.hs-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.hs-seg{max-width:360px}.tr-res{flex-direction:row;flex-wrap:wrap;align-items:flex-start;justify-content:center}.tr-one{width:auto;max-width:520px}}


/* 第 7 步：風水羅盤、格局圖 */
.lp-wrap{gap:12px}
.lp-read{display:flex;flex-direction:column;align-items:center;gap:2px}.lp-read b{font-family:var(--serif);font-size:34px;color:var(--gold2)}.lp-read span{font-size:14px;color:var(--muted)}
.lp-dial{width:100%;max-width:340px;height:auto;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.lp-dial.locked{filter:drop-shadow(0 0 10px rgba(242,213,151,.5));cursor:default}
.lp-c1{fill:rgba(14,11,31,.7);stroke:var(--gold);stroke-width:1.2}.lp-c2{fill:none;stroke:var(--line3);stroke-width:.6}
.lp-tk{stroke:var(--gold);stroke-width:.5;opacity:.7}.lp-tk.b{stroke-width:1;opacity:1}
.lp-dg{font-size:8px;fill:var(--muted)}.lp-mt{font-family:var(--serif);font-size:13px;font-weight:700}.lp-mt.y{fill:#F2D597}.lp-mt.n{fill:#C9C2E6}
.lp-ed{stroke:var(--line3);stroke-width:.5}.lp-ed.g{stroke:var(--gold);stroke-width:1}
.lp-gu{font-size:15px;fill:var(--gold)}.lp-gn{font-family:var(--serif);font-size:8px;fill:var(--muted)}
.lp-ptr{fill:var(--gold2)}.lp-cross{stroke:var(--gold2);stroke-width:1;stroke-linecap:round}.lp-dot{fill:var(--gold2)}
.lp-ctl{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;max-width:360px}
.lp-man{display:flex;flex-direction:column;gap:8px;width:100%}.lp-man[hidden]{display:none}
.lp-man input[type=number]{height:46px;padding:0 14px;border-radius:12px;border:1px solid var(--line2);background:#0E0B1F;color:var(--text);font-size:16px;font-family:inherit}
.lp-man input[type=range],.pl-side input[type=range]{width:100%;accent-color:var(--gold)}
.lp-door svg{width:110px;height:auto}.lp-d1{fill:none;stroke:var(--gold);stroke-width:1.5}.lp-d2{fill:none;stroke:var(--gold2);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.lp-eight{width:100%;max-width:300px;height:auto}.lp-8p{fill:none;stroke:var(--line3);stroke-width:1.2;stroke-dasharray:3 4}.lp-8d{fill:var(--gold2);filter:drop-shadow(0 0 5px var(--gold))}
.lp-res{display:flex;flex-direction:column;gap:14px}
.lp-stamp-wrap{display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 0}
.lp-stamp{display:flex;flex-direction:column;align-items:center;padding:12px 26px;border:3px solid #C4553B;border-radius:8px;color:#E8806A;transform:rotate(-5deg);font-family:var(--serif);box-shadow:inset 0 0 0 2px rgba(196,85,59,.35)}
.lp-stamp small{font-size:12px;letter-spacing:4px}.lp-stamp b{font-size:34px;letter-spacing:6px}
.lp-stamp.go{animation:stamp .7s cubic-bezier(.2,1.4,.4,1) both}
@keyframes stamp{from{opacity:0;transform:rotate(-14deg) scale(2.8)}to{opacity:1;transform:rotate(-5deg) scale(1)}}
.lp-deg{margin:0;font-size:14px;color:var(--muted)}.lp-deg b{color:var(--gold2);font-family:var(--serif)}
.lp-ht{margin:4px 0 0;font-size:13px;color:var(--gold)}
/* 專業三元盤：盤面整塊用 CSS 旋轉（只產生一次），指針與十字線疊在上面不動 */
.lp-pdial{position:relative;width:100%;max-width:440px;aspect-ratio:1;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}
.lp-pdial.locked{filter:drop-shadow(0 0 10px rgba(242,213,151,.5));cursor:default}
.lp-rot{position:absolute;inset:0;will-change:transform;transform-origin:50% 50%}
.lp-rot img,.lp-over{position:absolute;inset:0;width:100%;height:100%;display:block}
.lp-rot img{pointer-events:none;-webkit-user-drag:none;user-select:none}
.lp-pdial{contain:layout paint}
.lp-over{pointer-events:none}
.lp-pread{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;width:100%;max-width:440px}
.lp-pread>div{display:flex;flex-direction:column;align-items:center;padding:6px 2px;border:1px solid var(--line);border-radius:8px;background:rgba(14,11,31,.7);text-align:center}
.lp-pread small{font-size:10.5px;color:var(--muted)}.lp-pread b{font-family:var(--serif);font-size:13px;color:var(--gold2);font-weight:600;line-height:1.3}
.lp-ptab{width:100%;border-collapse:collapse;font-size:14px}.lp-ptab th,.lp-ptab td{padding:7px 6px;border-bottom:1px solid var(--line);text-align:left}
.lp-ptab thead th{color:var(--gold);font-weight:600;font-size:13px}.lp-ptab tbody th{color:var(--muted);font-weight:400;white-space:nowrap}
.lp-q{margin:0 0 8px;font-size:14px;color:var(--muted)}
.lp-guide{margin:12px 0;font-size:14.5px;line-height:1.75}.lp-guide small{display:block;margin-top:4px;font-size:12.5px;color:var(--muted);line-height:1.6}
.lp-bz{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;max-width:320px;margin:0 auto}
.lp-bz>div{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;border-radius:10px;border:1px solid var(--line);background:rgba(14,11,31,.7)}
.lp-bz small{font-size:10.5px;color:var(--muted)}.lp-bz b{font-family:var(--serif);font-size:16px;color:#C9A39A}.lp-bz .g b{color:var(--gold2)}.lp-bz .g{border-color:var(--gold)}.lp-bz .c b{color:var(--text)}
.lp-house{padding:8px 4px 8px 14px}
.pl-wrap{display:flex;flex-direction:column;gap:14px}.pl-side{display:flex;flex-direction:column;gap:14px}.pl-main{order:-1}
.pl-canvas{position:relative;width:100%;aspect-ratio:1;border-radius:14px;overflow:hidden;border:1px solid var(--line3);background:#0B0818}
.pl-canvas svg{display:block;width:100%;height:100%;touch-action:none}
.pl-empty{position:absolute;inset:0;margin:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:14px;pointer-events:none}.pl-empty[hidden]{display:none}
.pl-file{display:flex;align-items:center;justify-content:center;cursor:pointer;margin-top:2px}
.pl-btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.pl-sel{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--muted)}
.pl-sel select,#plH,#plY{height:40px;padding:0 10px;border-radius:10px;border:1px solid var(--line2);background:#0E0B1F;color:var(--text);font-size:15px;font-family:inherit}
.pl-pat{margin-top:10px;font-size:13.5px;line-height:1.7;color:#D8D3F0}.pl-pat p{margin:0 0 6px}
.pl-r{fill:rgba(14,11,31,.55);stroke:#D4AF6A;stroke-width:1;vector-effect:non-scaling-stroke}.pl-r.w{stroke:#F2D597;stroke-width:2}
.pl-g{fill:#F2D597;opacity:.9}.pl-s{fill:#F2D597;font-family:var(--serif);font-weight:900}.pl-x{fill:#fff;font-family:var(--serif);font-weight:900}.pl-y{fill:#C9C2E6}
.pl-t text{paint-order:stroke;stroke:rgba(11,8,24,.75);stroke-width:2px;stroke-linejoin:round}
.pl-tabs{margin:0 0 14px}.pl-wrap [hidden],.pl-main [hidden]{display:none!important}
.pl-grid{width:100%;max-width:520px;margin:0 auto}
.pl-gtop,.pl-gbot{margin:0;text-align:center;font-size:12.5px;color:var(--gold)}.pl-gtop{margin-bottom:6px}.pl-gbot{margin-top:6px;color:var(--muted)}
.pl-g9{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.pl-c{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:112px;padding:8px 4px;border-radius:10px;border:1px solid var(--line2);background:rgba(14,11,31,.75);color:var(--text);font-family:inherit;cursor:pointer;text-align:center}
.pl-c.w{border-color:var(--gold2);box-shadow:inset 0 0 0 1px rgba(242,213,151,.35)}
.pl-cn{font-size:11.5px;color:var(--gold)}
.pl-cs{display:flex;gap:12px;font-family:var(--serif);font-weight:900;font-size:24px;line-height:1.1}.pl-cs i{font-style:normal}.pl-cs .s{color:#F2D597}.pl-cs .x{color:#fff}
.pl-cy{font-size:10.5px;color:#C9C2E6}
.pl-cr{display:flex;flex-wrap:wrap;justify-content:center;gap:3px;margin-top:3px}.pl-cr em{font-style:normal;font-size:11px;padding:1px 6px;border-radius:8px;background:var(--gold);color:var(--gold-ink)}.pl-cr small{font-size:10.5px;color:var(--muted)}
.pl-rooms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 10px}
.pl-walk{display:flex;flex-direction:column;align-items:center;gap:2px;margin:8px 0 12px}.pl-walk b{font-family:var(--serif);font-size:30px;color:var(--gold2)}.pl-walk span{font-size:13.5px;color:var(--muted)}
.pl-rm{fill:#F2D597;font-weight:700}
.pl-mk{stroke:#fff;stroke-width:1;vector-effect:non-scaling-stroke}.pl-mk.c{fill:#7FD18B}.pl-mk.d{fill:#F08A6A}
@media (min-width:1024px){.pl-wrap{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);gap:24px;align-items:start}.pl-main{order:0;position:sticky;top:20px}.pl-canvas{max-width:760px}.lp-wrap{padding-top:10px}.lp-dial{max-width:420px}}


/* 第 8 步：玄問解惑與付費解讀（推演中儀式、展卷） */
.pd-ov{position:fixed;inset:0;z-index:85;display:flex;align-items:center;justify-content:center;background:rgba(10,8,24,.992);transition:opacity .35s}
.pd-ov.out{opacity:0}
.pd-wait{display:flex;flex-direction:column;align-items:center;gap:16px;padding:24px;width:min(88vw,420px);text-align:center}
.pd-compass{width:210px;height:210px}
.pd-compass circle{fill:none;stroke:var(--gold);stroke-width:1.2}.pd-compass circle.d{stroke:var(--line3);stroke-width:.6}.pd-compass line{stroke:var(--gold);stroke-width:.8}
.pd-spin{transform-origin:100px 100px;animation:pdspin 28s linear infinite}
@keyframes pdspin{to{transform:rotate(360deg)}}
.pd-star{fill:#3a3160;animation:pdstar 5.4s ease-in-out infinite}
@keyframes pdstar{0%,60%,100%{fill:#3a3160}30%{fill:#F2D597}}
.pd-needle{fill:var(--gold2);transform-origin:100px 100px;animation:pdneedle 6s ease-in-out infinite}
@keyframes pdneedle{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(14deg)}}
.pd-h{font-family:var(--serif);font-size:22px;color:var(--gold2);margin:0;letter-spacing:6px}
.pd-line{margin:0;font-size:16px;color:#D8D3F0;min-height:28px}.pd-line.in{animation:pdfade 1.1s ease both}
@keyframes pdfade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.pd-read{padding:16px}
.pd-card{position:relative;width:min(100%,660px);max-height:calc(100vh - 32px);display:flex;flex-direction:column;border-radius:16px;border:1px solid var(--gold);background:linear-gradient(180deg,#2a2146,#1c1636);box-shadow:0 0 0 6px rgba(212,175,106,.08)}
.pd-body{overflow-y:auto;padding:34px 22px 12px;scroll-behavior:smooth}
.pd-after{padding:10px 22px 22px;display:flex;flex-direction:column}
.pd-after.hid{display:none}
.pd-x{top:8px;right:8px;z-index:2}
.pd-title{font-family:var(--serif);font-size:24px;color:var(--gold2);text-align:center;margin:0 0 16px;line-height:1.4}
/* 人事時地物重點卡 */
.pd-focus{border:1px solid rgba(212,175,106,.45);border-radius:14px;background:rgba(212,175,106,.06);padding:10px 14px;margin:0 0 18px}
.pd-fo{display:grid;grid-template-columns:28px 1fr;gap:8px;align-items:baseline;padding:6px 0;border-bottom:1px dashed rgba(212,175,106,.18)}
.pd-fo:last-child{border-bottom:none}
.pd-fo b{font-family:var(--serif);color:var(--gold2);font-size:16px;text-align:center}
.pd-fo span{font-size:14px;line-height:1.7;color:#E6E1F7}
/* 時間、關係選擇（可換行的小按鈕） */
.pd-per{display:flex;flex-wrap:wrap;gap:8px}
.pd-per .chip.on,.chip.on{border-color:var(--gold);color:var(--gold2);background:rgba(212,175,106,.12)}
/* 合盤 */
.sn-form{display:flex;flex-direction:column;gap:14px}
.sn-ab{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:end}
.sn-ab .field{min-width:0}
.sn-x{font-family:var(--serif);color:var(--gold2);font-size:22px;padding-bottom:10px}
.sn-res h3{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sn-res h3 .sn-st{color:var(--gold2);letter-spacing:2px;font-size:15px;margin:0;font-family:var(--sans)}
.sn-res h3 .sn-st span{font-size:inherit;margin:0;color:inherit}
.sn-li{margin:6px 0 0;padding:0;list-style:none}
#snOut .card{margin-top:12px}
#snOut .btn-gold{margin-top:16px}
#sheet .pd-per{margin-bottom:12px}
.sn-li li{font-size:14px;line-height:1.7;color:#D8D3F0;padding:4px 0}
.sn-li b{display:block;font-size:12px;color:var(--muted);font-weight:400}
.pf-rel{font-family:var(--sans);font-size:11px;font-weight:400;color:var(--gold2);border:1px solid rgba(212,175,106,.4);border-radius:8px;padding:0 6px;margin-left:6px;vertical-align:2px}
.pd-sec{margin-bottom:16px}.pd-sec h3{font-family:var(--serif);font-size:17px;color:var(--gold2);margin:0 0 6px}
.pd-sec p{margin:0 0 8px;font-size:15px;line-height:1.9;color:#D8D3F0}
.pd-note{text-align:center;margin-top:8px}
.rec-body .pd-title{font-size:20px}

/* ═══ 電腦版（寬度 ≥ 1024px 才生效；手機、平板直向完全不變） ═══
 * 共用外框與 class（之後新增的頁面直接套用，不要另外寫桌面外框）：
 *   外框    .app 左側有固定側欄（.topbar 標誌＋.tabbar 五個主選單＋.dk-points 點數按鈕），主內容 #view 最寬約 1180px 置中
 *   清單    #view 裡的 .list 在桌面自動變兩欄卡片；.grid3 在桌面變一排 6 格
 *   兩欄    .dk-2col 裡放兩個 .dk-b：桌面左右並排，手機自動直向堆疊（display:contents，順序＝原始順序）
 *   側欄    .dk-side（放在 .dk-2col 的右邊那個 .dk-b 上）：桌面 sticky，內容太長自己捲動
 *   卡片組  .dk-cards：桌面兩欄卡片，.card.hl 橫跨整排
 *   面板    #sheet 桌面是置中對話框（寬約 520px）；#tour 首次導覽也置中
 * 手機版這些 class 都不產生任何版面（只是 display:contents），因此手機畫面維持原樣。
 */
@media (max-width:1023.98px){
  .dk-2col,.dk-b,.dk-ctrl,.dk-cards{display:contents}
  .dk-zw .dk-main>*{order:1}
  .dk-zw .dk-side>:not(.dk-ctrl){order:2}
  .dk-points{display:none}
}
@media (min-width:1024px){
  :root{--dk-side:240px}
  body{font-size:16px}
  .app{max-width:none;margin:0;padding:36px 48px 56px calc(var(--dk-side) + 48px)}
  .app::before{content:"";position:fixed;left:0;top:0;bottom:0;width:var(--dk-side);background:rgba(18,14,40,.94);border-right:1px solid var(--line);z-index:0}
  .topbar{position:fixed;left:0;top:0;width:var(--dk-side);z-index:21;margin:0;padding:26px 24px 18px}
  .topbar .points{display:none}
  .brand-zh{font-size:28px}
  .tabbar{position:fixed;left:0;top:104px;bottom:auto;right:auto;width:var(--dk-side);height:auto;max-width:none;margin:0;z-index:21;
    padding:6px 14px;display:flex;flex-direction:column;gap:6px;background:none;border:none;border-radius:0;backdrop-filter:none;-webkit-backdrop-filter:none}
  .tabbar a{flex-direction:row;justify-content:flex-start;gap:14px;padding:13px 16px;border-radius:12px;border:1px solid transparent;font-size:16px;color:#B5AED2}
  .tabbar a svg{width:22px;height:22px}
  .tabbar a:hover{background:rgba(255,255,255,.04)}
  .tabbar a.on{background:rgba(212,175,106,.12);border-color:rgba(212,175,106,.45);color:var(--gold)}
  .dk-points{position:fixed;left:24px;bottom:26px;width:calc(var(--dk-side) - 48px);height:46px;border-radius:23px;justify-content:center;font-size:15px;z-index:21;cursor:pointer}
  .dk-points:hover{background:#2C2455}
  .view{max-width:1180px;margin:0 auto;gap:22px}
  .toast{bottom:32px;left:calc(50% + var(--dk-side) / 2);font-size:15px}

  /* 文字大一級 */
  .page-h{font-size:30px}
  .page-sub{font-size:16px}
  .ask{padding:22px 24px}
  .ask-head label{font-size:22px}
  .ask textarea{font-size:17px;min-height:76px}
  .ask-foot small{font-size:13px}
  .chips{margin:0;padding:0;flex-wrap:wrap;overflow:visible}
  .chip{height:40px;font-size:14px;padding:0 18px}
  .sec-title{font-size:17px}
  .grid3{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
  .mod{min-height:104px;padding:16px;border-radius:16px}
  .mod b{font-size:18px}
  .mod span{font-size:12.5px}
  .mod svg{width:30px;height:30px}
  .mod:hover,.row:hover,.dy:hover,.chip:hover{border-color:var(--gold)}
  .view .list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .row{min-height:72px;padding:14px 18px}
  .row .t b{font-size:16px}
  .row .t span{font-size:13px}
  .note{font-size:13px}
  .card{padding:20px 22px;border-radius:18px}
  .card h3{font-size:19px}
  .card p{font-size:15.5px}
  .card dl{font-size:15px}
  .h3{font-size:18px}
  .h3 small{font-size:12px}
  .seg{max-width:460px}
  .seg a{min-height:44px;font-size:16px}
  .pf-t b{font-size:19px}
  .pf-t span{font-size:13px}

  /* 兩欄 */
  .dk-2col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
  .dk-b{display:flex;flex-direction:column;gap:14px;min-width:0}
  .dk-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:stretch}
  .dk-cards .card.hl{grid-column:1/-1}

  /* 紫微：左命盤、右 sticky 側欄 */
  .dk-zw{grid-template-columns:minmax(0,720px) minmax(340px,1fr)}
  .dk-side{position:sticky;top:20px;max-height:calc(100vh - 40px);overflow-y:auto;padding-right:2px;scrollbar-width:thin;scrollbar-color:var(--line3) transparent}
  .dk-ctrl{display:flex;flex-direction:column;gap:14px}
  .zgrid{grid-template-rows:repeat(4,minmax(158px,auto));margin:0}
  .zp{padding:7px 6px 5px;gap:3px}
  .st.maj{font-size:17px}
  .st.good,.st.bad,.st.mi{font-size:13px}
  .st em{font-size:10.5px}
  .hz{width:17px;height:17px;font-size:11.5px}
  .zf{font-size:12px}
  .zl{font-size:13px}
  .zb{font-size:12px;padding-top:3px}
  .zb b{font-size:16px}
  .shen{font-size:11px}
  .zc{font-size:14px;gap:5px;padding:14px}
  .zc-n{font-size:24px}
  .zlegend{font-size:13px}
  .zstrip{font-size:14.5px}
  .zd dl{font-size:14.5px}

  /* 八字 */
  .bz,.mt{font-size:15px}
  .bz th,.bz td,.mt th,.mt td{padding:9px 6px}
  .bz tr.big td b{font-size:32px}
  .bz thead th,.mt thead th{font-size:16px}
  .bz small,.mt small{font-size:12px}
  .wxi .wx{font-size:22px}
  .kv span{font-size:12.5px}
  .kv b{font-size:18px}
  .dyrow{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px;margin:0;padding:8px 0 0;overflow:visible}
  .dy{width:auto;min-width:0}
  .dy b{font-size:22px}
  .lngrid{grid-template-columns:repeat(10,minmax(0,1fr));gap:8px}
  .ln b{font-size:19px}
  .ln span{font-size:11.5px}
  .ln small{font-size:11px}
  .yr b{font-size:18px}
  .fsgrid{max-width:520px}
  .fs b{font-size:28px}
  .tsl span{font-size:18px}

  /* 彈出面板：置中對話框 */
  .sheet{align-items:center}
  .sheet-card{max-width:520px;max-height:86vh;padding:30px 28px;border:1px solid var(--line2);border-radius:22px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
  .sheet h2{font-size:22px}
  .sheet p{font-size:15px}
  .wl{max-height:40vh}

  /* 首次導覽 */
  .tour-card{max-width:520px;padding:34px 32px 26px}
  .tour-art{height:150px}
  .tour-art svg{width:136px;height:136px}
  .tour-title{font-size:25px}
  .tour-text{font-size:16.5px}

  /* 啟動畫面 */
  .splash-logo{width:150px;height:150px}
  .splash .brand-zh{font-size:44px;letter-spacing:14px;padding-left:14px}
  .splash .brand-en{font-size:13px}
  .sp-slogan{font-size:17px}
  .sp-ic span{width:64px;height:64px}
  .sp-ic svg{width:29px;height:29px}
  .sp-ic b{font-size:14px}
  .sp-rays{width:900px;height:900px}
}
/* 程式載入前（搜尋引擎）看到的功能連結 */
.seo-links{list-style:none;padding:0;margin:16px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.seo-links a{display:inline-block;border:1px solid var(--line2);border-radius:999px;padding:4px 12px;color:var(--gold2);text-decoration:none;font-size:14px}
.form .flabel{font-size:13px;color:var(--muted)}
.xc-ask{margin-top:18px}
.xc-chips{margin-top:10px}
.ask-foot .btn-gold{flex:none;white-space:nowrap}
.form [hidden]{display:none!important}
/* 姓名學、測字 */
.xn-in{display:grid;grid-template-columns:1fr 1.4fr;gap:10px}
.xn-form{display:flex;flex-direction:column;gap:12px}
.xn-head{display:flex;flex-direction:column;align-items:center;gap:10px}
.xn-chars{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.xn-ch{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:58px;padding:10px 8px;border-radius:14px;border:1px solid var(--line2);background:rgba(14,11,31,.55)}
.xn-ch b{font-family:var(--serif);font-size:30px;line-height:1.2;color:var(--text)}
.xn-ch.sur b{color:var(--gold2)}
.xn-ch span{font-size:12px;color:var(--muted)}
.xn-ch .wx,.xn-yong .wx{font-style:normal;font-size:12px;padding:0 6px;border-radius:8px;margin:0 2px}
.xn-score{display:flex;align-items:baseline;gap:6px}
.xn-score b{font-family:var(--serif);font-size:40px;color:var(--gold2);line-height:1}
.xn-score span{color:var(--muted);font-size:14px}
.xn-score em{font-style:normal;margin-left:8px;color:var(--gold)}
.xn-five{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.xn-five li{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.xn-five li:last-child{border-bottom:none;padding-bottom:0}
.xn-fk b{font-size:15px}
.xn-fk small{display:block;font-size:12px;color:var(--muted)}
.xn-fv{display:flex;align-items:center;gap:8px}
.xn-fv b{font-family:var(--serif);font-size:22px;color:var(--gold2)}
.xn-five p{grid-column:1/-1;margin:0;font-size:13px;color:#D8D3F0}
.lk{font-style:normal;font-size:12px;padding:1px 8px;border-radius:9px;border:1px solid var(--line2)}
.lk2{color:#9BE3B0;border-color:rgba(155,227,176,.5)}
.lk1{color:var(--gold2);border-color:rgba(212,175,106,.5)}
.lk0{color:#F2A0A0;border-color:rgba(242,160,160,.5)}
.xn-combo{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.xn-combo li{padding:10px 12px;border-radius:12px;background:rgba(14,11,31,.55);border:1px solid var(--line)}
.xn-combo li div{display:flex;justify-content:space-between;gap:8px}
.xn-combo li div span{color:var(--gold);font-size:13px}
.xn-combo p{margin:6px 0 0;font-size:15px;letter-spacing:2px;word-break:break-all}
.xn-combo p small{letter-spacing:0;color:var(--muted);font-size:12px;margin-right:8px}
.cz-c{text-align:center;font-family:var(--serif);font-size:34px !important;height:64px !important;max-width:120px;margin:0 auto}
.cz-q{width:100%;resize:none;padding:10px 14px;border-radius:12px;border:1px solid var(--line2);background:#0E0B1F;color:var(--text);font-size:16px;font-family:inherit;line-height:1.6}
.cz-res{text-align:center}
.cz-res .sn-li{text-align:left}
.cz-big{font-family:var(--serif);font-size:88px;line-height:1.1;color:var(--gold2);text-shadow:0 0 24px rgba(212,175,106,.35)}
.xn-ch .wx,.xn-yong .wx{border:1px solid currentColor}