/* ============================================================
 * chart-render.css — 命盤渲染子系統樣式
 * ------------------------------------------------------------
 * 由 legacy/styles.css 抽離,專供 chart-render.js 產出的 markup 使用:
 *   · 紫微 12 宮 grid (.ziwei-*)
 *   · 八字一般卡 (.bazi-*, .wx-*) + 八字詳細表 (.bz2-*)
 *   · 西洋占星 SVG 輪盤 (.astro-*)
 *   · 印度吠陀北印度菱形 SVG (.vedic-*, .vh-*, .vc-*)
 *   · 命盤容器 / loading / 切換 (.chart-*, .msg--chart, .seg-btn)
 *
 * 沿用 legacy :root 靛金色系變數(下方一併內含,確保此檔可獨立掛載)。
 * 類別名稱與 legacy 完全一致,抽出的 HTML 不需修改即可套用。
 * ============================================================ */

/* ----------------------------------------------------------
 * 色系 + 字體變數(摘自 legacy styles.css :root)
 * 若宿主頁面已定義同名 --token,這裡會被覆蓋為一致值;單獨掛載時也能用。
 * ---------------------------------------------------------- */
:root {
  --bg-void:        #07061a;
  --bg-deepest:     #0c0a26;
  --bg-deep:        #14102e;
  --bg-mid:         #1f1845;
  --bg-soft:        #2a2160;

  --gold:           #d9b14a;
  --gold-bright:    #f0c860;
  --gold-pale:      #ead49a;
  --vermillion:     #c43d3e;
  --vermillion-bright: #e84a4b;
  --rose:           #e8a4b0;
  --jade:           #67ab8c;
  --plum:           #8b3a6e;
  --indigo:         #4b3e8e;
  --cream:          #f0e4c8;
  --paper:          #e8d9b2;
  --paper-deep:     #c9b380;
  --ink:            #1a0f0a;
  --ink-soft:       #3a261a;

  --font-cjk-fallback: 'Noto Serif TC', 'Noto Sans TC', 'PingFang TC', 'Microsoft JhengHei',
                       'Heiti TC', 'Microsoft YaHei', 'SimSun', sans-serif;
  --font-brush:    'Destiny Brush', 'Ma Shan Zheng', 'Liu Jian Mao Cao', 'Long Cang', 'Zhi Mang Xing', var(--font-cjk-fallback);
  --font-serif:    var(--font-cjk-fallback);
  --font-display:  var(--font-cjk-fallback);
  --font-italic:   var(--font-cjk-fallback);
  --font-zcool:    var(--font-cjk-fallback);
}

/* ----------------------------------------------------------
 * 命盤容器 — flex 置中,SVG 盤面自然縮放;紫微 grid 固定寬 + 置中。
 * (摘自 legacy 行動版 .msg--chart .chart-container 規則,套用在所有寬度)
 * ---------------------------------------------------------- */
.msg--chart .chart-container {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow: visible;
  margin: 0;
  padding: 0;
  width: 100%;
}

/* The chart message — wide, breaks the usual max-width */
.msg--chart {
  max-width: 100% !important;
  align-self: stretch !important;
  background: transparent !important;
  border: none !important;
}
.msg--chart::before { display: none; }

/* ----------------------------------------------------------
 * Chart loading 佔位(起盤等待)
 * ---------------------------------------------------------- */
.msg--chart-loading .chart-loading-body {
  display: flex; flex-direction: column; align-items: flex-start; gap: 0.6rem;
  padding: 0.3rem 0;
}
.chart-loading-spinner {
  display: flex; gap: 0.4rem;
}
.chart-loading-spinner span {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--gold-bright);
  box-shadow: 0 0 8px rgba(240,200,96,0.5);
  animation: chart-pulse 1.4s ease-in-out infinite;
}
.chart-loading-spinner span:nth-child(2) { animation-delay: 0.18s; background: var(--accent, #7a6cf0); box-shadow: 0 0 8px var(--accent, rgba(122,108,240,0.5)); }
.chart-loading-spinner span:nth-child(3) { animation-delay: 0.36s; background: var(--vermillion); box-shadow: 0 0 8px rgba(196,61,62,0.5); }
.chart-loading-spinner span:nth-child(4) { animation-delay: 0.54s; }
@keyframes chart-pulse {
  0%,100% { transform: scale(0.6); opacity: 0.4; }
  50%     { transform: scale(1.2); opacity: 1; }
}
.chart-loading-text {
  font-family: var(--font-zcool); letter-spacing: 0.12em;
  color: var(--cream); margin: 0;
}
.chart-loading-sub {
  font-family: var(--font-italic); font-style: italic;
  color: var(--gold-pale); opacity: 0.65; font-size:calc(0.8rem * var(--fz,1)); margin: 0;
}

/* ============================================================
   紫微斗數 — 12 宮 4×4 grid
   ============================================================ */
.ziwei-chart {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(4, 1fr);
  aspect-ratio: 1;
  width: 100%;
  max-width: 720px;
  margin: 0.6rem auto;
  background:
    radial-gradient(ellipse at center, rgba(122,108,240,0.18) 0%, transparent 65%),
    linear-gradient(135deg, rgba(31,24,69,0.92) 0%, rgba(14,11,46,0.95) 100%);
  border: 1.5px solid rgba(240,200,96,0.45);
  padding: 6px;
  gap: 4px;
  box-shadow:
    0 0 40px rgba(122,108,240,0.25),
    inset 0 0 30px rgba(0,0,0,0.5),
    0 20px 40px rgba(0,0,0,0.5);
}

.ziwei-chart::before {
  content: '';
  position: absolute; inset: 12px;
  border: 1px dashed rgba(240,200,96,0.2);
  pointer-events: none;
  z-index: 0;
}

.ziwei-cell {
  background: linear-gradient(180deg, rgba(14,11,46,0.6) 0%, rgba(7,6,26,0.85) 100%);
  border: 1px solid rgba(240,200,96,0.18);
  padding: 6px 7px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: var(--font-serif);
  position: relative;
  z-index: 1;
  cursor: pointer;
  transition: all 0.25s;
  overflow: hidden;
  min-height: 0;
  font-size:calc(0.7rem * var(--fz,1));
}
.ziwei-cell::after {
  content: '';
  position: absolute;
  top: 2px; left: 2px; right: 2px; bottom: 2px;
  border: 1px solid rgba(240,200,96,0.08);
  pointer-events: none;
  transition: all 0.25s;
}
.ziwei-cell:hover {
  background: linear-gradient(180deg, rgba(31,24,69,0.85) 0%, rgba(14,11,46,0.95) 100%);
  border-color: var(--gold-bright);
  box-shadow: 0 0 16px rgba(240,200,96,0.35);
  transform: translateY(-1px);
}
.ziwei-cell:hover::after { border-color: rgba(240,200,96,0.35); }

.ziwei-cell--empty {
  cursor: default;
  opacity: 0.5;
  align-items: center; justify-content: center;
}
.ziwei-cell--empty:hover { transform: none; box-shadow: none; border-color: rgba(240,200,96,0.18); }

.ziwei-cell-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 1px solid rgba(240,200,96,0.15);
  padding-bottom: 3px;
  margin-bottom: 2px;
}
.ziwei-name {
  font-family: var(--font-brush);
  font-size:calc(0.95rem * var(--fz,1));
  color: var(--cream);
  letter-spacing: 0.04em;
}
.ziwei-ganzhi {
  font-family: var(--font-zcool);
  font-size:calc(0.7rem * var(--fz,1));
  color: var(--gold-pale);
  letter-spacing: 0.1em;
  opacity: 0.85;
}
.ziwei-branch {
  font-family: var(--font-brush);
  font-size:calc(1.4rem * var(--fz,1));
  color: var(--gold-pale);
  opacity: 0.4;
}

.ziwei-stars {
  display: flex; flex-direction: column; gap: 2px;
  flex: 1;
  min-height: 0;
}
.ziwei-stars-row {
  display: flex; flex-wrap: wrap; gap: 3px;
  line-height: 1.2;
}
.ziwei-stars-row--minor { opacity: 0.85; }

.star {
  display: inline-block;
  padding: 1px 4px;
  font-family: var(--font-zcool);
  font-size:calc(0.72rem * var(--fz,1));
  letter-spacing: 0.05em;
  border-radius: 2px;
  white-space: nowrap;
}
.star--main {
  color: #f0e4c8;
  background: linear-gradient(180deg, rgba(122,108,240,0.45), rgba(91,75,168,0.3));
  border: 0.5px solid rgba(122,108,240,0.6);
  font-weight: 500;
  font-size:calc(0.78rem * var(--fz,1));
  padding: 1px 5px;
}
.star--aux {
  color: var(--jade);
  border: 0.5px solid rgba(103,171,140,0.45);
  background: rgba(103,171,140,0.1);
}
.star--sha {
  color: var(--vermillion-bright);
  border: 0.5px solid rgba(232,74,75,0.45);
  background: rgba(232,74,75,0.08);
}
.star--trans {
  color: #1a0f0a;
  background: linear-gradient(180deg, var(--gold-bright), var(--gold));
  border: 0.5px solid var(--gold);
  font-weight: 600;
  font-size:calc(0.7rem * var(--fz,1));
}
.star--empty {
  color: var(--gold-pale);
  opacity: 0.4;
  font-style: italic;
  font-size:calc(0.7rem * var(--fz,1));
}
.star--minor {
  color: var(--rose);
  border: 0.5px solid rgba(232,164,176,0.35);
  background: rgba(232,164,176,0.06);
  font-size:calc(0.62rem * var(--fz,1));
  padding: 0 3px;
  opacity: 0.85;
}

/* 主星廟旺利陷綴字 */
.star-b {
  font-size:calc(0.6em * var(--fz,1));
  margin-left: 1.5px;
  font-weight: 400;
  letter-spacing: 0;
  vertical-align: 1px;
}
.star-b--miao { color: var(--gold-bright); }
.star-b--wang { color: var(--gold); }
.star-b--li   { color: var(--gold-pale); }
.star-b--ping { color: #b6a98c; }
.star-b--xian { color: var(--vermillion-bright); opacity: 0.85; }

/* 四環十二神(長/博/將/歲) */
.ziwei-gods { gap: 2px 5px; opacity: 0.72; }
.ziwei-gods .god {
  font-family: var(--font-zcool);
  font-size:calc(0.56rem * var(--fz,1));
  color: var(--gold-pale);
  white-space: nowrap;
  letter-spacing: 0.03em;
}
.ziwei-gods .god em { font-style: normal; opacity: 0.55; margin-right: 1px; }

/* ===== 專業排版命盤(zc-*) ===== */
/* 固定設計寬度:每格內容照此寬排好,再由 fitChartsToViewport 整體等比縮放塞進螢幕 */
/* 顯式 height(不靠 aspect-ratio:本命盤格子內容變少時,iOS Safari 的 aspect-ratio 會算不出 700 高度 → 整盤壓歪) */
.ziwei-chart--pro { position: relative; width: 700px; max-width: 700px; height: 700px; }
.zopp { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; }
.zopp line.opp { stroke: rgba(255,236,240,.98); stroke-width: 1.5; stroke-dasharray: 6 4; }
.zopp line.tri { stroke: rgba(255,249,231,.95); stroke-width: 1.4; stroke-dasharray: 5 5; }
.zc {
  position: relative; z-index: 1; overflow: hidden; cursor: pointer;
  min-height: 0;   /* 關鍵:讓格子被 grid 列框住,內容過長則內縮,不撐爆正方盤 */
  background: linear-gradient(180deg, rgba(14,11,46,.6), rgba(7,6,26,.85));
  border: 1px solid rgba(240,200,96,.16); padding: 6px 7px;
  display: flex; flex-direction: column;
  transition: border-color .18s, box-shadow .18s, background .18s;
}
.zc:hover { border-color: rgba(240,200,96,.5); }
.zc.on { border-color: var(--gold-bright); box-shadow: 0 0 14px rgba(240,200,96,.3) inset; z-index: 4; }
.zc.rel { border-color: rgba(240,200,96,.55); }
.zc--empty { background: linear-gradient(180deg,rgba(14,11,46,.4),rgba(7,6,26,.6)); border: 1px solid rgba(240,200,96,.1);
  display: grid; place-items: center; opacity: .5; }
.zc-cs { position: absolute; top: 6px; right: 8px; font-size:calc(.56rem * var(--fz,1)); color: var(--gold-pale); opacity: .65; }
.zc-gz { position: absolute; bottom: 6px; right: 7px; writing-mode: vertical-rl; text-orientation: upright;
  font-family: var(--font-brush); font-size:calc(.92rem * var(--fz,1)); color: var(--gold-pale); opacity: .5; letter-spacing: 1px; line-height: 1; }
.zc-hd { display: flex; align-items: center; gap: 4px; }
.zc-nm { font-family: var(--font-brush); font-size:calc(.9rem * var(--fz,1)); color: var(--cream); letter-spacing: .03em; }
.zc-tag { font-size:calc(.72rem * var(--fz,1)); font-weight: 700; padding: 0 2px; border-radius: 4px; line-height: 1.15; color: var(--gold-pale);
  border: 1px solid var(--gold-deep); background: rgba(217,177,74,.12); }
.zc-tag--ming { color: #1a0f0a; background: linear-gradient(180deg,var(--gold-bright),var(--gold)); border-color: var(--gold); }
.zc-stars { display: flex; gap: 5px; margin-top: 2px; padding-right: 14px; }
.zstar { display: flex; flex-direction: column; align-items: center; gap: 1px; }
.zstar .nm { writing-mode: vertical-rl; text-orientation: upright; font-family: var(--font-brush); line-height: 1.02; letter-spacing: 1px; }
.zstar--main .nm { font-size:calc(.94rem * var(--fz,1)); color: #e9ddf6; }
.zstar--aux .nm { font-size:calc(.8rem * var(--fz,1)); color: var(--jade); }
.zstar--sha .nm { font-size:calc(.8rem * var(--fz,1)); color: #e98a8b; }
.zbr { font-size:calc(.56rem * var(--fz,1)); line-height: 1; }
.zbr--miao { color: var(--gold-bright); } .zbr--wang { color: var(--gold); }
.zbr--de { color: var(--gold-pale); } .zbr--li { color: var(--gold-pale); }
.zbr--ping { color: #b6a98c; } .zbr--bu { color: #b6a98c; } .zbr--xian { color: var(--vermillion-bright); }
/* 四化 祿權科忌:加大、圓角方框、實底色 */
.zhua { min-width: 15px; height: 15px; padding: 0 1px; border-radius: 4px; font-size:calc(.64rem * var(--fz,1)); line-height: 1; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
.zhua--lu { color: #eafff2; border: 1px solid var(--jade); background: rgba(111,178,149,.55); }
.zhua--quan { color: #fbeaff; border: 1px solid var(--plum); background: rgba(154,74,130,.6); }
.zhua--ke { color: #eef4ff; border: 1px solid var(--azure); background: rgba(111,143,214,.58); }
.zhua--ji { color: #ffeaea; border: 1px solid var(--vermillion); background: rgba(207,67,68,.6); }
.zempty { font-family: var(--font-brush); font-size:calc(.8rem * var(--fz,1)); color: var(--gold-pale); opacity: .4; font-style: italic; }
/* 大限/流年/小限 = 運勢導航,本命盤不顯示;切到運勢盤(.luck-on)才出現 */
/* 大限/流年/小限 = 本命盤的時間導航,只在本命盤顯示;運勢盤改用上方步進器,不再塞格子 */
.zc-times { margin-top: auto; padding-top: 2px; padding-right: 14px; display: flex; flex-direction: column; }
.ziwei-chart.luck-on .zc-times { display: none; }
.zc-times div { font-size:calc(.58rem * var(--fz,1)); color: var(--muted); line-height: 1.28; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.zc-times div:nth-child(1) { order: 3; } .zc-times div:nth-child(2) { order: 1; } .zc-times div:nth-child(3) { order: 2; }
.zc-times em { font-style: normal; color: var(--gold-deep); margin-right: 3px; }
.zc-mins { display: flex; flex-wrap: wrap; gap: 0 5px; padding-right: 14px; margin-top: 1px; }
.zc-mins span { font-size:calc(.6rem * var(--fz,1)); line-height: 1.18; color: var(--rose); opacity: .85; white-space: nowrap; }
/* 本命盤沒有大限/流年/小限那塊撐底,雜曜會擠到上方;改用 auto 把雜曜壓回宮底(主星上、雜曜下,與運勢盤一致) */
/* 運勢盤沒有大限/流年/小限撐底,雜曜壓回宮底;本命盤有時間列就照原樣 */
.ziwei-chart.luck-on .zc-mins { margin-top: auto; }

/* 縮放外框:chart 維持 700 自然寬,用 transform:scale 等比縮入(JS 設寬高與 scale) */
/* touch-action:pan-y → 未放大時直向捲頁交給瀏覽器(滑命盤能往下捲);放大後 JS 動態改 none 接管拖移 */
.ziwei-fit { position: relative; overflow: hidden; margin: 0.5rem auto; touch-action: pan-y; }
/* 紫微命盤頂部:兩指縮放提示 */
.chart-pinch-hint{text-align:center;font-family:var(--font-body,'Noto Serif TC',serif);font-size:calc(11px * var(--fz,1));letter-spacing:.12em;color:var(--muted-dim,#9a90c6);margin:2px 0 4px;}
.ziwei-fit > .ziwei-chart { position: absolute; top: 0; left: 0; transform-origin: top left; margin: 0 !important; }

/* ===== 運勢盤 控制列 + 運勢覆蓋層 ===== */
.ziwei-luck-shell { display: block; }
.yctl { background: linear-gradient(180deg, rgba(31,24,69,.7), rgba(14,11,46,.92)); border: 1px solid rgba(240,200,96,.3); border-radius: 11px; padding: 8px 10px; margin-bottom: 8px; }
.yrow { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.yrow[hidden] { display: none; }   /* 蓋過 display:flex,讓本命盤確實藏起層級/期間列 */
.yrow + .yrow { margin-top: 7px; }
.yseg-mode { display: inline-flex; background: rgba(0,0,0,.3); border: 1px solid var(--gold-deep); border-radius: 8px; overflow: hidden; }
.yseg-mode button { background: transparent; border: none; color: var(--gold-pale); font-family: var(--font-body); font-size:calc(12px * var(--fz,1)); padding: 6px 14px; cursor: pointer; letter-spacing: .08em; }
.yseg-mode button.on { background: linear-gradient(180deg, var(--gold-bright), var(--gold)); color: #241803; font-weight: 700; }
.yhint { font-size:calc(10.5px * var(--fz,1)); color: var(--muted); letter-spacing: .02em; }
.ychip { background: rgba(217,177,74,.08); border: 1px solid var(--gold-deep); color: var(--gold-pale); font-family: var(--font-body); font-size:calc(11.5px * var(--fz,1)); padding: 4px 10px; border-radius: 14px; cursor: pointer; white-space: nowrap; }
.ychip.on { background: linear-gradient(180deg, var(--gold-bright), var(--gold)); color: #241803; font-weight: 700; border-color: var(--gold); }
.ychip.ysoon { opacity: .4; cursor: not-allowed; }
.ychip--now::after { content: '今'; margin-left: 4px; font-size:calc(.82em * var(--fz,1)); font-weight: 700; color: #ff6a4d; }
.ychip--now.on::after { color: #9a1500; }
.ychips { display: flex; gap: 5px; flex-wrap: wrap; }
.yrow-period .ychips { max-height: 66px; overflow-y: auto; }
/* 多層控制:查看開關(各層色)+ 步進器 */
.ystep-lab { font-size:calc(10.5px * var(--fz,1)); color: var(--gold); letter-spacing: .12em; }
.yview.on { color: #241803; font-weight: 700; }
.yview.lv-da.on { background: #e8c46a; border-color: #e8c46a; }
.yview.lv-nian.on { background: #5fe0d2; border-color: #5fe0d2; }
.yview.lv-yue.on { background: #c79bf0; border-color: #c79bf0; }
.yview.lv-ri.on { background: #f0998a; border-color: #f0998a; }
.yrow-steps { gap: 6px 14px; }
.ystep { display: inline-flex; align-items: center; gap: 4px; }
.ystep .ystep-lab { min-width: 28px; }
.ynav { background: rgba(0,0,0,.28); border: 1px solid var(--gold-deep); color: var(--gold-pale); width: 20px; height: 20px; border-radius: 6px; cursor: pointer; font-size:calc(13px * var(--fz,1)); line-height: 1; display: grid; place-items: center; padding: 0; }
.ynav:active { background: var(--gold-deep); }
.yval { min-width: 90px; text-align: center; font-size:calc(11px * var(--fz,1)); color: var(--cream); background: rgba(0,0,0,.25); border: 1px solid var(--gold-deep); border-radius: 7px; padding: 4px 6px; }
.ystep.lv-da .ystep-lab { color: #e8c46a; } .ystep.lv-nian .ystep-lab { color: #5fe0d2; }
.ystep.lv-yue .ystep-lab { color: #c79bf0; } .ystep.lv-ri .ystep-lab { color: #f0998a; }
/* 各層顏色(套在運宮名 + 流曜) */
.lv-da { color: #e8c46a; } .lv-nian { color: #5fe0d2; } .lv-yue { color: #c79bf0; } .lv-ri { color: #f0998a; }
/* 多層運宮名堆疊(本命宮名下方) */
.zc-lnames { display: flex; flex-wrap: wrap; gap: 0 4px; margin-top: 1px; line-height: 1.18; }
.zc-lname { font-size:calc(.6rem * var(--fz,1)); font-weight: 700; white-space: nowrap; }
/* 運勢覆蓋:重標運宮名 + 淡化本命四化 + 運化藥丸 */
.zc-nm .luckname { color: var(--gold-bright); font-weight: 700; }
.zc-nm .natname { font-size:calc(.6rem * var(--fz,1)); opacity: .42; margin-left: 3px; font-weight: 400; }
.ziwei-chart.luck-on .zhua { opacity: .3; }
.zc.luck-ming { box-shadow: inset 0 0 0 2px var(--gold-bright), 0 0 14px rgba(240,200,96,.42); z-index: 4; }
.zc.luck-ming .luckname { text-shadow: 0 0 7px rgba(240,200,96,.7); }
/* 運四化(年祿/月科…)直書方框 */
.luck-hua { display: inline-flex; align-items: center; justify-content: center; writing-mode: vertical-rl; text-orientation: upright; font-size:calc(.6rem * var(--fz,1)); line-height: 1.05; letter-spacing: 0; min-width: 15px; padding: 2px 0; border-radius: 4px; margin: 2px 1px 0 0; border: 1px solid currentColor; font-weight: 700; }
/* 運四化方框改用「層色」(層級看顏色),化字本身;本命四化(.zhua)仍用化型色 */
.luck-hua.lv-da { background: rgba(232,196,106,.16); } .luck-hua.lv-nian { background: rgba(95,224,210,.16); }
.luck-hua.lv-yue { background: rgba(199,155,240,.18); } .luck-hua.lv-ri { background: rgba(240,153,138,.18); }
.lh-pfx { font-style: normal; }
.ziwei-chart.luck-dense .lh-pfx { display: none; }   /* 兩層以上:四化只留化字 */
/* 流曜:隨運限移動的星(祿羊陀昌曲魁鉞馬),專屬青色,只在運勢盤疊上 */
/* 流曜:靠右、向左排、名稱垂直(青色),只在運勢盤疊上;貼齊上緣不往下蓋到干支 */
.zc-flow { position: absolute; right: 3px; top: 44px; bottom: 30px; display: flex; flex-direction: row-reverse; flex-wrap: nowrap; align-items: center; justify-content: flex-start; gap: 0 1px; z-index: 2; pointer-events: none; }
.zc-flow span { writing-mode: vertical-rl; text-orientation: upright; font-size:calc(.56rem * var(--fz,1)); line-height: 1.02; letter-spacing: .5px; font-weight: 700; }

.ziwei-center { position: relative; z-index: 3; }
.ziwei-center-solar { font-family: var(--font-body); font-size:calc(.62rem * var(--fz,1)); color: var(--gold-pale); opacity: .78; letter-spacing: .04em; margin-top: 2px; }

.chart-toolbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.9rem;
  margin: 0.6rem 0 0.8rem;
  flex-wrap: wrap;
}
.chart-toolbar-label {
  font-family: var(--font-serif);
  font-size:calc(0.8rem * var(--fz,1));
  letter-spacing: 0.25em;
  color: var(--gold-pale);
  opacity: 0.75;
}
.chart-detail-switch {
  display: inline-flex;
  border: 1px solid rgba(240,200,96,0.5);
  background: rgba(14,11,46,0.6);
  padding: 3px;
  gap: 2px;
}
.seg-btn {
  background: transparent;
  border: none;
  color: var(--gold-pale);
  font-family: var(--font-serif);
  font-size:calc(0.85rem * var(--fz,1));
  letter-spacing: 0.12em;
  padding: 0.45rem 1rem;
  cursor: pointer;
  transition: background 0.25s, color 0.25s;
  min-width: 70px;
}
.seg-btn:hover { color: var(--cream); background: rgba(240,200,96,0.08); }
.seg-btn.is-on {
  background: linear-gradient(180deg, var(--gold-bright) 0%, var(--gold) 100%);
  color: var(--bg-deep);
  font-weight: 500;
  box-shadow: 0 2px 8px rgba(240,200,96,0.35), inset 0 0 0 1px rgba(255,255,255,0.2);
}

.ziwei-decade {
  font-family: var(--font-display);
  font-size:calc(0.6rem * var(--fz,1));
  color: var(--gold-pale);
  letter-spacing: 0.2em;
  opacity: 0.7;
  text-align: right;
  margin-top: auto;
  padding-top: 2px;
}
.ziwei-note {
  font-family: var(--font-italic);
  font-style: italic;
  font-size:calc(0.7rem * var(--fz,1));
  color: var(--rose);
  opacity: 0.85;
  line-height: 1.3;
  padding-top: 2px;
  border-top: 1px dotted rgba(232,164,176,0.25);
  margin-top: 1px;
}

/* Center info block */
.ziwei-center {
  background:
    radial-gradient(circle at 30% 25%, rgba(240,200,96,0.18) 0%, transparent 50%),
    linear-gradient(180deg, rgba(43,30,90,0.7) 0%, rgba(14,11,46,0.85) 100%);
  border: 1px solid rgba(240,200,96,0.35);
  padding: 1.2rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  text-align: center;
  position: relative;
  z-index: 2;
  min-width: 0;
}
.ziwei-center::before {
  content: '';
  position: absolute; inset: 4px;
  border: 1px dashed rgba(240,200,96,0.25);
  pointer-events: none;
}

.ziwei-center-eyebrow {
  font-family: var(--font-display);
  letter-spacing: 0.55em;
  font-size:calc(0.7rem * var(--fz,1));
  color: var(--gold-pale);
  margin: 0 0 0.2rem;
  text-indent: 0.5em;
}
.ziwei-center-name {
  /* User-typed label — use serif so 婆/嬤/etc. that aren't in the brush
     subset don't render as a different font from neighbouring chars. */
  font-family: var(--font-serif);
  font-size:calc(clamp(1.6rem, 3vw, 2.2rem) * var(--fz,1));
  color: var(--cream);
  margin: 0;
  letter-spacing: 0.1em;
  background: linear-gradient(180deg, #f5e6b3 0%, #d9b14a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.ziwei-center-sub {
  font-family: var(--font-italic);
  font-style: italic;
  font-size:calc(0.85rem * var(--fz,1));
  color: var(--gold-pale);
  margin: 0;
  letter-spacing: 0.04em;
}
.ziwei-pillars {
  display: flex;
  justify-content: center;
  gap: 0.4rem;
  margin: 0.2rem 0;
  flex-wrap: wrap;
}
.ziwei-pillars .pillar {
  font-family: var(--font-zcool);
  font-size:calc(0.7rem * var(--fz,1));
  letter-spacing: 0.05em;
  color: var(--gold-pale);
  background: rgba(240,200,96,0.08);
  border: 1px solid rgba(240,200,96,0.25);
  padding: 1px 6px;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  white-space: nowrap;
}
.ziwei-pillars .pillar em {
  font-style: normal;
  color: var(--gold);
  opacity: 0.7;
  font-size:calc(0.65rem * var(--fz,1));
  letter-spacing: 0.1em;
}

.ziwei-center-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.3rem 0.8rem;
  margin: 0.4rem 0;
  font-family: var(--font-serif);
  font-size:calc(0.78rem * var(--fz,1));
  width: 100%;
  max-width: 240px;
}
.ziwei-center-meta div {
  display: flex; justify-content: space-between;
  border-bottom: 1px dotted rgba(240,200,96,0.18);
  padding: 0.1rem 0;
}
.ziwei-center-meta dt {
  color: var(--gold-pale);
  letter-spacing: 0.15em;
  opacity: 0.75;
}
.ziwei-center-meta dd {
  margin: 0;
  color: var(--cream);
  font-weight: 500;
}
.ziwei-center-summary {
  font-family: var(--font-zcool);
  font-size:calc(0.85rem * var(--fz,1));
  color: var(--rose);
  letter-spacing: 0.1em;
  line-height: 1.7;
  margin: 0.4rem 0 0;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(232,164,176,0.25);
}

.chart-hint {
  text-align: center;
  font-family: var(--font-italic);
  font-style: italic;
  color: var(--gold-pale);
  font-size:calc(0.82rem * var(--fz,1));
  letter-spacing: 0.06em;
  margin: 0.8rem 0 0;
  opacity: 0.8;
}
.chart-model {
  font-family: var(--font-display);
  font-size:calc(0.7rem * var(--fz,1));
  letter-spacing: 0.2em;
  opacity: 0.5;
  margin-left: 0.8rem;
}

/* ============================================================
   八字 (玄一道長) — 一般卡
   ============================================================ */
.bazi-chart {
  background: linear-gradient(180deg, rgba(61, 47, 16, 0.55) 0%, rgba(20, 11, 38, 0.92) 100%);
  border: 1.5px solid rgba(240,200,96,0.45);
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  position: relative;
  box-shadow: 0 0 32px rgba(217,177,74,0.18), 0 20px 40px rgba(0,0,0,0.5);
}
.bazi-chart::before {
  content: ''; position: absolute; inset: 6px;
  border: 1px dashed rgba(240,200,96,0.15);
  pointer-events: none;
}

.bazi-header {
  text-align: center;
  border-bottom: 1px solid rgba(240,200,96,0.2);
  padding-bottom: 0.6rem;
}
.bazi-header-name {
  /* User-typed label — see ziwei-center-name comment. */
  font-family: var(--font-serif);
  font-size:calc(1.6rem * var(--fz,1));
  color: var(--gold-bright);
  letter-spacing: 0.1em;
}
.bazi-header-sub {
  font-family: var(--font-italic);
  font-style: italic;
  color: var(--gold-pale);
  font-size:calc(0.8rem * var(--fz,1));
  margin-top: 0.2rem;
}
.bazi-header-master {
  font-family: var(--font-serif);
  font-size:calc(0.85rem * var(--fz,1));
  color: var(--cream);
  letter-spacing: 0.08em;
  margin-top: 0.3rem;
}
.bazi-header-master strong { font-size:calc(1.15rem * var(--fz,1)); }

.bazi-pillars {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5rem;
}

.bazi-pillar {
  position: relative;
  background: linear-gradient(180deg, rgba(0,0,0,0.35), rgba(0,0,0,0.6));
  border: 1px solid rgba(240,200,96,0.25);
  border-top: 3px solid var(--stem-color, var(--gold));
  padding: 0.7rem 0.5rem;
  text-align: center;
  cursor: pointer;
  transition: all 0.25s;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.bazi-pillar:hover {
  background: linear-gradient(180deg, rgba(20,11,46,0.6), rgba(0,0,0,0.7));
  box-shadow: 0 0 16px rgba(240,200,96,0.3);
  transform: translateY(-2px);
}
.bazi-pillar.is-master {
  background: linear-gradient(180deg, rgba(217,177,74,0.18), rgba(0,0,0,0.6));
  border-color: var(--gold-bright);
}
.bazi-pillar-head {
  display: flex; justify-content: space-between; align-items: center;
  font-size:calc(0.72rem * var(--fz,1)); color: var(--gold-pale); letter-spacing: 0.15em;
}
.bazi-master-tag {
  background: var(--gold-bright); color: var(--bg-deep);
  padding: 0 5px; font-size:calc(0.65rem * var(--fz,1)); letter-spacing: 0.1em; font-weight: 500;
}
.bazi-stem {
  font-family: var(--font-brush);
  font-size:calc(2rem * var(--fz,1));
  color: var(--stem-color, var(--gold-bright));
  line-height: 1;
  text-shadow: 0 0 12px currentColor;
}
.bazi-branch {
  font-family: var(--font-brush);
  font-size:calc(1.6rem * var(--fz,1));
  color: var(--cream);
  line-height: 1;
  opacity: 0.95;
}
.bazi-ten-god {
  font-family: var(--font-serif);
  font-size:calc(0.78rem * var(--fz,1));
  color: var(--gold-pale);
  letter-spacing: 0.15em;
}
.bazi-nayin {
  font-family: var(--font-italic);
  font-style: italic;
  font-size:calc(0.7rem * var(--fz,1));
  color: var(--rose);
  opacity: 0.75;
}
.bazi-hidden {
  margin-top: 0.4rem;
  padding-top: 0.4rem;
  border-top: 1px dotted rgba(240,200,96,0.25);
  display: flex; flex-direction: column; gap: 1px;
}
.bazi-hidden-row {
  display: flex; justify-content: space-between;
  font-size:calc(0.65rem * var(--fz,1));
}
.bazi-hidden-stem { color: var(--cream); }
.bazi-hidden-god { color: var(--gold-pale); opacity: 0.7; }

.bazi-section-title {
  font-family: var(--font-serif);
  font-size:calc(0.72rem * var(--fz,1));
  letter-spacing: 0.3em;
  color: var(--gold-pale);
  opacity: 0.7;
  margin-bottom: 0.5rem;
  padding-left: 0.4rem;
  border-left: 2px solid var(--gold);
}

.bazi-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.bazi-wuxing .wx-bar {
  display: flex; align-items: center; gap: 0.5rem;
  margin-bottom: 0.25rem;
  font-family: var(--font-serif);
  font-size:calc(0.78rem * var(--fz,1));
}
.wx-label {
  font-family: var(--font-brush);
  font-size:calc(1rem * var(--fz,1));
  color: var(--c);
  width: 1.2em;
}
.wx-track {
  flex: 1;
  height: 6px;
  background: rgba(255,255,255,0.06);
  position: relative;
}
.wx-fill {
  height: 100%;
  background: var(--c);
  box-shadow: 0 0 6px var(--c);
  transition: width 0.4s;
}
.wx-count {
  color: var(--cream);
  font-size:calc(0.75rem * var(--fz,1));
  min-width: 1.5em;
  text-align: right;
}

.bazi-shensha-list {
  display: flex; flex-wrap: wrap; gap: 0.4rem;
}
.bazi-shensha-chip {
  background: rgba(232,164,176,0.1);
  border: 1px solid rgba(232,164,176,0.4);
  color: var(--cream);
  padding: 0.2rem 0.5rem;
  font-size:calc(0.72rem * var(--fz,1));
  letter-spacing: 0.06em;
  display: inline-flex; align-items: baseline; gap: 0.3rem;
}
.bazi-shensha-chip strong { color: var(--rose); font-weight: 500; }
.bazi-shensha-chip em { font-style: normal; opacity: 0.65; font-size:calc(0.65rem * var(--fz,1)); }

.bazi-dayun-section {}
.bazi-dayun-row {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 0.3rem;
}
.bazi-dayun-cell {
  background: rgba(0,0,0,0.3);
  border: 1px solid rgba(240,200,96,0.2);
  padding: 0.45rem 0.3rem;
  text-align: center;
  cursor: pointer;
  transition: all 0.25s;
}
.bazi-dayun-cell:hover {
  background: rgba(217,177,74,0.15);
  border-color: var(--gold-bright);
}
.dayun-age {
  font-family: var(--font-display);
  font-size:calc(0.62rem * var(--fz,1));
  letter-spacing: 0.1em;
  color: var(--gold-pale);
  opacity: 0.7;
}
.dayun-pillar {
  font-family: var(--font-brush);
  font-size:calc(1.05rem * var(--fz,1));
  color: var(--cream);
  letter-spacing: 0.05em;
  margin-top: 0.2rem;
}

/* ============================================================
   八字 V2 — 四柱分欄表(玄一道長)
   ============================================================ */
/* shell:把 toggle 與卡片包成單一子元素,避免被置中 flex 的 .chart-container 並排擠壓 */
.bazi-shell { width: 100%; }

/* 一般 / 詳細 切換 — 置於卡片上方,留間距不擠壓卡片 */
.bazi-view-toggle { display: flex; justify-content: flex-end; margin: 0 0 0.85rem; }
.bazi-view-toggle button {
  font-family: var(--font-serif); font-size:calc(0.74rem * var(--fz,1)); letter-spacing: 0.14em;
  padding: 0.32rem 1rem; cursor: pointer;
  background: rgba(12,10,38,0.5); color: var(--gold-pale);
  border: 1px solid rgba(240,200,96,0.3);
}
.bazi-view-toggle button:first-child { border-radius: 6px 0 0 6px; border-right: none; }
.bazi-view-toggle button:last-child { border-radius: 0 6px 6px 0; }
.bazi-view-toggle button.is-active { background: var(--gold-bright); color: var(--bg-deep); border-color: var(--gold-bright); }

/* 詳細卡片預設填滿容器(與一般卡同寬);行動版由 fitChartsToViewport 量自然寬後 zoom 縮放 */
.bazi-chart.bazi2 { gap: 0.9rem; }

/* 可點格子(data-ask)— 游標 + hover 提示 */
.bazi-shell [data-ask] { cursor: pointer; }
.bz2-pillars td[data-ask]:hover,
.bz2-dayun td[data-ask]:hover,
.bz2-flow-tbl td[data-ask]:hover { background: rgba(217,177,74,0.16); }
.bz2-ssc[data-ask]:hover { border-color: var(--gold-bright); }
.bz2-wx-cell[data-ask]:hover { border-color: var(--gold-bright); background: rgba(217,177,74,0.10); }
.bz2-notes div[data-ask]:hover { color: var(--cream); }
.bazi-pillar[data-ask]:hover { box-shadow: 0 0 14px rgba(240,200,96,0.3); }
.wx-bar[data-ask]:hover, .bazi-shensha-chip[data-ask]:hover { filter: brightness(1.25); }

.bz2-hd {
  display: flex; flex-wrap: wrap; gap: 0.3rem 1.1rem; align-items: baseline;
  padding-bottom: 0.6rem; border-bottom: 1px solid rgba(240,200,96,0.2);
}
.bz2-nm {
  font-family: var(--font-serif); font-size:calc(1.4rem * var(--fz,1)); color: var(--gold-bright);
  letter-spacing: 0.08em; text-shadow: 0 0 14px rgba(240,200,96,0.3);
}
.bz2-cal { font-size:calc(0.74rem * var(--fz,1)); color: var(--paper-deep); }
.bz2-cal b { color: var(--cream); font-weight: 400; }
.bz2-master { margin-left: auto; font-size:calc(0.78rem * var(--fz,1)); color: var(--cream); }
.bz2-master b { font-size:calc(1.3rem * var(--fz,1)); vertical-align: -2px; margin: 0 2px; text-shadow: 0 0 12px currentColor; }

.bz2-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

table.bz2-pillars { border-collapse: collapse; width: 100%; min-width: 420px; text-align: center; }
table.bz2-pillars th, table.bz2-pillars td {
  border: 1px solid rgba(240,200,96,0.16); padding: 0.42rem 0.25rem; vertical-align: middle;
}
table.bz2-pillars thead th {
  background: rgba(42,33,96,0.5); color: var(--gold-bright); font-weight: 400;
  font-family: var(--font-serif); font-size:calc(0.9rem * var(--fz,1)); letter-spacing: 0.18em; padding: 0.5rem 0.25rem;
}
table.bz2-pillars thead th.is-day { color: #1a1208; background: var(--gold-bright); }
table.bz2-pillars tbody th {
  background: rgba(20,16,46,0.72); color: var(--gold-pale); font-size:calc(0.7rem * var(--fz,1));
  letter-spacing: 0.16em; width: 2.6rem; white-space: nowrap; font-weight: 400; opacity: 0.92;
}
.bz2-zx { font-size:calc(0.82rem * var(--fz,1)); color: var(--cream); }
.bz2-yuan { color: var(--gold-bright); font-weight: 600; }
.bz2-gz {
  font-family: var(--font-brush); font-size:calc(1.7rem * var(--fz,1)); font-weight: 600; line-height: 1.1;
  text-shadow: 0 0 12px currentColor;
}
.bz2-stem { cursor: pointer; transition: background 0.2s; }
.bz2-stem:hover { background: rgba(217,177,74,0.14); }
.bz2-stem.is-day { box-shadow: inset 0 0 0 2px var(--gold-bright); }
.bz2-cang { font-size:calc(0.66rem * var(--fz,1)); line-height: 1.5; color: var(--paper-deep); padding: 0.35rem 0.2rem; }
.bz2-cang .bz2-h { display: block; white-space: nowrap; }
.bz2-cang .bz2-h i { font-style: normal; font-size:calc(0.78rem * var(--fz,1)); margin-right: 0.18rem; }
.bz2-sm { font-size:calc(0.74rem * var(--fz,1)); color: var(--cream); }
.bz2-kong { font-size:calc(0.74rem * var(--fz,1)); color: var(--rose); }
.bz2-nayin { font-size:calc(0.72rem * var(--fz,1)); color: var(--rose); font-style: italic; opacity: 0.85; }
.bz2-ss { padding: 0.35rem 0.2rem; }
.bz2-chips { display: flex; flex-direction: column; gap: 0.18rem; align-items: stretch; }
.bz2-ssc {
  font-size:calc(0.64rem * var(--fz,1)); line-height: 1.3; padding: 0.1rem 0.25rem; border-radius: 5px;
  border: 1px solid rgba(240,200,96,0.16); background: rgba(12,10,38,0.55);
  color: var(--cream); white-space: nowrap;
}
.bz2-ssc.star { border-color: rgba(240,200,96,0.5); color: var(--gold-pale); background: rgba(217,177,74,0.1); }
.bz2-ssc.good { border-color: rgba(103,171,140,0.55); color: #a9d8c0; background: rgba(103,171,140,0.1); }
.bz2-ssc.bad  { border-color: rgba(196,61,62,0.5); color: var(--rose); background: rgba(196,61,62,0.12); }

.bz2-notes {
  font-size:calc(0.72rem * var(--fz,1)); color: var(--paper-deep); line-height: 1.85;
  border-top: 1px solid rgba(240,200,96,0.16); padding-top: 0.55rem;
}
.bz2-notes b { color: var(--gold-pale); }

.bz2-dayun-section { display: flex; flex-direction: column; gap: 0.55rem; }
table.bz2-dayun { border-collapse: collapse; width: 100%; min-width: 540px; text-align: center; }
table.bz2-dayun th, table.bz2-dayun td {
  border: 1px solid rgba(240,200,96,0.16); padding: 0.34rem 0.2rem; font-size:calc(0.74rem * var(--fz,1)); color: var(--cream);
}
table.bz2-dayun tbody th {
  background: rgba(20,16,46,0.72); color: var(--gold-pale); font-weight: 400;
  letter-spacing: 0.1em; white-space: nowrap; width: 2.4rem; opacity: 0.92;
}
.bz2-dgz {
  font-family: var(--font-brush); font-size:calc(1.15rem * var(--fz,1)); font-weight: 600;
  padding: 0.42rem 0.2rem !important; cursor: pointer; transition: background 0.2s;
  text-shadow: 0 0 10px currentColor;
}
.bz2-dgz:hover { background: rgba(217,177,74,0.14); }
.bz2-age { color: var(--gold-bright); }
.bz2-yr { color: var(--paper-deep); font-size:calc(0.62rem * var(--fz,1)); white-space: nowrap; }

.bz2-flow summary {
  cursor: pointer; color: var(--gold-pale); font-size:calc(0.72rem * var(--fz,1)); letter-spacing: 0.08em;
  padding: 0.35rem 0; list-style: none;
}
.bz2-flow summary::-webkit-details-marker { display: none; }
.bz2-flow summary::before { content: "▸ "; color: var(--gold); }
.bz2-flow[open] summary::before { content: "▾ "; }
table.bz2-flow-tbl { border-collapse: collapse; width: 100%; min-width: 560px; text-align: center; margin-top: 0.4rem; }
table.bz2-flow-tbl th, table.bz2-flow-tbl td {
  border: 1px solid rgba(240,200,96,0.14); padding: 0.22rem 0.12rem; font-size:calc(0.62rem * var(--fz,1)); color: var(--cream);
}
table.bz2-flow-tbl thead th, table.bz2-flow-tbl tbody th {
  background: rgba(20,16,46,0.72); color: var(--gold-pale); font-weight: 400;
}

.bz2-wx-section { display: flex; flex-direction: column; gap: 0.5rem; }
.bz2-wx-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.4rem; text-align: center; }
.bz2-wx-cell {
  border: 1px solid rgba(240,200,96,0.16); border-radius: 10px; padding: 0.5rem 0.2rem;
  background: rgba(12,10,38,0.5);
}
.bz2-wx-e { font-size:calc(1.2rem * var(--fz,1)); font-weight: 600; text-shadow: 0 0 10px currentColor; }
.bz2-wx-role { font-size:calc(0.62rem * var(--fz,1)); color: var(--paper-deep); margin-top: 0.15rem; }
.bz2-wx-state { font-size:calc(0.82rem * var(--fz,1)); margin-top: 0.25rem; color: var(--gold-bright); }
.bz2-wx-foot { display: flex; gap: 1.1rem; flex-wrap: wrap; font-size:calc(0.74rem * var(--fz,1)); color: var(--paper-deep); }
.bz2-wx-foot b { font-weight: 600; }

/* ============================================================
   西洋占星 (西碧拉) — Astrodoor-style circular natal chart wheel
   ============================================================ */
.astro-chart {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  width: 100%;
  max-width: 560px;
  margin: 0.6rem auto;
  font-family: var(--font-serif);
  color: var(--cream);
}
.astro-wheel-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1;
}
.astro-wheel {
  width: 100%;
  height: 100%;
  display: block;
  touch-action: manipulation;
}
/* Sign sectors — coloured by element, clickable */
.astro-sign-region {
  cursor: pointer;
  transition: filter 0.18s;
}
.astro-sign-region:hover { filter: brightness(1.25); }
.astro-sign-sym,
.astro-sign-zh {
  text-anchor: middle;
  dominant-baseline: middle;
  font-size:calc(14px * var(--fz,1));
  fill: #fff;
  font-family: serif;
  pointer-events: none;
}
.astro-sign-zh {
  font-size:calc(9px * var(--fz,1));
  fill: rgba(255,255,255,0.92);
  font-family: var(--font-zcool, serif);
  letter-spacing: 0.02em;
}
/* Label-mode toggle on the chart root chooses which text to show */
.astro-chart[data-label="symbol"] .astro-sign-zh  { display: none; }
.astro-chart[data-label="single"] .astro-sign-sym { display: none; }

/* Toolbar above the wheel — label-mode toggle + outer-planets toggle */
.astro-chart-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: -0.4rem;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.astro-outer-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.7rem;
  background: rgba(31,24,69,0.55);
  border: 1px solid rgba(155,181,232,0.32);
  cursor: pointer;
  font-family: var(--font-display);
  font-size:calc(0.72rem * var(--fz,1));
  letter-spacing: 0.15em;
  color: var(--gold-pale);
  transition: border-color 0.18s, background 0.18s, color 0.18s;
}
.astro-outer-toggle:hover { border-color: var(--gold-bright); }
.astro-outer-toggle[aria-pressed="true"] {
  background: rgba(240,200,96,0.18);
  color: var(--cream);
  border-color: var(--gold-bright);
}
.astro-outer-toggle[aria-pressed="false"] .astro-outer-glyph {
  opacity: 0.4;
  text-decoration: line-through;
}
.astro-outer-glyph { font-size:calc(0.85rem * var(--fz,1)); letter-spacing: 0.05em; }
.astro-label-toggle {
  display: inline-flex;
  gap: 0.2rem;
  padding: 2px;
  background: rgba(31,24,69,0.55);
  border: 1px solid rgba(155,181,232,0.32);
  cursor: pointer;
  font-family: var(--font-display);
  font-size:calc(0.72rem * var(--fz,1));
  letter-spacing: 0.12em;
  color: var(--gold-pale);
  transition: border-color 0.18s;
}
.astro-label-toggle:hover { border-color: var(--gold-bright); }
.astro-label-opt {
  padding: 0.3rem 0.6rem;
  border-radius: 0;
}
.astro-chart[data-label="symbol"] .astro-label-opt[data-mode="symbol"],
.astro-chart[data-label="single"] .astro-label-opt[data-mode="single"] {
  background: rgba(240,200,96,0.18);
  color: var(--cream);
}
/* House regions — clickable */
.astro-house-region {
  cursor: pointer;
  transition: fill 0.18s;
}
.astro-house-region:hover { fill: rgba(58,42,94,0.85); }
.astro-house-num {
  text-anchor: middle;
  dominant-baseline: middle;
  font-size:calc(12px * var(--fz,1));
  fill: var(--gold-bright);
  font-family: var(--font-display, serif);
  pointer-events: none;
}
/* Planet bubble — gold-edged disc, clickable group */
.astro-planet-region { cursor: pointer; }
.astro-planet-region circle { transition: fill 0.18s, stroke 0.18s; }
.astro-planet-region:hover circle { fill: #3a2a5e; stroke: #fff7d2; }
.astro-planet-sym,
.astro-planet-single {
  text-anchor: middle;
  dominant-baseline: middle;
  font-size:calc(14px * var(--fz,1));
  font-family: serif;
  pointer-events: none;
}
.astro-planet-single {
  font-size:calc(12px * var(--fz,1));
  font-family: var(--font-zcool, serif);
}
/* Label-mode propagates to planet glyphs too */
.astro-chart[data-label="symbol"] .astro-planet-single { display: none; }
.astro-chart[data-label="single"] .astro-planet-sym    { display: none; }

/* Compact planet chip dual-symbol: only show the one matching label mode */
.astro-planet-chip-sym--mode-single { display: none; }
.astro-chart[data-label="single"] .astro-planet-chip-sym--mode-symbol { display: none; }
.astro-chart[data-label="single"] .astro-planet-chip-sym--mode-single { display: inline; }
/* Aspect lines — colour-coded by aspect type */
.astro-aspect-line { cursor: pointer; transition: stroke-width 0.18s, opacity 0.18s; }
.astro-aspect-line:hover { stroke-width: 1.6; opacity: 1; }

/* ASC / DSC / MC / IC labels */
.astro-cardinal {
  text-anchor: middle;
  dominant-baseline: middle;
  font-size:calc(10px * var(--fz,1));
  fill: var(--gold-pale);
  font-family: var(--font-display, serif);
  letter-spacing: 0.2em;
  pointer-events: none;
}

/* Meta line under the wheel */
.astro-meta {
  display: flex;
  flex-wrap: wrap;                 /* 窄螢幕擠不下 → 整塊換行,不把「辰時」拆字 */
  justify-content: center;
  column-gap: 0.7rem;
  row-gap: 1px;
  font-size:calc(0.72rem * var(--fz,1));
  color: var(--gold-pale);
  letter-spacing: 0.12em;
  font-family: var(--font-display);
  padding: 0 0.4rem;
  opacity: 0.85;
}
.astro-meta span { white-space: nowrap; }
/* 敏感點(北交/南交/福點)符號 + 上升軸標籤高亮(三巨頭之一) */
.astro-point-sym {
  text-anchor: middle;
  dominant-baseline: middle;
  font-size:calc(11px * var(--fz,1));
  font-family: var(--font-display, serif);
  pointer-events: none;
}
.astro-point { cursor: pointer; }
.astro-cardinal.astro-asc-hi { fill: var(--gold-bright, #f3cd6a); font-weight: 700; }
.astro-asc-deg { text-anchor: middle; dominant-baseline: middle; font-size:calc(8.5px * var(--fz,1)); fill: var(--gold-bright, #f3cd6a); font-weight: 700; letter-spacing: .02em; pointer-events: none; }
/* 上升/天頂 資訊列:與行星列同樣式,符號用亮金以示為軸點(非行星) */
.astro-axis-chip .astro-planet-chip-sym { color: var(--gold-bright, #f3cd6a); font-weight: 700; }
.astro-axis-chip .astro-planet-chip-name { color: var(--gold-pale, #ecd8a4); }
/* 多字元軸符號(MC)縮小,不要撐滿單符號格子而顯突兀 */
.astro-axis-chip .astro-planet-chip-sym.axis-sym-txt { font-size:calc(0.6rem * var(--fz,1)); font-weight: 600; letter-spacing: 0; }

/* Compact planet row below the wheel — primary interaction surface */
.astro-planet-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.3rem;
}
.astro-planet-chip {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  background: rgba(31,24,69,0.45);
  border: 1px solid rgba(155,181,232,0.3);
  color: var(--cream);
  font-family: var(--font-serif);
  font-size:calc(0.82rem * var(--fz,1));
  padding: 0.4rem 0.55rem;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.18s, background 0.18s;
}
.astro-planet-chip:hover {
  border-color: var(--gold-bright);
  background: rgba(58,42,94,0.55);
}
.astro-planet-chip-sym {
  font-size:calc(1rem * var(--fz,1));
  color: var(--gold-bright);
  width: 18px;
  text-align: center;
  flex-shrink: 0;
}
.astro-planet-chip-name {
  flex: 1;
  letter-spacing: 0.05em;
  min-width: 0;
}
.astro-planet-chip-sign,
.astro-planet-chip-house {
  font-size:calc(0.72rem * var(--fz,1));
  color: var(--gold-pale);
  flex-shrink: 0;
}
.astro-planet-chip-house {
  opacity: 0.7;
  padding-left: 0.2rem;
  border-left: 1px solid rgba(240,200,96,0.25);
  margin-left: 0.1rem;
}
.astro-empty {
  padding: 1.5rem;
  text-align: center;
  color: var(--gold-pale);
  font-family: var(--font-serif);
  letter-spacing: 0.1em;
}

/* ============================================================
   印度吠陀占星 (阿南德) — North Indian Janma Kundali (SVG)
   ============================================================ */
.vedic-chart {
  background: transparent;
  padding: 0;
  position: relative;
  width: 100%;
  max-width: 560px;
  margin: 0.6rem auto;
  box-shadow: 0 0 40px rgba(240,160,74,0.22), 0 20px 40px rgba(0,0,0,0.55);
  border-radius: 4px;
  overflow: hidden;
}

.vedic-svg {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
}

/* Click regions — transparent overlays sitting on top of the chart.
   Use fill rgba(... 0.001) (not "transparent") + pointer-events: all so
   every browser counts the polygon as paintable for hit-testing. */
.vedic-svg .vh-region {
  fill: rgba(255,255,255,0.001);
  stroke: transparent;
  cursor: pointer;
  pointer-events: all;
  transition: fill 0.25s ease;
}
.vedic-svg .vh-region:hover,
.vedic-svg .vh-region:active {
  fill: rgba(240,160,74,0.22);
}
.vedic-svg .vh-region.is-lagna:hover,
.vedic-svg .vh-region.is-lagna:active {
  fill: rgba(240,200,96,0.32);
}

/* foreignObject labels must NOT intercept clicks — let them pass through
   to the polygon regions underneath. */
.vedic-svg foreignObject { pointer-events: none; }

/* foreignObject contents — Rashi name + planets per house */
.vh-label {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: var(--font-serif);
  color: var(--cream);
  pointer-events: none;
  line-height: 1.1;
}
.vh-label.is-lagna { color: var(--gold-bright); }
.vh-label.is-lagna .vh-rashi { text-shadow: 0 0 6px rgba(240,200,96,0.6); }

.vh-top {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
}
.vh-num {
  font-family: var(--font-display);
  font-size:calc(10px * var(--fz,1));
  letter-spacing: 0.15em;
  color: var(--gold-pale);
  opacity: 0.7;
}
.vh-rashi {
  font-family: var(--font-brush);
  font-size:calc(14px * var(--fz,1));
  letter-spacing: 0.04em;
}
.vh-planets {
  margin-top: 1px;
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  justify-content: center;
  max-width: 100%;
}
.vh-planet {
  font-family: serif;
  font-size:calc(12px * var(--fz,1));
  color: var(--gold-bright);
  line-height: 1;
  padding: 0 2px;
}
.vh-planet.is-retro { color: var(--vermillion-bright); }

/* Center plate */
.vc-info-na {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  pointer-events: none;
  gap: 1px;
  line-height: 1.1;
}
.vc-na-om {
  font-size:calc(22px * var(--fz,1));
  color: var(--gold-bright);
  text-shadow: 0 0 8px rgba(240,200,96,0.65);
  line-height: 1;
  margin-bottom: 2px;
  font-family: serif;
}
.vc-na-name {
  font-family: var(--font-brush);
  font-size:calc(16px * var(--fz,1));
  color: var(--cream);
  letter-spacing: 0.05em;
}
.vc-na-lagna {
  font-family: var(--font-serif);
  font-size:calc(9px * var(--fz,1));
  color: var(--gold-pale);
  letter-spacing: 0.04em;
}
.vc-na-sub {
  font-family: var(--font-serif);
  font-size:calc(10px * var(--fz,1));
  color: var(--cream);
}

/* ============================================================
   行動版 (<=720px)
   ============================================================ */
@media (max-width: 720px) {
  /* 命盤容器:不滾動,讓盤面縮放到貼合畫面寬度。 */
  .chart-toolbar { gap: 0.5rem; }
  .chart-toolbar-label { font-size:calc(0.7rem * var(--fz,1)); letter-spacing: 0.18em; }
  .seg-btn { padding: 0.5rem 0.7rem; font-size:calc(0.78rem * var(--fz,1)); min-width: 60px; }

  /* 紫微 仍是 CSS grid,固定 px 寬 + flex 置中 */
  .ziwei-chart {
    width: 540px !important;
    min-width: 540px !important;
    max-width: 540px !important;
    flex: 0 0 540px;
    margin: 0.6rem 0 !important;
    padding: 5px; gap: 3px;
  }
  /* 新版專業盤設計寬 700,由 fitChartsToViewport 等比縮放塞進螢幕 */
  .ziwei-chart--pro {
    width: 700px !important;
    min-width: 700px !important;
    max-width: 700px !important;
    flex: 0 0 700px;
    padding: 6px !important; gap: 4px !important;
  }
  .ziwei-cell { font-size:calc(0.72rem * var(--fz,1)); padding: 6px 7px; gap: 2px; }
  .ziwei-cell-head { padding-bottom: 3px; margin-bottom: 2px; }
  .ziwei-name { font-size:calc(0.92rem * var(--fz,1)); letter-spacing: 0.04em; }
  .ziwei-ganzhi { font-size:calc(0.68rem * var(--fz,1)); letter-spacing: 0.06em; }
  .star { font-size:calc(0.7rem * var(--fz,1)); padding: 1px 4px; }
  .star--main { font-size:calc(0.76rem * var(--fz,1)); padding: 1px 5px; }
  .star--minor { font-size:calc(0.62rem * var(--fz,1)); }
  .ziwei-stars-row { gap: 3px; }
  .ziwei-center { padding: 0.7rem 0.5rem; }
  .ziwei-center-eyebrow { font-size:calc(0.6rem * var(--fz,1)); letter-spacing: 0.35em; }
  .ziwei-center-name { font-size:calc(1.4rem * var(--fz,1)); }
  .ziwei-center-sub { font-size:calc(0.74rem * var(--fz,1)); }
  .ziwei-pillars { gap: 0.3rem; }
  .ziwei-pillars .pillar { font-size:calc(0.6rem * var(--fz,1)); padding: 1px 5px; }
  .ziwei-pillars .pillar em { font-size:calc(0.58rem * var(--fz,1)); }
  .ziwei-center-meta { font-size:calc(0.68rem * var(--fz,1)); max-width: 200px; gap: 0.3rem 0.7rem; }
  .ziwei-center-summary { font-size:calc(0.76rem * var(--fz,1)); line-height: 1.6; }
  .ziwei-decade { font-size:calc(0.55rem * var(--fz,1)); }
  .ziwei-note { font-size:calc(0.62rem * var(--fz,1)); }

  /* 八字一般卡 */
  .bazi-stem { font-size:calc(1.5rem * var(--fz,1)); }
  .bazi-branch { font-size:calc(1.25rem * var(--fz,1)); }
  .bazi-ten-god { font-size:calc(0.65rem * var(--fz,1)); }
  .bazi-nayin { font-size:calc(0.6rem * var(--fz,1)); }
  .bazi-hidden-row { font-size:calc(0.55rem * var(--fz,1)); }
  .bazi-meta { grid-template-columns: 1fr; }
  .bazi-dayun-row { grid-template-columns: repeat(4, 1fr); }

  /* 八字 V2 詳細表 */
  .bz2-master { margin-left: 0; width: 100%; }
  .bz2-gz { font-size:calc(1.45rem * var(--fz,1)); }
  .bz2-wx-cell { padding: 0.4rem 0.1rem; }
  .bz2-wx-e { font-size:calc(1rem * var(--fz,1)); }

  /* 西洋占星 */
  .astro-chart { max-width: 100%; }
  .astro-planet-row { grid-template-columns: 1fr; }

  /* 吠陀已改 SVG (北印度菱形),aspect-ratio 自然縮放,不需 zoom */
  .vedic-chart {
    width: 100%;
    max-width: 100%;
    margin: 0.6rem auto !important;
  }
}

/* ===== 命盤頁紫微速覽 v4 ===== */
.zov-hero{text-align:center;position:relative;padding:20px 14px;border:1px solid var(--gold-deep);border-radius:18px;
  background:linear-gradient(165deg,rgba(70,52,18,.28),rgba(36,28,88,.30) 55%,rgba(18,14,46,.5))}
.zov-name{font-size:calc(26px * var(--fz,1));font-weight:700;color:var(--gold-bright);letter-spacing:.12em;margin:8px 0 5px}
.zov-tag{font-size:calc(13px * var(--fz,1));color:var(--gold-pale)}
.zov-chips{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:11px}
.zov-chip{font-size:calc(11px * var(--fz,1));color:var(--gold-pale);border:1px solid var(--gold-deep);border-radius:20px;padding:2px 10px}
.zov-hook{margin-top:13px;padding-top:11px;border-top:1px solid rgba(160,125,44,.35);font-size:calc(13px * var(--fz,1));color:var(--cream);line-height:1.6}
.zov-sec{font-size:calc(12px * var(--fz,1));letter-spacing:.2em;color:var(--gold);margin:22px 2px 11px}
.zov-cards{display:grid;gap:10px}
.zov-card{border:1px solid var(--line,#2e2660);border-radius:13px;padding:13px 14px;background:rgba(36,28,88,.2)}
.zov-ch{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.zov-ch b{font-size:calc(15px * var(--fz,1));color:var(--gold-bright)}
.zov-role{font-size:calc(11px * var(--fz,1));color:var(--gold-pale);border:1px solid var(--gold-deep);border-radius:11px;padding:1px 8px}
.zov-pl{font-size:calc(13px * var(--fz,1));margin:4px 0;display:flex;gap:7px;color:var(--cream)}
.zov-pl .g{color:var(--jade,#6fb295);font-style:normal} .zov-pl.w .r{color:var(--rose,#e3a0b4);font-style:normal} .zov-pl.w{color:#e8d4c2}
.zov-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.zov-panel{border:1px solid var(--line,#2e2660);border-radius:13px;padding:12px;background:rgba(36,28,88,.18)}
.zov-panel h4{margin:0 0 9px;font-size:calc(12px * var(--fz,1))} .zov-panel.t h4{color:var(--jade,#6fb295)} .zov-panel.c h4{color:var(--rose,#e3a0b4)}
.zov-item{margin-bottom:11px}
.zov-nm{font-size:calc(13px * var(--fz,1));color:var(--gold-pale);font-weight:600;display:flex;align-items:center;gap:7px}
.zov-ds{font-size:calc(11.5px * var(--fz,1));color:var(--muted,#9b90c4);line-height:1.55;margin-top:2px}
.zov-dx{border:1px solid var(--gold-deep);border-radius:13px;padding:12px 14px;background:linear-gradient(90deg,rgba(217,177,74,.12),transparent)}
.zov-dxh{display:flex;align-items:center;gap:8px;margin-bottom:4px} .zov-dxh b{font-size:calc(14px * var(--fz,1));color:var(--gold-bright)}
.zov-dxt{font-size:calc(12.5px * var(--fz,1));color:var(--cream)}
.zov-geju{display:flex;flex-direction:column;gap:8px;margin:6px 0 4px}
.zov-gj{border:1px solid var(--line);border-radius:12px;padding:10px 13px;background:rgba(20,15,46,.35)}
.zov-gj--ji{border-color:var(--gold)}
.zov-gj--sha{border-color:var(--vermillion)}
.zov-gj--mid{border-color:var(--line)}
.zov-gj-h{display:flex;align-items:center;gap:8px}
.zov-gj-h b{font-family:var(--font-brush);color:var(--gold-bright)}
.zov-gj-k{font-size:calc(11px * var(--fz,1));padding:0 7px;border:1px solid currentColor;border-radius:99px;color:var(--muted-dim)}
.zov-gj--ji .zov-gj-k{color:var(--gold)}
.zov-gj--sha .zov-gj-k{color:var(--vermillion)}
.zov-gj-d{font-size:calc(13.5px * var(--fz,1));color:var(--muted);margin-top:5px;line-height:1.7}
.zov-liunian{border:1px solid var(--line);border-radius:12px;padding:11px 14px;margin-top:8px;background:rgba(20,15,46,.35)}
.zov-ln-up{margin-top:8px;font-size:calc(12.5px * var(--fz,1));color:var(--gold);cursor:pointer}
.zov-ln-up:hover{color:var(--gold-bright)}
/* 西洋速覽新區塊:三巨頭/元素體質/北交點/事業座標 */
.zov-big3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
@media (max-width:520px){.zov-big3{grid-template-columns:1fr}}
.zov-b3{border:1px solid var(--line,#2e2660);border-radius:12px;padding:10px 11px;background:rgba(20,15,46,.5)}
.zov-b3-h{display:flex;align-items:center;gap:6px;font-size:calc(12.5px * var(--fz,1))}
.zov-b3-h i{font-style:normal;color:var(--gold-bright,#f3cd6a);font-size:calc(14px * var(--fz,1))}
.zov-b3-h b{color:var(--gold-pale,#ecd8a4);font-weight:600}
.zov-b3-h span{color:var(--cream,#f1e7cf);font-weight:700}
.zov-b3-i{font-size:calc(10.5px * var(--fz,1));color:var(--muted-dim,#9a90c6);margin-top:5px;line-height:1.6}
.zov-b3-d{font-size:calc(12px * var(--fz,1));color:var(--muted,#c0b6e8);margin-top:5px;line-height:1.75}
.zov-bal{border:1px solid var(--line,#2e2660);border-radius:12px;padding:12px;background:rgba(20,15,46,.5)}
.zov-bal-bars{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.zov-bar{display:flex;align-items:center;gap:8px;font-size:calc(11.5px * var(--fz,1))}
.zov-bar .lb{flex:none;width:16px;color:var(--gold-pale,#ecd8a4)}
.zov-bar .tr{flex:1;height:7px;border-radius:99px;background:rgba(0,0,0,.3);overflow:hidden}
.zov-bar-f{display:block;height:100%;border-radius:99px}
.zov-bar--fire{background:linear-gradient(90deg,#e0595a,#cf4344)}
.zov-bar--earth{background:linear-gradient(90deg,#d9b14a,#a07d2c)}
.zov-bar--air{background:linear-gradient(90deg,#8fa8e8,#6f8fd6)}
.zov-bar--water{background:linear-gradient(90deg,#7fc4a8,#6fb295)}
.zov-bar b{flex:none;width:14px;text-align:right;color:var(--muted,#c0b6e8);font-size:calc(11px * var(--fz,1))}
.zov-bal-t{font-size:calc(12px * var(--fz,1));color:var(--muted,#c0b6e8);line-height:1.7;margin-top:7px}
.zov-bal-t b{color:var(--gold-pale,#ecd8a4);font-weight:600;margin-right:5px}
.zov-bal-t.lack b{color:var(--rose,#e3a0b4)}
.zov-nn{border:1px solid var(--line,#2e2660);border-radius:12px;padding:11px 12px;background:rgba(20,15,46,.5)}
.zov-ax{font-size:calc(11.5px * var(--fz,1));color:var(--muted-dim,#9a90c6);margin-top:7px;line-height:1.6}
/* 乾淨的問-icon:平時只一個小 ◈,點了才浮現問題 */
.zov-ask{flex:none;margin-left:auto;cursor:pointer;color:var(--gold);opacity:.85;font-size:calc(11px * var(--fz,1));
  border:1px solid rgba(217,177,74,.4);border-radius:50%;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;transition:.15s;background:rgba(217,177,74,.06)}
.zov-ask:hover{opacity:1;color:#241803;border-color:var(--gold-bright);background:var(--gold-bright)}
/* 底部 CTA:想更深入?點一題,直接問玄樞子(保留 v3 區塊) */
.zov-asklist{margin-top:22px;border:1px dashed var(--gold-deep);border-radius:16px;padding:15px 14px;background:rgba(217,177,74,.04)}
.zov-askt{font-size:calc(12px * var(--fz,1));color:var(--gold);letter-spacing:.08em;text-align:center;margin-bottom:11px}
.zov-q{display:flex;align-items:center;gap:10px;width:100%;text-align:left;cursor:pointer;font-family:var(--font-body,'Noto Serif TC',serif);
  font-size:calc(13px * var(--fz,1));color:var(--gold-pale);background:rgba(36,28,88,.4);border:1px solid var(--line,#2e2660);border-radius:12px;padding:12px 13px;margin-bottom:9px;transition:.15s}
.zov-q:hover{border-color:var(--gold-bright);color:var(--cream);background:rgba(70,52,18,.35)}
.zov-q i{flex:none;margin-left:auto;font-style:normal;font-size:calc(10px * var(--fz,1));color:var(--gold);opacity:.75}

/* 問玄樞子 自製確認 modal(取代原生 confirm) */
.zask-ov{position:fixed;inset:0;z-index:9999;background:rgba(6,5,26,.72);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:24px;animation:zaskIn .15s ease}
@keyframes zaskIn{from{opacity:0}to{opacity:1}}
.zask-card{max-width:340px;width:100%;border:1px solid var(--gold-deep,#a07d2c);border-radius:18px;padding:20px 18px;background:linear-gradient(165deg,rgba(36,28,88,.96),rgba(18,14,46,.98));box-shadow:0 18px 50px -12px rgba(0,0,0,.7)}
.zask-h{font-size:calc(11px * var(--fz,1));letter-spacing:.28em;color:var(--gold,#d9b14a);text-align:center;margin-bottom:13px}
.zask-q{font-size:calc(15px * var(--fz,1));color:var(--cream,#f1e7cf);line-height:1.65;text-align:center;margin-bottom:20px}
.zask-btns{display:flex;gap:10px}
.zask-btns button{flex:1;font-family:var(--font-body,'Noto Serif TC',serif);font-size:calc(13.5px * var(--fz,1));padding:11px;border-radius:12px;cursor:pointer;letter-spacing:.05em;transition:.15s}
.zask-no{background:transparent;border:1px solid var(--gold-deep,#a07d2c);color:var(--gold-pale,#ecd8a4)}
.zask-no:hover{border-color:var(--gold-pale,#ecd8a4)}
.zask-yes{background:var(--gold-bright,#f3cd6a);border:1px solid var(--gold-bright,#f3cd6a);color:#1b1542;font-weight:700}
.zask-yes:hover{filter:brightness(1.06)}
.zask-yes.zask-danger{background:var(--vermillion,#c0392b);border-color:var(--vermillion,#c0392b);color:#fff}
.zask-yes.zask-danger:hover{filter:brightness(1.08)}

/* 接續提問:每則回答後自動長出的 5 個快捷問題按鈕(靛金) */
.zfu{margin:2px 0 6px;display:flex;flex-direction:column;gap:7px;max-width:434px;animation:zfuIn .26s ease}
@keyframes zfuIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.zfu-h{font-size:calc(11px * var(--fz,1));letter-spacing:.16em;color:var(--gold,#d9b14a);opacity:.82;margin:2px 2px 1px}
.zfu-q{display:block;width:100%;text-align:left;font-family:var(--font-body,'Noto Serif TC',serif);font-size:calc(12.5px * var(--fz,1));line-height:1.5;color:var(--gold-pale,#ecd8a4);background:rgba(36,28,88,.4);border:1px solid var(--ink-line,#2e2660);border-radius:11px;padding:9px 12px;cursor:pointer;transition:.15s}
.zfu-q:hover{border-color:var(--gold-bright,#f3cd6a);color:var(--cream,#f1e7cf);background:rgba(217,177,74,.08)}
.zfu-q:active{transform:scale(.992)}

/* 命盤速覽底部「其他想問…」自由輸入列 */
.zov-other{display:flex;gap:8px;margin-top:4px}
.zov-other-in{flex:1;min-width:0;font-family:var(--font-body,'Noto Serif TC',serif);font-size:calc(13px * var(--fz,1));color:var(--cream,#f1e7cf);background:rgba(36,28,88,.4);border:1px solid var(--ink-line,#2e2660);border-radius:12px;padding:11px 13px;outline:none;transition:.15s}
.zov-other-in::placeholder{color:#9b90c4}
.zov-other-in:focus{border-color:var(--gold-bright,#f3cd6a)}
.zov-other-go{flex:none;font-family:var(--font-body,'Noto Serif TC',serif);font-size:calc(12px * var(--fz,1));color:#1b1542;background:var(--gold-bright,#f3cd6a);border:1px solid var(--gold-bright,#f3cd6a);border-radius:12px;padding:0 14px;cursor:pointer;white-space:nowrap;transition:.15s}
.zov-other-go:hover{filter:brightness(1.06)}

/* ===== 分門派深度報告(school_report / bundle_report) ===== */
.rsr-pick{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
.rsr-pick-c{font-family:var(--font-body,'Noto Serif TC',serif);text-align:left;padding:14px 14px;border:1px solid var(--ink-line,#2e2660);border-radius:14px;background:rgba(36,28,88,.4);color:var(--cream,#f1e7cf);cursor:pointer;transition:.15s}
.rsr-pick-c:hover:not([disabled]){border-color:var(--gold-bright,#f3cd6a)}
.rsr-pick-c[disabled]{opacity:.45;cursor:not-allowed}
.rsr-pick-c b{display:block;font-size:calc(15px * var(--fz,1));color:var(--gold-bright,#f3cd6a)}
.rsr-pick-c span{font-size:calc(11px * var(--fz,1));color:#9b90c4}
.rsr{margin:0 0 22px;border:1px solid var(--ink-line,#2e2660);border-radius:18px;padding:6px 18px 18px;background:rgba(36,28,88,.16)}
.rsr-syn{border-color:var(--gold-deep,#a07d2c);background:linear-gradient(165deg,rgba(70,52,18,.22),rgba(36,28,88,.2))}
.rsr-rh{text-align:center;padding:16px 0 8px;border-bottom:1px solid rgba(160,125,44,.3);margin-bottom:6px}
.rsr-rsys{font-size:calc(11px * var(--fz,1));letter-spacing:.3em;color:var(--gold,#d9b14a)}
.rsr-rnpc{font-size:calc(14px * var(--fz,1));color:var(--gold-bright,#f3cd6a);margin-top:4px}
.rsr-sec{padding:15px 0;border-bottom:1px solid rgba(46,38,96,.7)}
.rsr-h{font-size:calc(14px * var(--fz,1));color:var(--gold-bright,#f3cd6a);letter-spacing:.1em;margin:0 0 6px}
.rsr-h4{font-size:calc(12px * var(--fz,1));margin:0 0 6px}.rsr-h4.g{color:#6fb295}.rsr-h4.b{color:#e3a0b4}
.rsr-simple{font-size:calc(12px * var(--fz,1));color:#9b90c4;font-style:italic;border-left:2px solid var(--gold-deep,#a07d2c);padding-left:9px;margin-bottom:9px;line-height:1.6}
.rsr-body{font-size:calc(13.5px * var(--fz,1));color:var(--cream,#f1e7cf);line-height:1.85}
.rsr-body .rsr-para{margin:0 0 .82em}
.rsr-body .rsr-para:last-child{margin-bottom:0}
.rsr-hero{text-align:center;padding:4px 0 2px}
.rsr-one{font-size:calc(21px * var(--fz,1));font-weight:700;color:var(--gold-bright,#f3cd6a);letter-spacing:.05em}
.rsr-hook{font-size:calc(14px * var(--fz,1));color:var(--gold-pale,#ecd8a4);margin-top:8px;padding-top:8px;border-top:1px solid rgba(160,125,44,.3)}
.rsr-gap{margin-top:10px;padding:11px 13px;border:1px solid var(--gold-deep,#a07d2c);border-radius:11px;background:rgba(217,177,74,.08);color:var(--gold-bright,#f3cd6a);font-size:calc(13.5px * var(--fz,1));line-height:1.85}
.rsr-gap.big{font-size:calc(14px * var(--fz,1));line-height:1.95}
.rsr-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.rsr-it{font-size:calc(12.5px * var(--fz,1));margin-bottom:8px;color:#e8d4c2}.rsr-it b{display:block;color:var(--gold-bright,#f3cd6a);font-size:calc(13px * var(--fz,1));margin-bottom:1px}
.rsr-it.g b{color:#6fb295}.rsr-it.b b{color:#e3a0b4}
.rsr-dom{font-size:calc(13px * var(--fz,1));margin-bottom:9px;padding-left:76px;position:relative;min-height:20px;line-height:1.75}
.rsr-dl{position:absolute;left:0;top:1px;font-size:calc(11px * var(--fz,1));color:var(--gold,#d9b14a);border:1px solid var(--gold-deep,#a07d2c);border-radius:9px;padding:1px 7px}
.rsr-cur{margin-bottom:8px}.rsr-yr{font-size:calc(12.5px * var(--fz,1));margin:4px 0;color:var(--gold-pale,#ecd8a4)}.rsr-yr.now{color:var(--gold-bright,#f3cd6a)}
.rsr-st{color:var(--gold-bright,#f3cd6a);letter-spacing:1px}
.rsr-acts{margin:0 0 10px;padding-left:20px}.rsr-acts li{font-size:calc(13px * var(--fz,1));margin-bottom:5px;line-height:1.7}
.rsr-oneline{text-align:center;font-size:calc(14.5px * var(--fz,1));color:var(--gold-bright,#f3cd6a);padding-top:8px;border-top:1px solid rgba(160,125,44,.3)}
.rsr-h{display:flex;align-items:center;gap:8px}
.rsr-ask{flex:none;margin-left:auto;opacity:.6}
.rsr-ask:hover{opacity:1}
.rsr-aski{width:16px;height:16px;font-size:calc(9px * var(--fz,1));opacity:.42;vertical-align:middle;margin-left:5px;flex:none}
.rsr-aski:hover{opacity:1}

/* 列印 / 另存 PDF(App 走系統列印):只印報告、白底深字、隱藏按鈕與 ◈ */
@media print{
  body{background:#fff !important}
  body *{visibility:hidden !important}
  #report-body, #report-body *{visibility:visible !important}
  #report-body{position:absolute;left:0;top:0;width:100%;padding:0;margin:0}
  .rsr{background:#fff !important;border:none !important;margin:0 0 8px;padding:0}
  .rsr-rh{border-color:#ddd !important}
  .rsr-rsys,.rsr-h,.rsr-it b,.rsr-dl,.rsr-st,.rsr-h4{color:#7a5c12 !important}
  .rsr-rnpc,.rsr-one,.rsr-oneline{color:#1a1430 !important}
  .rsr-body,.rsr-simple,.rsr-it,.rsr-dom,.rsr-yr,.rsr-cur,.rsr-hook,.rsr-acts li{color:#222 !important}
  .rsr-mc .bd{color:#222 !important}.rsr-mch .mm{color:#7a5c12 !important}
  .rsr-mc .ft,.rsr-mc .ft span b{color:#555 !important}
  .rsr-mc{border-color:#e3ddcc !important;break-inside:avoid;background:#fff !important}
  .rsr-mc.hi{background:#fbf4df !important}
  .rsy-fc{border-color:#e3ddcc !important;break-inside:avoid;background:#fff !important}
  .rsy-fc .bd{color:#222 !important}.rsy-fch .nm{color:#7a5c12 !important}
  .rsr-gap{background:#f6efdc !important;color:#5a4a1e !important;border-color:#caa96a !important}
  .rsr-sec{border-color:#e3ddcc !important;break-inside:avoid}
  /* 分門派新段列印白底覆寫 */
  .rsr-b3,.rsr-dz{background:#fff !important;border-color:#e3ddcc !important;break-inside:avoid}
  .rsr-dz.now,.rsr-dcur{background:#fbf4df !important}
  .rsr-dcur{border-color:#e3ddcc !important;break-inside:avoid}
  .rsr-elems .el{background:#fff !important;border-color:#e3ddcc !important}
  .rsr-elems .el{color:#5a4a1e !important}
  .rsr-elems .el b{color:#7a5c12 !important}
  .rsr-b3 .sy,.rsr-b3 .lb,.rsr-dcur b{color:#7a5c12 !important}
  .rsr-b3 .bd,.rsr-dz .n,.rsr-dcur{color:#222 !important}
  .rep-cta,.zov-ask,.rsr-ask,.rsr-aski,.zfu,.zask-ov,.gold-btn,.ghost-btn{display:none !important}
}

/* ===== 深度命書 v2:美化問AI按鈕 + 九大視覺元件 ===== */
.rsr-ask{margin-left:auto;flex:none;display:inline-flex;align-items:center;gap:6px;font-size:calc(11px * var(--fz,1));color:var(--gold-pale,#ecd8a4);border:1px solid rgba(217,177,74,.45);border-radius:20px;padding:3px 11px 3px 4px;cursor:pointer;background:linear-gradient(135deg,rgba(217,177,74,.13),rgba(217,177,74,.04));transition:.15s;white-space:nowrap;opacity:1;letter-spacing:.04em}
.rsr-ask:hover{background:rgba(217,177,74,.25)}
.rsr-ask .ra-av{width:20px;height:20px;border-radius:50%;object-fit:cover;flex:none;border:1px solid var(--gold-deep,#a07d2c)}
.rsr-aski{flex:none;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;font-size:calc(10px * var(--fz,1));color:var(--gold,#d9b14a);border:1px solid rgba(217,177,74,.4);border-radius:50%;cursor:pointer;margin-left:7px;background:rgba(217,177,74,.06);transition:.15s;vertical-align:middle}
.rsr-aski:hover{background:var(--gold-bright,#f3cd6a);color:#241803;border-color:var(--gold-bright,#f3cd6a)}
.rsr-p{font-size:calc(13.5px * var(--fz,1));color:var(--cream,#f1e7cf);margin:0 0 8px;line-height:1.85}
.rsr-lab{font-size:calc(12px * var(--fz,1));color:var(--gold-pale,#ecd8a4);margin:10px 0 4px}.rsr-lab.bad{color:var(--rose,#e3a0b4)}
.rsr-st{color:var(--gold-bright,#f3cd6a);letter-spacing:.5px;font-size:calc(11.5px * var(--fz,1))}
.rsr-ax{margin:12px 0}
.rsr-axl{display:flex;justify-content:space-between;font-size:calc(12px * var(--fz,1));color:var(--gold-pale,#ecd8a4);margin-bottom:4px}
.rsr-axt{position:relative;height:6px;background:rgba(46,38,96,.8);border-radius:4px}
.rsr-axd{position:absolute;top:-3px;width:12px;height:12px;border-radius:50%;background:var(--gold-bright,#f3cd6a);box-shadow:0 0 8px rgba(243,205,106,.6)}
.rsr-rk{margin:9px 0}
.rsr-rkh{display:flex;align-items:center;font-size:calc(13px * var(--fz,1));margin-bottom:3px}.rsr-rkh b{color:var(--gold-pale,#ecd8a4)}.rsr-rks{color:var(--gold-bright,#f3cd6a);margin-left:8px}
.rsr-rkt{height:7px;background:rgba(46,38,96,.8);border-radius:4px;overflow:hidden}
.rsr-rkf{height:100%;background:linear-gradient(90deg,var(--gold-deep,#a07d2c),var(--gold-bright,#f3cd6a));border-radius:4px}
.rsr-rkn{font-size:calc(11px * var(--fz,1));color:#9b90c4;margin-top:2px}
.rsr-gb{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:4px}
.rsr-gbh{font-size:calc(12px * var(--fz,1));margin:0 0 8px}.rsr-gbh.g{color:var(--jade,#6fb295)}.rsr-gbh.b{color:var(--rose,#e3a0b4)}
.rsr-gbi{margin-bottom:11px}
.rsr-gbt{display:flex;align-items:center;font-size:calc(13px * var(--fz,1));color:var(--gold-pale,#ecd8a4);font-weight:600}.rsr-gbt .rsr-aski{margin-left:auto}
.rsr-gbn{font-size:calc(11px * var(--fz,1));color:#9b90c4;margin-top:2px;line-height:1.5}
.rsr-job{display:flex;align-items:center;gap:8px;font-size:calc(13px * var(--fz,1));margin:7px 0;padding:8px 11px;border:1px solid var(--jade,#6fb295);border-radius:11px}
.rsr-job.bad{border-color:var(--rose,#e3a0b4)}.rsr-job.mode{border-color:var(--gold-bright,#f3cd6a);background:rgba(217,177,74,.08)}
.rsr-jn{flex:1}.rsr-jn b{color:var(--jade,#6fb295)}.rsr-job.bad .rsr-jn b{color:var(--rose,#e3a0b4)}.rsr-job.mode .rsr-jn b{color:var(--gold-bright,#f3cd6a)}.rsr-jd{font-size:calc(11.5px * var(--fz,1));color:#bcaed4}
.rsr-cyc{display:flex;align-items:center;gap:10px;font-size:calc(13px * var(--fz,1));margin:7px 0;padding:7px 11px;border:1px solid var(--ink-line,#2e2660);border-radius:11px;background:rgba(36,28,88,.25)}
.rsr-cyc .a{flex:none;width:62px;color:var(--gold-pale,#ecd8a4)}.rsr-cyc .nn{flex:1;font-size:calc(11.5px * var(--fz,1));color:#bcaed4}
/* 職業分析精簡版:發展模式主角卡 + 適合/不適合標籤 */
.rsr-dm{position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(217,177,74,.14),rgba(217,177,74,.04));border:1px solid var(--gold-deep,#a07d2c);border-radius:14px;padding:14px 16px;margin:2px 0 6px}
.rsr-dm::before{content:'';position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,var(--gold-bright,#f3cd6a),var(--gold-deep,#a07d2c))}
.rsr-dmk{font-size:calc(11px * var(--fz,1));letter-spacing:.22em;color:var(--gold,#d9b14a);margin-bottom:5px}
.rsr-dmt{font-family:var(--font-brush,serif);font-size:calc(20px * var(--fz,1));font-weight:700;color:var(--gold-pale,#ecd8a4);letter-spacing:.06em;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.rsr-dmn{font-size:calc(13px * var(--fz,1));line-height:1.85;color:var(--cream,#f1e7cf)}
.rsr-jh{font-size:calc(12px * var(--fz,1));letter-spacing:.14em;margin:14px 0 9px;display:flex;align-items:center;gap:7px}
.rsr-jh .dot{width:7px;height:7px;border-radius:50%}
.rsr-jh.good{color:var(--jade,#6fb295)}.rsr-jh.good .dot{background:var(--jade,#6fb295)}
.rsr-jh.bad{color:var(--rose,#e3a0b4)}.rsr-jh.bad .dot{background:var(--vermillion,#cf4344)}
.rsr-tags{display:flex;flex-wrap:wrap;gap:8px}
.rsr-tag{font-size:calc(13px * var(--fz,1));color:var(--gold-pale,#ecd8a4);background:rgba(111,178,149,.10);border:1px solid rgba(111,178,149,.42);border-radius:20px;padding:6px 14px;cursor:pointer;transition:background .15s}
.rsr-tag::after{content:'✦';font-size:calc(9px * var(--fz,1));color:var(--jade,#6fb295);margin-left:6px;opacity:.7}
.rsr-tag.plain::after{content:none;}
.rsr-tag:hover{background:rgba(111,178,149,.2)}
.rsr-tag.bad{color:var(--muted,#9b90c4);background:rgba(207,67,68,.07);border-color:rgba(207,67,68,.34)}
.rsr-tag.bad::after{color:var(--vermillion,#cf4344)}
.rsr-tag.bad:hover{background:rgba(207,67,68,.15)}
.rsr-thint{font-size:calc(11px * var(--fz,1));color:var(--muted-dim,#6f6699);margin-top:11px}
.rsr-dom{display:flex;align-items:flex-start;gap:8px;font-size:calc(13px * var(--fz,1));margin:8px 0}
.rsr-dom .tx{flex:1;padding-left:78px;position:relative;line-height:1.7}.rsr-dom .rsr-dl{position:absolute;left:0;top:1px;font-size:calc(11px * var(--fz,1));color:var(--gold,#d9b14a);border:1px solid var(--gold-deep,#a07d2c);border-radius:9px;padding:1px 7px}
.rsr-fy{border:1px solid var(--gold-deep,#a07d2c);border-radius:13px;padding:12px 13px;margin:8px 0;background:rgba(217,177,74,.06)}
.rsr-fyh{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.rsr-fyh b{color:var(--gold-bright,#f3cd6a);font-size:calc(15px * var(--fz,1))}
.rsr-fyi{display:flex;align-items:center;gap:7px;font-size:calc(12.5px * var(--fz,1));margin:6px 0;padding-bottom:6px;border-bottom:1px solid rgba(46,38,96,.6)}
.rsr-fyi .k{flex:none;width:30px;color:var(--gold,#d9b14a);font-size:calc(11px * var(--fz,1))}.rsr-fyi .v{flex:1;color:var(--cream,#f1e7cf)}
.rsr-mo{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:6px}
.rsr-moc{position:relative;border:1px solid var(--ink-line,#2e2660);border-radius:10px;padding:8px 6px;text-align:center;background:rgba(36,28,88,.3)}
.rsr-moc .rsr-aski{position:absolute;top:4px;right:4px;width:16px;height:16px;font-size:calc(8.5px * var(--fz,1));margin:0}
.rsr-moc .m{font-size:calc(12px * var(--fz,1));color:var(--gold-pale,#ecd8a4)}.rsr-moc .t{font-size:calc(10.5px * var(--fz,1));color:#9b90c4;margin-top:2px}
/* 逐月流月運勢卡 */
.rsr-ml{display:flex;flex-direction:column;gap:9px;margin-top:6px}
.rsr-mc{border:1px solid var(--ink-line,#2e2660);border-radius:13px;padding:11px 13px;background:rgba(36,28,88,.22)}
.rsr-mc.hi{border-color:var(--gold-bright,#f3cd6a);background:rgba(217,177,74,.08)}
.rsr-mc.lo{border-color:rgba(227,160,180,.5)}
.rsr-mch{display:flex;align-items:center;gap:9px;margin-bottom:4px;flex-wrap:wrap}
.rsr-mch .mm{flex:none;font-size:calc(14.5px * var(--fz,1));font-weight:700;color:var(--gold-bright,#f3cd6a)}
.rsr-mch .th{font-size:calc(11px * var(--fz,1));color:var(--gold,#d9b14a);border:1px solid var(--gold-deep,#a07d2c);border-radius:9px;padding:1px 8px}
.rsr-mch .rsr-aski{margin-left:auto}
.rsr-mc .bd{font-size:calc(12.5px * var(--fz,1));color:var(--cream,#f1e7cf);line-height:1.75}
.rsr-mc .ft{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px;font-size:calc(11px * var(--fz,1));color:#bcaed4}
.rsr-mc .ft span b{color:var(--gold-pale,#ecd8a4);font-weight:400}
.rsr-ls{position:relative;padding-left:30px;margin:9px 2px}
.rsr-ls::before{content:'';position:absolute;left:10px;top:4px;bottom:18px;width:2px;background:var(--gold-deep,#a07d2c)}
.rsr-lss{position:relative;margin-bottom:13px}
.rsr-lss::before{content:'';position:absolute;left:-23px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--gold-bright,#f3cd6a);box-shadow:0 0 6px rgba(243,205,106,.5)}
/* 感情分析:標籤+✦ 一行,內文整行在下 */
.rsr-love{margin:11px 0}
.rsr-loveh{display:flex;align-items:center;margin-bottom:5px}
.rsr-loveh .rsr-dl{position:static;font-size:calc(11px * var(--fz,1));color:var(--gold,#d9b14a);border:1px solid var(--gold-deep,#a07d2c);border-radius:9px;padding:2px 10px}
.rsr-loveh .rsr-aski{margin-left:auto}
.rsr-lovet{font-size:calc(13px * var(--fz,1));line-height:1.78;color:var(--cream,#f1e7cf)}
.rsr-lss .hd{display:flex;align-items:center;gap:8px}.rsr-lss .a{font-size:calc(12px * var(--fz,1));color:var(--gold,#d9b14a)}.rsr-lss b{color:var(--gold-pale,#ecd8a4);font-size:calc(13.5px * var(--fz,1))}.rsr-lss .d{font-size:calc(12.5px * var(--fz,1));color:#bcaed4;margin-top:2px}
/* === 大限漏斗 DXFunnel(時序段:大限/大運/dasha)=== */
.dxf-row{display:flex;align-items:stretch;gap:8px;margin:6px 0 2px}
.dxf-scale{position:relative;flex:0 0 56px;height:360px;touch-action:none;cursor:grab}
.dxf-scale.drag{cursor:grabbing}
.dxf-line{position:absolute;right:5px;top:10px;bottom:10px;width:2px;border-radius:2px;
  background:linear-gradient(180deg,transparent,var(--gold-deep,#a07d2c) 8%,var(--gold-deep,#a07d2c) 92%,transparent)}
.dxf-fill{position:absolute;right:5px;top:10px;width:2px;border-radius:2px;
  background:linear-gradient(180deg,var(--gold-bright,#f3cd6a),var(--gold,#d9b14a));opacity:.6}
.dxf-tick{position:absolute;right:5px;transform:translateY(-50%);display:flex;align-items:center;gap:5px;
  justify-content:flex-end;pointer-events:none;white-space:nowrap}
.dxf-tick i{width:7px;height:2px;background:var(--gold-deep,#a07d2c);opacity:.75;border-radius:2px}
.dxf-tick span{font-size:calc(9.5px * var(--fz,1));color:var(--muted-dim,#9a90c6);font-variant-numeric:tabular-nums;letter-spacing:.2px}
.dxf-tick.cur span{color:var(--gold-bright,#f3cd6a);font-weight:700}
.dxf-tick.cur i{background:var(--gold-bright,#f3cd6a);width:9px;box-shadow:0 0 5px rgba(243,205,106,.6)}
.dxf-thumb{position:absolute;right:6px;width:11px;height:40px;transform:translate(50%,-50%);z-index:4;
  border-radius:6px;background:linear-gradient(180deg,var(--gold-bright,#f3cd6a),var(--gold,#d9b14a) 60%,var(--gold-deep,#a07d2c));
  box-shadow:0 2px 8px rgba(0,0,0,.4),0 0 12px rgba(243,205,106,.5),inset 0 1px 0 rgba(255,255,255,.45);
  border:1px solid #f6d88a}
.dxf-note{font-size:calc(11px * var(--fz,1));color:var(--muted-dim,#9a90c6);line-height:1.65;margin:8px 2px 0;letter-spacing:.2px}
.dxf-vp{position:relative;flex:1;height:360px;overflow:hidden;touch-action:none;user-select:none;cursor:grab}
.dxf-vp.drag{cursor:grabbing}
.dxf-vp::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:3;
  background:linear-gradient(180deg,var(--void,#06051a),transparent 15%,transparent 85%,var(--void,#06051a))}
.dxf-dx{position:absolute;left:2px;right:4px;top:0;will-change:transform;overflow:hidden;z-index:2;
  border:1px solid transparent;border-radius:12px;padding:0 12px;
  background:linear-gradient(180deg,rgba(48,38,104,calc(.55*var(--a,0))),rgba(28,22,66,calc(.42*var(--a,0))));
  border-color:rgba(46,38,96,var(--a,0))}
.dxf-dx.cur{background:linear-gradient(180deg,rgba(74,58,122,calc(.62*var(--a,0))),rgba(36,26,78,calc(.46*var(--a,0))));
  border-color:rgba(160,125,44,var(--a,0))}
.dxf-dx .hd{display:flex;align-items:center;height:30px}
.dxf-dx .age{font-size:calc(11.5px * var(--fz,1));color:var(--gold,#d9b14a);font-variant-numeric:tabular-nums;letter-spacing:.3px;white-space:nowrap}
.dxf-dx .badge{font-size:calc(9.5px * var(--fz,1));color:#1a1330;background:var(--gold-bright,#f3cd6a);border-radius:8px;padding:1px 7px;margin-left:8px;font-weight:700}
.dxf-dx .rsr-aski{margin-left:auto}
.dxf-dx .body{overflow:hidden}
.dxf-dx .theme{color:var(--gold-pale,#ecd8a4);font-size:calc(13.5px * var(--fz,1));font-weight:600}
.dxf-dx .note{font-size:calc(12.5px * var(--fz,1));line-height:1.7;color:#bcaed4;margin-top:3px}
.dxf-cap{font-size:calc(11px * var(--fz,1));color:var(--muted-dim,#9a90c6);text-align:center;margin-top:6px;line-height:1.6}
.dxf-plain .dxf-solo{margin:9px 2px 9px 14px;position:relative}
.dxf-plain .dxf-solo::before{content:'';position:absolute;left:-12px;top:6px;width:7px;height:7px;border-radius:50%;background:var(--gold-bright,#f3cd6a);box-shadow:0 0 6px rgba(243,205,106,.5)}
.dxf-solo .hd{display:flex;align-items:center}.dxf-solo .age{font-size:calc(12px * var(--fz,1));color:var(--gold,#d9b14a)}.dxf-solo .rsr-aski{margin-left:auto}
.dxf-solo .theme{color:var(--gold-pale,#ecd8a4);font-size:calc(13.5px * var(--fz,1));font-weight:600;margin-top:2px}
.dxf-solo .note{font-size:calc(12.5px * var(--fz,1));line-height:1.7;color:#bcaed4;margin-top:2px}
/* 列印/PDF 網頁版退場:漏斗改常規展開(伺服器 PDF 另走 report_pdf,不受此影響)*/
@media print{ .dxf-scale{display:none} .dxf-vp{height:auto;overflow:visible} .dxf-vp::after{display:none}
  .dxf-dx{position:static;transform:none!important;height:auto!important;opacity:1!important;--a:1;margin:6px 0} }
.rsr-tiph{font-size:calc(12.5px * var(--fz,1));color:var(--gold-pale,#ecd8a4);margin:12px 0 5px}
.rsr-tipi{display:flex;align-items:flex-start;gap:8px;font-size:calc(12.5px * var(--fz,1));margin:5px 0}.rsr-tipi .tx{flex:1}.rsr-tipi::before{content:'◆';color:var(--gold,#d9b14a);font-size:calc(9px * var(--fz,1));margin-top:4px}

/* === 分門派新段:元素配置 / 三大星 / Dasha(2026-06-30) === */
.rsr-elems{display:flex;gap:8px;margin:6px 0}
.rsr-elems.sm{margin-top:8px}
.rsr-elems .el{flex:1;text-align:center;border:1px solid var(--ink-line,#2e2660);border-radius:11px;padding:8px 4px;background:rgba(36,28,88,.3);font-size:calc(12px * var(--fz,1));color:var(--gold-pale,#ecd8a4)}
.rsr-elems .el b{display:block;font-size:calc(18px * var(--fz,1));margin-top:3px;color:var(--gold-bright,#f3cd6a)}
.rsr-elems .el.f{border-color:rgba(207,67,68,.5)}.rsr-elems .el.e{border-color:rgba(111,178,149,.5)}
.rsr-elems .el.a{border-color:rgba(111,143,214,.5)}.rsr-elems .el.w{border-color:rgba(154,74,130,.6)}
.rsr-big3{display:flex;flex-direction:column;gap:9px;margin-top:6px}
.rsr-b3{border:1px solid var(--ink-line,#2e2660);border-radius:13px;padding:11px 13px;background:rgba(36,28,88,.22)}
.rsr-b3 .hd{display:flex;align-items:center;gap:9px;margin-bottom:4px}
.rsr-b3 .sy{font-size:calc(18px * var(--fz,1));color:var(--gold-bright,#f3cd6a)}
.rsr-b3 .lb{font-size:calc(13.5px * var(--fz,1));font-weight:700;color:var(--gold-bright,#f3cd6a)}
.rsr-b3 .sg{font-size:calc(11px * var(--fz,1));color:var(--gold,#d9b14a);border:1px solid var(--gold-deep,#a07d2c);border-radius:9px;padding:1px 8px;margin-left:auto}
.rsr-b3 .bd{font-size:calc(12.5px * var(--fz,1));color:var(--cream,#f1e7cf);line-height:1.75}
.rsr-dasha{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.rsr-dz{display:flex;align-items:center;gap:10px;font-size:calc(12.5px * var(--fz,1));padding:8px 11px;border:1px solid var(--ink-line,#2e2660);border-radius:11px;background:rgba(36,28,88,.25)}
.rsr-dz.now{border-color:var(--gold-bright,#f3cd6a);background:rgba(217,177,74,.1)}
.rsr-dz .a{flex:none;width:96px;color:var(--gold-pale,#ecd8a4)}.rsr-dz .p{flex:none;width:64px;color:var(--gold-bright,#f3cd6a)}.rsr-dz .n{flex:1;color:#bcaed4;font-size:calc(11px * var(--fz,1))} /* #bcaed4 同 .rsr-lss .d */
.rsr-dcur{margin-top:10px;padding:11px 13px;border:1px solid var(--gold-deep,#a07d2c);border-radius:12px;background:rgba(217,177,74,.06);font-size:calc(13px * var(--fz,1));line-height:1.8;color:var(--cream,#f1e7cf)}
.rsr-dcur b{color:var(--gold-bright,#f3cd6a)}

/* 報告主頁:價值說明 + 命盤頁底部 CTA */
.rep-getbox{border:1px solid var(--gold-deep,#a07d2c);border-radius:14px;padding:14px;margin:14px 0;background:rgba(217,177,74,.05)}
.rep-geth{font-size:calc(12px * var(--fz,1));letter-spacing:.2em;color:var(--gold,#d9b14a);text-align:center;margin-bottom:10px}
.rep-gets{display:flex;flex-direction:column;gap:8px}
.rep-get{display:flex;gap:9px;align-items:flex-start;font-size:calc(13px * var(--fz,1));color:var(--cream,#f1e7cf)}
.rep-get .n{flex:none;width:21px;height:21px;border-radius:50%;background:rgba(217,177,74,.16);color:var(--gold-bright,#f3cd6a);display:flex;align-items:center;justify-content:center;font-size:calc(11px * var(--fz,1));margin-top:1px}
.rep-get b{color:var(--gold-pale,#ecd8a4)}
.rep-pickt{font-size:calc(12.5px * var(--fz,1));letter-spacing:.15em;color:var(--gold,#d9b14a);text-align:center;margin:18px 0 10px}
.zov-more{margin-top:26px;border:1px solid var(--gold-deep,#a07d2c);border-radius:16px;padding:18px 15px;text-align:center;background:linear-gradient(165deg,rgba(70,52,18,.25),rgba(36,28,88,.3))}
.zov-more-t{font-size:calc(14px * var(--fz,1));color:var(--gold-bright,#f3cd6a);line-height:1.7}
.zov-more-t b{color:var(--gold-bright,#f3cd6a)}
.zov-more-d{font-size:calc(12px * var(--fz,1));color:#9b90c4;margin:8px 0 13px;line-height:1.7}
.zov-more-btn{width:100%;background:var(--gold-bright,#f3cd6a);color:#1b1542;font-weight:700;border:none;border-radius:12px;padding:13px;font-size:calc(14.5px * var(--fz,1));font-family:var(--font-body,'Noto Serif TC',serif);cursor:pointer;letter-spacing:.04em}

/* 下載 PDF 選單(主題色 / 白底) */
.pdfc{display:flex;flex-direction:column;gap:10px;margin:8px 0 14px}
.pdfc-opt{display:block;text-align:left;border:1px solid var(--gold-deep,#a07d2c);border-radius:12px;padding:12px 14px;background:rgba(36,28,88,.4);color:var(--cream,#f1e7cf);text-decoration:none}
.pdfc-opt:hover{border-color:var(--gold-bright,#f3cd6a)}
.pdfc-opt b{display:block;font-size:calc(14px * var(--fz,1));color:var(--gold-bright,#f3cd6a)}
.pdfc-opt span{font-size:calc(11.5px * var(--fz,1));color:#9b90c4}

/* 分門派合盤 */
.rsy-hero{text-align:center;padding:6px 0 2px}
.rsy-type{font-size:calc(12px * var(--fz,1));color:var(--gold,#d9b14a);letter-spacing:.1em}
.rsy-one{font-size:calc(19px * var(--fz,1));font-weight:700;color:var(--gold-bright,#f3cd6a);margin:8px 0 13px;line-height:1.55}
.rsy-score{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:96px;height:96px;border-radius:50%;border:2px solid var(--gold-bright,#f3cd6a);background:rgba(217,177,74,.08)}
.rsy-score b{font-size:calc(34px * var(--fz,1));color:var(--gold-bright,#f3cd6a);line-height:1}.rsy-score span{font-size:calc(10px * var(--fz,1));color:#9b90c4;margin-top:3px}
.rsy-sc{display:flex;align-items:center;gap:10px;margin:8px 0;font-size:calc(13px * var(--fz,1))}
.rsy-sc .l{flex:none;width:48px;color:var(--gold-pale,#ecd8a4)}
.rsy-sc .t{flex:1;display:block;height:7px;background:rgba(46,38,96,.8);border-radius:4px;overflow:hidden}
.rsy-sc .f{display:block;height:100%;background:linear-gradient(90deg,var(--gold-deep,#a07d2c),var(--gold-bright,#f3cd6a));border-radius:4px}
.rsy-sc .v{flex:none;width:26px;text-align:right;color:var(--gold-bright,#f3cd6a)}
.rsy-tw{font-size:calc(13px * var(--fz,1));color:var(--gold-pale,#ecd8a4);margin:6px 0;line-height:1.75}.rsy-tw b{color:var(--gold-bright,#f3cd6a)}
/* 合盤 · 逐面向深評卡 */
.rsy-fl{display:flex;flex-direction:column;gap:9px;margin-top:6px}
.rsy-fc{border:1px solid var(--ink-line,#2e2660);border-radius:13px;padding:11px 13px;background:rgba(36,28,88,.22)}
.rsy-fch{display:flex;align-items:center;gap:9px;margin-bottom:5px}
.rsy-fch .nm{flex:none;font-size:calc(13.5px * var(--fz,1));font-weight:700;color:var(--gold-bright,#f3cd6a)}
.rsy-fch .t{flex:1;display:block;height:7px;background:rgba(46,38,96,.8);border-radius:4px;overflow:hidden}
.rsy-fch .f{display:block;height:100%;background:linear-gradient(90deg,var(--gold-deep,#a07d2c),var(--gold-bright,#f3cd6a));border-radius:4px}
.rsy-fch .v{flex:none;width:24px;text-align:right;color:var(--gold-bright,#f3cd6a);font-size:calc(11.5px * var(--fz,1))}
.rsy-fch .rsr-aski{margin-left:0}
.rsy-fc .bd{font-size:calc(12.5px * var(--fz,1));color:var(--cream,#f1e7cf);line-height:1.78}

/* 各命盤通用浮鈕:點盤面元素後浮出二次確認鈕,尾巴向下指該元素,點它才送出問句(2026-07) */
.chart-askbtn{position:fixed;z-index:40;font-family:var(--font-brush,'LXGW WenKai TC',serif);font-size:calc(13px * var(--fz,1));font-weight:700;letter-spacing:.04em;
  color:#241803;background:linear-gradient(135deg,#f8d98a,#d9b14a);border:none;border-radius:999px;padding:7px 15px;cursor:pointer;
  box-shadow:0 6px 18px -4px rgba(240,200,96,.6),0 2px 8px rgba(0,0,0,.45);white-space:nowrap;animation:zwAskIn .16s ease both;}
.chart-askbtn:active{transform:scale(.95);}
/* 尾巴:預設浮在目標上方 → 三角朝下正對目標;.below 時浮下方 → 三角朝上 */
.chart-askbtn::after{content:'';position:absolute;left:var(--tail-x,50%);top:100%;transform:translateX(-50%);
  width:0;height:0;border:6px solid transparent;border-top-color:#dcb24b;filter:drop-shadow(0 2px 1.5px rgba(0,0,0,.3));}
.chart-askbtn.below::after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:#f6d580;}
@keyframes zwAskIn{from{opacity:0;transform:translateY(4px) scale(.94);}to{opacity:1;transform:none;}}
.ask-sel{outline:1.5px solid rgba(240,200,96,.65);outline-offset:-1px;}

/* 命盤引導行:排盤後在盤下附一行大師引導,教使用者點盤面就地細問(可點盤才顯示)*/
.chart-tap-hint{margin:9px 4px 2px;font-family:var(--font-body,'Noto Serif TC',serif);font-size:calc(11.5px * var(--fz,1));letter-spacing:.05em;
  color:var(--gold-pale,#ecd8a4);display:flex;align-items:center;gap:8px;line-height:1.5;animation:tapHintIn .45s ease both;}
.chart-tap-hint::before{content:'';flex:none;width:15px;height:15px;border-radius:50%;
  border:1.5px solid var(--gold,#d9b14a);background:radial-gradient(circle,var(--gold-bright,#f3cd6a) 32%,transparent 36%);
  animation:tapPulse 1.9s ease-in-out infinite;}
@keyframes tapHintIn{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
@keyframes tapPulse{0%,100%{box-shadow:0 0 0 0 rgba(240,200,96,.45)}50%{box-shadow:0 0 0 6px rgba(240,200,96,0)}}
@media (prefers-reduced-motion:reduce){ .chart-tap-hint,.chart-tap-hint::before{animation:none !important} }

/* ===== 玄一道長 · 擇日圖卡(全部 scope 在 .zeri-card 下,避免與其他卡衝突) ===== */
.msg--zeri{max-width:100%!important;align-self:stretch!important;background:transparent!important;border:none!important;padding:0!important}
.msg--zeri::before{display:none!important}
.forum-zcard{display:block;margin:8px 0 16px;max-width:100%}
.forum-zcard .zeri-card{max-width:none}
.zeri-card{position:relative;border-radius:16px;overflow:hidden;
  background:linear-gradient(168deg,rgba(30,36,58,.72),rgba(16,16,40,.95) 60%);
  border:1px solid rgba(163,125,44,.55);box-shadow:0 20px 46px -18px rgba(0,0,0,.85)}
.zeri-card::before{content:'';position:absolute;inset:6px;border:1px solid rgba(236,216,164,.14);border-radius:11px;pointer-events:none;z-index:1}
.zeri-card .zc-in{position:relative;z-index:2;padding:16px 14px 14px}
.zeri-card .zc-head{text-align:center;margin-bottom:12px}
.zeri-card .zc-eyebrow{font-family:var(--font-display,'Cinzel',serif);font-size:calc(9px * var(--fz,1));letter-spacing:.34em;color:var(--gold,#d9b14a);text-transform:uppercase;padding-left:.34em}
.zeri-card .zc-title{font-size:calc(17px * var(--fz,1));font-weight:700;letter-spacing:.16em;color:var(--cream,#f1e7cf);margin-top:5px;padding-left:.16em}
.zeri-card .zc-sub{font-size:calc(11px * var(--fz,1));letter-spacing:.05em;color:var(--muted-dim,#9a90c6);margin-top:6px}
.zeri-card .zc-sub b{color:var(--gold-pale,#ecd8a4);font-weight:400}
.zeri-card .zc-rule{height:1px;background:linear-gradient(90deg,transparent,rgba(217,177,74,.4),transparent);margin:12px 2px}
.zeri-card .zd{position:relative;border:1px solid var(--ink-line,#2e2660);border-radius:13px;background:rgba(9,7,30,.5);padding:12px 12px 11px;margin-bottom:10px}
.zeri-card .zd.open{cursor:default}
.zeri-card .zd-top{border-color:var(--gold-bright,#f3cd6a);background:linear-gradient(168deg,rgba(52,42,20,.42),rgba(16,16,40,.85));
  box-shadow:0 0 0 3px var(--void,#07061c),0 0 0 4px var(--gold-deep,#a07d2c),0 0 22px -6px rgba(243,205,106,.4)}
.zeri-card .zd-flag{position:absolute;top:-1px;right:12px;font-size:calc(9.5px * var(--fz,1));letter-spacing:.2em;color:#241803;font-weight:700;
  background:linear-gradient(135deg,#f3cd6a,#d9b14a);border-radius:0 0 7px 7px;padding:3px 10px 3px calc(10px + .2em)}
.zeri-card .zd-head{display:flex;align-items:baseline;gap:8px}
.zeri-card .zd-date b{font-size:calc(22px * var(--fz,1));font-weight:700;color:var(--gold-pale,#ecd8a4);letter-spacing:.02em}
.zeri-card .zd-top .zd-date b{color:var(--gold-bright,#f3cd6a)}
.zeri-card .zd-date span{font-size:calc(12px * var(--fz,1));color:var(--muted,#c0b6e8);margin-left:8px;letter-spacing:.05em}
.zeri-card .zd-verdict{margin-left:auto;font-size:calc(11px * var(--fz,1));letter-spacing:.1em;padding:3px 10px;border-radius:999px;font-weight:600}
.zeri-card .zd-verdict.ok{color:var(--jade,#6fb295);border:1px solid rgba(111,178,149,.5);background:rgba(111,178,149,.1)}
.zeri-card .zd-verdict.warn{color:var(--gold-bright,#f3cd6a);border:1px solid rgba(243,205,106,.5);background:rgba(243,205,106,.1)}
.zeri-card .zd-lunar{font-size:calc(10.5px * var(--fz,1));color:var(--muted-dim,#9a90c6);letter-spacing:.05em;margin:5px 0 9px}
.zeri-card .zd-lunar b{color:var(--gold-pale,#ecd8a4);font-weight:400}
.zeri-card .zd-tags{display:flex;flex-wrap:wrap;gap:6px}
.zeri-card .tag{font-size:calc(11px * var(--fz,1));letter-spacing:.03em;padding:3.5px 9px;border-radius:8px;border:1px solid var(--ink-line,#2e2660);color:var(--muted,#c0b6e8);background:rgba(0,0,0,.2)}
.zeri-card .tag i{font-style:normal;font-weight:700}
.zeri-card .tag.good{color:var(--jade,#6fb295);border-color:rgba(111,178,149,.45)}.zeri-card .tag.good i{color:var(--jade,#6fb295)}
.zeri-card .tag.bad{color:var(--vermillion,#cf4344);border-color:rgba(207,67,68,.4)}.zeri-card .tag.bad i{color:var(--vermillion,#cf4344)}
.zeri-card .tag.half{color:var(--muted,#c0b6e8)}
.zeri-card .tag.gold{color:var(--gold-pale,#ecd8a4);border-color:rgba(217,177,74,.5)}.zeri-card .tag.gold i{color:var(--gold-bright,#f3cd6a)}
/* 「對你」= 全卡最關鍵的個人沖刑資訊 → 做成實心填色強調 chip(其他農民曆 tag 為描邊透明,
   對你實心填色 + 「對你」標籤小膠囊,自然最跳、一眼看出對本人吉凶) */
.zeri-card .rel{font-size:calc(11.5px * var(--fz,1));letter-spacing:.02em;padding:4px 10px 4px 5px;border-radius:8px;font-weight:700;display:inline-flex;align-items:center;gap:6px}
.zeri-card .rel .lb{font-weight:700;font-size:calc(9px * var(--fz,1));letter-spacing:.08em;opacity:1;margin-right:0;padding:2.5px 6px;border-radius:6px;background:rgba(0,0,0,.22)}
/* 無沖刑害破 = 對你安全的綠燈(原本灰色最不起眼 → 改實心翠綠) */
.zeri-card .rel.none{color:#0a2019;border:1px solid rgba(111,178,149,.85);background:linear-gradient(135deg,#9fdcc0,#6fb295);box-shadow:0 2px 12px -4px rgba(111,178,149,.6)}
.zeri-card .rel.none .lb{background:rgba(10,32,25,.2);color:#0a2019}
/* 相合本命 = 大吉,實心翠(更飽和) */
.zeri-card .rel.he{color:#0a2019;border:1px solid rgba(111,178,149,.9);background:linear-gradient(135deg,#8fd8bb,#5ea184);box-shadow:0 2px 12px -4px rgba(111,178,149,.6)}
.zeri-card .rel.he .lb{background:rgba(10,32,25,.2);color:#0a2019}
/* 正沖本命 = 危險,實心朱紅(擇日第一關就破) */
.zeri-card .rel.zheng{color:#fff;border:1px solid rgba(207,67,68,.85);background:linear-gradient(135deg,#e0595a,#c23d3f);box-shadow:0 2px 12px -4px rgba(207,67,68,.6)}
.zeri-card .rel.zheng .lb{background:rgba(0,0,0,.28)}
/* 偏沖 = 留意,描金填淺(比一般 tag 明顯,但不到危險等級) */
.zeri-card .rel.pian{color:var(--gold-bright,#f3cd6a);border:1px solid rgba(243,205,106,.7);background:rgba(243,205,106,.16)}
.zeri-card .rel.pian .lb{background:rgba(243,205,106,.15)}
.zeri-card .zd-yj{display:flex;gap:8px;margin-top:9px;font-size:calc(12px * var(--fz,1));line-height:1.7;color:var(--cream,#f1e7cf);align-items:flex-start}
.zeri-card .zd-yj i{flex:none;font-style:normal;width:19px;height:19px;border-radius:5px;display:grid;place-items:center;font-size:calc(11px * var(--fz,1));font-weight:700;margin-top:1px;background:rgba(111,178,149,.16);color:var(--jade,#6fb295);border:1px solid rgba(111,178,149,.4)}
.zeri-card .zd-yj span{color:var(--muted,#c0b6e8)}
.zeri-card .zd-hint{margin-top:10px;font-size:calc(10.5px * var(--fz,1));letter-spacing:.1em;color:var(--muted-dim,#9a90c6);text-align:center}
.zeri-card .zd.open .zd-hint{display:none}
.zeri-card .zd-detail{display:block;margin-top:11px;padding-top:11px;border-top:1px solid var(--line-soft,#221b50)}
.zeri-card .zd.open .zd-detail{display:block;animation:zdOpen .28s ease}
@keyframes zdOpen{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.zeri-card .zd-hours{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.zeri-card .zd-hours .hl{font-size:calc(10.5px * var(--fz,1));letter-spacing:.12em;color:var(--jade,#6fb295)}
.zeri-card .zd-hours .h{font-size:calc(11px * var(--fz,1));color:var(--muted,#c0b6e8);padding:2.5px 7px;border-radius:7px;border:1px solid rgba(111,178,149,.3);background:rgba(111,178,149,.06)}
.zeri-card .zd-hours .h.best{color:#241803;background:linear-gradient(135deg,#f3cd6a,#d9b14a);border-color:var(--gold-bright,#f3cd6a);font-weight:700}
.zeri-card .zd-note{margin-top:10px;padding:9px 11px;border-radius:9px;background:rgba(217,177,74,.06);border:1px solid rgba(217,177,74,.2);font-size:calc(11.5px * var(--fz,1));line-height:1.75;color:var(--gold-pale,#ecd8a4);letter-spacing:.02em}
.zeri-card .zd-foot{display:flex;justify-content:flex-end;margin-top:11px}
.zeri-card .zd-ask{display:inline-flex;align-items:center;gap:7px;cursor:pointer;font-family:var(--font-body,serif);font-size:calc(12px * var(--fz,1));letter-spacing:.06em;color:#241803;font-weight:700;background:linear-gradient(135deg,#f3cd6a,#d9b14a);border:none;border-radius:999px;padding:7px 14px 7px 9px;box-shadow:0 6px 16px -6px rgba(217,177,74,.6)}
.zeri-card .zd-ask .av{width:19px;height:19px;border-radius:50%;background:rgba(0,0,0,.18);display:grid;place-items:center;font-size:calc(10px * var(--fz,1));color:#241803}
.zeri-card .zc-foot{margin-top:12px;text-align:center;font-size:calc(9.5px * var(--fz,1));letter-spacing:.05em;color:var(--muted-dim,#9a90c6);line-height:1.7}

.zeri-card .zd-verdict.no{color:var(--vermillion,#cf4344);border:1px solid rgba(207,67,68,.45);background:rgba(207,67,68,.1)}

/* ============================================================
 * 吠陀 Dasha 時間軸 (.vd-*)
 * ============================================================ */
.vd-dasha{margin-top:12px;border-top:1px solid var(--line-soft);padding-top:10px}
.vd-h{font-size:calc(12px * var(--fz,1));color:var(--muted-dim);letter-spacing:.1em;margin-bottom:6px}
.vd-row{display:flex;align-items:center;gap:10px;padding:5px 8px;border-radius:8px;font-size:calc(13px * var(--fz,1))}
.vd-row.now{background:rgba(217,177,74,.12);border:1px solid var(--gold)}
.vd-lord{font-family:var(--font-brush);color:var(--cream);min-width:2.5em}
.vd-yrs{color:var(--muted);font-variant-numeric:tabular-nums}
.vd-antar{margin-left:auto;color:var(--gold-bright);font-size:calc(12px * var(--fz,1))}

/* 吠陀吉凶瑜伽:此盤未偵測到任何古典格局時的替代呈現。
   原本本文區整塊空白,只剩標題與一段安慰話,讀起來像壞掉;
   改成明講「查過哪些、都不成立」——沿用既有靛金色系,不自創配色。 */
.rsr-none{border:1px dashed var(--line,#2e2660);border-radius:11px;padding:11px 13px;margin:7px 0;
  font-size:calc(13px * var(--fz,1));color:var(--gold-pale,#ecd8a4);background:rgba(255,255,255,.02)}
.rsr-none span{display:block;margin-top:5px;font-size:calc(11.5px * var(--fz,1));line-height:1.75;color:var(--muted-dim,#9a90c6)}