/* 合盤樣式（從主CSS拆分） */
/* ============ 合盤模組樣式 ============ */
.hp-partner-box {
  margin-top: 18px;
  overflow: hidden;
}
.hp-partner-body { padding: 0; }
.hp-section-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--accent);
  margin: 0 0 14px 0;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--gold-light);
  letter-spacing: 1px;
}
.hp-school-selector {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  padding: 10px 14px;
  background: var(--card-2);
  border-radius: 10px;
  border: 1px solid var(--border-soft);
}
.hp-school-selector label {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-2);
}
.hp-emotion-bar {
  margin: 12px 0;
  padding: 12px 16px;
  background: var(--card-2);
  border-radius: 10px;
  border: 1px solid var(--border-soft);
}
.hp-emotion-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 6px 0;
}
.hp-emotion-label {
  font-size: 13px;
  font-weight: 600;
  min-width: 80px;
}
.hp-emotion-track {
  flex: 1;
  height: 14px;
  background: var(--border-soft);
  border-radius: 7px;
  overflow: hidden;
  position: relative;
}
.hp-emotion-fill {
  height: 100%;
  border-radius: 7px;
  transition: width 0.3s;
}
.hp-emotion-score {
  font-size: 13px;
  font-weight: 700;
  min-width: 50px;
  text-align: right;
}
/* 合盤控制欄（與個人盤一致） */
.hp-controls {
  background: var(--card-2);
  border-radius: 12px;
  padding: 14px 18px;
  margin: 14px 0;
  border: 1px solid var(--border-soft);
}
.hp-depth {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  margin-bottom: 12px;
}
.hp-depth label {
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.hp-depth input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
}
.hp-selects {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  align-items: center;
}
.hp-selects label {
  font-size: 13.5px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.hp-selects select {
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 14px;
  font-family: inherit;
  background: var(--card);
}
.hp-compare {
  margin-left: auto;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.hp-tag-a { background: linear-gradient(135deg, var(--hp-a), var(--hp-a-light)); color:#fff; font-weight: 700; padding:3px 12px; border-radius:14px; font-size:12.5px; display:inline-block; box-shadow: 0 2px 6px rgba(0,0,0,0.1); }
.hp-tag-b { background: linear-gradient(135deg, var(--hp-b), var(--hp-b-light)); color:#fff; font-weight: 700; padding:3px 12px; border-radius:14px; font-size:12.5px; display:inline-block; box-shadow: 0 2px 6px rgba(0,0,0,0.1); }
/* 合盤雙方配色：現代卡片式，柔和漸層＋圓角＋陰影 */
.hp-person-a {
  background: linear-gradient(135deg, var(--hp-a-bg) 0%, rgba(255,255,255,0.6) 100%);
  border-radius: 14px;
  padding: 16px 18px;
  margin: 14px 0;
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  position: relative;
  overflow: hidden;
}
.hp-person-a::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: linear-gradient(180deg, var(--hp-a), var(--hp-a-light));
}
.hp-person-b {
  background: linear-gradient(135deg, var(--hp-b-bg) 0%, rgba(255,255,255,0.6) 100%);
  border-radius: 14px;
  padding: 16px 18px;
  margin: 14px 0;
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  position: relative;
  overflow: hidden;
}
.hp-person-b::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: linear-gradient(180deg, var(--hp-b), var(--hp-b-light));
}
.hp-person-both {
  background: linear-gradient(135deg, var(--hp-both-bg) 0%, rgba(255,255,255,0.6) 100%);
  border-radius: 14px;
  padding: 16px 18px;
  margin: 14px 0;
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  position: relative;
  overflow: hidden;
}
.hp-person-both::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: linear-gradient(180deg, var(--hp-both), var(--hp-both-light));
}
.hp-person-a > p:first-child, .hp-person-b > p:first-child { margin-top:0 !important; }
.hp-person-a .hp-who { color:var(--hp-a); font-weight: 700; }
.hp-person-b .hp-who { color:var(--hp-b); font-weight: 700; }
.hp-row.a { background:var(--hp-a-bg); border-radius:5px; padding:2px 6px; }
.hp-row.b { background:var(--hp-b-bg); border-radius:5px; padding:2px 6px; }
.hp-row.a .hp-who { color:var(--hp-a); }
.hp-row.b .hp-who { color:var(--hp-b); }
.hp-legend { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; font-size:12.5px; margin:8px 0 2px; color:var(--ink-2); }
.hp-legend .lg { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.hp-legend .sw { width:13px; height:13px; border-radius:3px; display:inline-block; }
.hp-legend .sw.a { background:var(--hp-a); }
.hp-legend .sw.b { background:var(--hp-b); }
.hp-legend .sw.both { background:var(--hp-both); }
.hp-info-bar {
  background: var(--card-2);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  padding: 10px 14px;
  font-size: 13px;
  line-height: 1.9;
  margin-bottom: 14px;
}
/* 雙盤疊宮格 */
.hp-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(4, auto);
  gap: 1px;
  background: var(--border);
  border: 2px solid var(--gold-light);
  border-radius: 6px;
  overflow: hidden;
  width: 100%;
  max-width: 620px;
  margin: 10px 0 6px;
}
.hp-cell {
  background: var(--card);
  padding: 4px 5px;
  min-height: 74px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 10px;
  line-height: 1.4;
}
.hp-cell.empty { background: var(--bg-soft); }
.hp-cell.focus-cell { background: #fbf6ea; }
.hp-zhi {
  text-align: center;
  font-size: 10px;
  color: var(--faint);
  border-bottom: 1px dotted var(--border-soft);
  padding-bottom: 1px;
  margin-bottom: 1px;
}
.hp-row { display: flex; gap: 3px; align-items: baseline; }
.hp-row .hp-who { flex-shrink: 0; font-weight: 700; font-size: 10px; }
.hp-row.a .hp-who { color: var(--accent); }
.hp-row.b .hp-who { color: var(--jade); }
.hp-pname { color: var(--gold); font-weight: 600; font-size: 10px; }
.hp-stars { color: var(--ink-2); font-size: 10px; word-break: break-all; }
.hp-borrow { color: var(--muted); font-size: 9px; }
.hp-cell.hp-ming-a { outline: 2px solid var(--accent); outline-offset: -2px; z-index: 1; }
.hp-cell.hp-ming-b { outline: 2px dashed var(--jade); outline-offset: -2px; z-index: 1; }
.hp-legend { font-size: 12px; color: var(--muted); margin: 4px 0 16px; line-height: 1.8; }
/* 飛化條目 */
.hp-fly-group { margin-bottom: 14px; }
.hp-fly-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--accent);
  margin: 14px 0 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border-soft);
}
.hp-fly-item {
  background: var(--card-2);
  border-left: 3px solid var(--border);
  border-radius: 0 4px 4px 0;
  padding: 8px 12px;
  margin-bottom: 7px;
  font-size: 13px;
  line-height: 1.75;
}
.hp-fly-item.lu  { border-left-color: var(--gold); }
.hp-fly-item.quan{ border-left-color: var(--accent); }
.hp-fly-item.ke  { border-left-color: var(--jade); }
.hp-fly-item.ji  { border-left-color: var(--cinnabar); }
.hp-fly-chain { font-size: 12px; color: var(--ink-2); margin-top: 2px; }

/* ============================================================
   V17-4 合盤排版對齊個人盤（純外觀覆寫，不動任何計算與論斷）
   ============================================================ */
/* ===== 合盤與個人盤「同構」：表頭一張白卡、分頁列在卡外、每個分頁各自一張白卡 ===== */
.hp-tabbed { font-size: 14.5px; line-height: 1.8; color: var(--ink); background: transparent; border: none; padding: 0; box-shadow: none; }
.hp-tabbed .hp-head-card { margin-bottom: 18px; }
/* 分頁列在白卡之外，外觀完全等同個人盤 .tabs／.tab（底線式、無框無底色） */
.hp-tabbed .hp-tab-nav {
  display: flex; gap: 0; flex-wrap: wrap; margin: 0 0 18px; padding-bottom: 0;
  border-bottom: 2px solid var(--border-soft); background: transparent;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.hp-tabbed .hp-tab-btn {
  border: none; border-bottom: 2px solid transparent; border-radius: 0; background: transparent;
  color: var(--muted); padding: 12px 18px; margin-bottom: -2px; font-size: 14px;
  letter-spacing: 1px; font-weight: 500;
}
.hp-tabbed .hp-tab-btn.active { background: transparent; color: var(--accent); border-bottom-color: var(--accent); font-weight: 700; }
.hp-tabbed .hp-tab-btn:hover { color: var(--ink-2); }
/* panel 只是透明開關，白卡由內層 .hp-page-card（同時掛 detail-panel）提供，與 .tab-content>.detail-panel 同構 */
.hp-tabbed .hp-tab-panel.active { background: transparent; border: none; padding: 0; box-shadow: none; }
.hp-tabbed .hp-page-card { margin-bottom: 4px; }
/* 各時間層「置頂重大警示」：淺米底＋左側強調邊線，與一般分析區隔、一眼看到 */
.hp-tabbed .hp-layer-alert {
  background: #fbf6ee; border: 1px solid var(--border-soft); border-left: 4px solid var(--cinnabar);
  border-radius: 8px; padding: 12px 14px; margin: 0 0 18px;
}
.hp-tabbed .hp-layer-alert > h4 { background: rgba(168,40,28,.08); color: var(--cinnabar); margin: 0 0 10px; }
/* ===== 三派子分頁（中州／飛星／欽天）===== */
.zz-school-nav { display:flex; gap:8px; margin:0 0 14px; flex-wrap:wrap; }
.zz-school-btn { flex:1 1 30%; min-width:96px; padding:11px 8px; font-size:15px; font-family:inherit; font-weight:600;
  border:1.5px solid var(--border); background:#fbf7f0; color:var(--ink-2); border-radius:8px; cursor:pointer; }
.zz-school-btn.active { background:var(--accent); border-color:var(--accent); color:#fff; font-weight:700; }
/* 手機友善層內分頁：三派融合時一次只看一派，點 tab 瞬時切換（不重渲染），
   窄屏下固定在視圖頂部，對照時不必長捲動。 */
.hp-school-tabs { display:flex; gap:8px; margin:2px 0 14px; flex-wrap:nowrap; position:sticky; top:0; z-index:6;
  background:var(--bg); padding:9px 2px; border-bottom:1px solid var(--border-soft); }
.hp-school-tab { flex:1 1 33%; min-width:0; padding:10px 6px; font-size:14px; font-family:inherit; font-weight:600;
  border:1.5px solid var(--border); background:#fbf7f0; color:var(--ink-2); border-radius:20px; cursor:pointer;
  white-space:nowrap; transition:background .15s,color .15s; }
.hp-school-tab.active { background:var(--accent); border-color:var(--accent); color:#fff; font-weight:700; }
/* 漸進渲染：關卡年掃描／流月層 paint 後填充時的載入提示 */
.hp-lazy-hint { padding:14px 12px; text-align:center; font-size:13px; color:var(--muted);
  background:#fbf7f0; border:1px dashed var(--border); border-radius:10px; }
.zz-school-page { display:block; }
.zz-building { border:1.5px dashed var(--border); border-radius:8px; background:#faf6ef; color:var(--muted);
  font-size:14.5px; line-height:1.8; padding:22px 16px; text-align:center; }
.zz-card { border:1px solid var(--border-soft); border-radius:10px; background:#fffdf9; padding:13px 14px; margin-bottom:12px; }
.hp-person-a .zz-card { border-left:4px solid #c0563f; }
.hp-person-b .zz-card { border-left:4px solid #3f6f9e; }
.zz-card-h { font-size:15.5px; font-weight:700; color:var(--accent); margin:0 0 9px; padding-bottom:7px; border-bottom:1px solid var(--border-soft); }
.zz-row { display:flex; gap:10px; font-size:14px; line-height:1.75; margin:5px 0; align-items:flex-start; }
.zz-k { flex:0 0 88px; color:var(--muted); font-size:13px; padding-top:1px; }
.zz-row > span:last-child { flex:1; color:var(--ink); }
.zz-geju { margin-top:10px; display:flex; flex-direction:column; gap:8px; }
.zz-geju-item { border-radius:8px; padding:9px 11px; font-size:14px; line-height:1.7; background:#fcf8f1; border:1px solid var(--border-soft); }
.zz-geju-item b { font-size:14.5px; }
.zz-geju-item.zz-kind-good { border-left:4px solid #1e8449; }
.zz-geju-item.zz-kind-bad { border-left:4px solid #c0392b; }
.zz-geju-item.zz-kind-mid { border-left:4px solid #b89535; }
.zz-kind { font-weight:600; font-size:12.5px; color:var(--muted); }
.zz-geju-item p { margin:4px 0 0; }
.zz-ev { color:var(--muted); font-size:12.5px !important; }
.zz-geju-empty { margin-top:8px; font-size:13px; color:var(--muted); line-height:1.7; }
/* 飛星派卡片 */
.zz-fx-block { margin:12px 0; }
.zz-fx-h { font-size:14.5px; font-weight:700; color:var(--accent); margin:0 0 8px; }
.zz-fx-item { border-radius:8px; padding:9px 11px; margin:7px 0; font-size:13.5px; line-height:1.7; background:#fcf8f1; border:1px solid var(--border-soft); }
.zz-fx-item.good { border-left:4px solid #1e8449; }
.zz-fx-item.bad { border-left:4px solid #c0392b; }
.zz-fx-item.mid { border-left:4px solid #b89535; }
.zz-fx-item b { font-size:14px; }
.zz-fx-item p { margin:4px 0 0; }
.zz-fx-chain { background:#fbf3ee; border:1px dashed var(--border); border-radius:8px; padding:10px 12px; font-size:13.5px; line-height:2.0; }
.zz-empty-tag { display:inline-block; margin-left:6px; font-size:11.5px; color:var(--muted); border:1px solid var(--border); border-radius:4px; padding:0 5px; }
.zz-fx-empty { font-size:13px; color:var(--muted); margin:4px 0; }
@media (max-width:640px){ .zz-school-btn{font-size:14.5px;padding:10px 6px;} .zz-k{flex-basis:80px;} }
/* 區塊標題：個人盤 accent 淺底膠囊 */
.hp-tabbed .detail-section { margin-bottom: 18px; }
.hp-tabbed .detail-section h4 {
  font-size: 14.5px; color: var(--accent); letter-spacing: .5px; font-weight: 700;
  background: rgba(160,82,45,.06); border-radius: 6px; padding: 9px 12px; margin: 0 0 10px;
}
/* A／B 人物卡：保留紅藍邊條，其餘對齊個人卡片質感 */
.hp-tabbed .hp-person-a,
.hp-tabbed .hp-person-b,
.hp-tabbed .hp-person-both { border-radius: 8px; padding: 11px 13px; margin: 11px 0; box-shadow: 0 1px 3px rgba(58,46,34,.04); }
/* 飛化條目：圓角、間距、字級對齊 */
.hp-tabbed .hp-fly-item { border-radius: 6px; padding: 9px 12px; margin-bottom: 8px; font-size: 13.2px; line-height: 1.8; }
.hp-tabbed .hp-fly-chain { font-size: 12.3px; line-height: 1.7; }
/* 資訊條、圖例：淺底卡、圓角一致（放在表頭白卡內） */
.hp-tabbed .hp-info-bar { border-radius: 8px; padding: 11px 13px; line-height: 1.9; }
.hp-tabbed .hp-legend { background: var(--card-2); border: 1px solid var(--border-soft); border-radius: 8px; padding: 8px 12px; margin-top: 12px; }
@media (max-width:640px){
  .hp-tabbed .hp-tab-btn { padding: 10px 13px; font-size: 13px; letter-spacing: 0; }
  .hp-tabbed .hp-layer-alert { padding: 10px 11px; }
}
.hp-type-lu { color: var(--gold); font-weight: 700; }
.hp-type-quan { color: var(--accent); font-weight: 700; }
.hp-type-ke { color: var(--jade); font-weight: 700; }
.hp-type-ji { color: var(--cinnabar); font-weight: 700; }
.hp-theme-card {
  background: var(--card);
  border: 1px solid var(--border-soft);
  border-radius: 5px;
  padding: 12px 15px;
  margin-bottom: 12px;
}
.hp-theme-card h5 {
  font-size: 14px;
  color: var(--accent);
  margin-bottom: 8px;
  letter-spacing: 1px;
}
.hp-theme-card p { font-size: 13px; line-height: 1.85; margin-bottom: 6px; }
.hp-empty-note { font-size: 13px; color: var(--muted); padding: 6px 0; }
.hp-export-box {
  white-space: pre-wrap;
  background: var(--card-2);
  border: 1px solid var(--border-soft);
  border-radius: 4px;
  padding: 14px;
  font-size: 12px;
  line-height: 1.8;
  font-family: inherit;
  max-height: 480px;
  overflow-y: auto;
  margin-bottom: 12px;
}
@media (max-width: 600px) {
  .hp-cell { min-height: 64px; padding: 3px; }
  .hp-stars, .hp-pname { font-size: 9px; }
}


/* ========== 通用可收合手風琴（hpFold）＋雙人共業文章（手機友善、奶茶色） ========== */
.hp-fold {
  margin: 10px 0;
  border: 1px solid var(--border-soft, #e3d6c4);
  border-radius: 10px;
  background: #fffdf9;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(181, 142, 82, 0.06);
}
.hp-fold > .hp-fold-sum {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding: 11px 14px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-2, #6b5a4a);
  background: var(--bg-soft, #efe4d7);
  list-style: none;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.hp-fold > .hp-fold-sum::-webkit-details-marker { display: none; }
.hp-fold > .hp-fold-sum .hp-fold-label { flex: 1; line-height: 1.5; }
.hp-fold > .hp-fold-sum .hp-fold-arrow {
  flex-shrink: 0;
  color: var(--accent, #b88f6a);
  font-size: 14px;
  transition: transform 0.2s ease;
}
.hp-fold[open] > .hp-fold-sum .hp-fold-arrow { transform: rotate(180deg); }
.hp-fold > .hp-fold-body { padding: 10px 14px 12px; }
.hp-fold > .hp-fold-body > .hp-fly-item:first-child,
.hp-fold > .hp-fold-body > p:first-child { margin-top: 2px; }
/* 飛化明細類：標題列偏淡、較不搶眼 */
.hp-fold.hp-fold-fly > .hp-fold-sum {
  background: #f6ede1;
  font-size: 13.5px;
  font-weight: 600;
}
.hp-fold.hp-fold-fly { margin: 8px 0; }
/* 巢狀（非重點宮）二級收合 */
.hp-fold-sub {
  background: #faf4ea;
  border: 1px dashed #dcc9ad;
  border-radius: 8px;
  padding: 6px 10px;
}
.hp-fold-sub > summary { cursor: pointer; color: var(--muted, #9a8a76); list-style: none; }
.hp-fold-sub > summary::-webkit-details-marker { display: none; }

/* 重大警示：沿用 lv3-major-top 暖色警示，標題列即 summary */
.hp-fold.hp-fold-alert {
  background: linear-gradient(135deg, #fdf6ee 0%, #faeede 100%);
  border: 1px solid #e0c9a8;
  box-shadow: 0 2px 8px rgba(181, 142, 82, 0.08);
}
.hp-fold.hp-fold-alert > .hp-fold-sum {
  background: transparent;
  border-bottom: 1px dashed #d8b88a;
  color: #a85b3e;
  font-size: 15.5px;
  font-weight: 700;
  padding: 12px 14px 10px;
}
.hp-fold.hp-fold-alert[open] > .hp-fold-sum { margin-bottom: 0; }
.hp-fold.hp-fold-alert > .hp-fold-body { padding: 12px 14px 8px; }

/* 情緒溫度計收合：標題列白底 */
.hp-fold.hp-fold-emotion > .hp-fold-sum { background: #fff; font-size: 13.5px; }
.hp-fold.hp-fold-emotion .hp-emotion-bar {
  margin: 0;
  padding: 10px 12px;
  background: var(--card-2, #fbf6ef);
}

/* 雙人共業結論（鎖・執著・滋養）：屬重點結論，暖色、與文章卡同調，預設展開 */
.hp-fold.hp-fold-karma {
  border: 1px solid #e7d6bd;
  background: linear-gradient(135deg, #fdf8f0 0%, #f9f1e5 100%);
}
.hp-fold.hp-fold-karma > .hp-fold-sum {
  background: transparent;
  color: #8a5a36;
  font-weight: 700;
  border-bottom: 1px dashed #e2cfb0;
}

/* 雙人共業「命盤揭示」文章卡 */
.hp-gongye-narrative {
  margin: 8px 0 12px;
  padding: 12px 14px;
  background: linear-gradient(135deg, #fdf8f0 0%, #f7efe3 100%);
  border: 1px solid #e7d6bd;
  border-left: 3px solid var(--accent, #b88f6a);
  border-radius: 10px;
  line-height: 1.85;
}
.hp-gongye-narrative .hp-gn-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--accent, #b88f6a);
  margin-bottom: 8px;
  letter-spacing: 0.3px;
}
.hp-gongye-narrative p {
  margin: 0 0 8px;
  font-size: 13.5px;
  color: var(--ink-2, #6b5a4a);
  line-height: 1.9;
}
.hp-gongye-narrative p:last-child { margin-bottom: 0; }

/* 手機：縮小內距、字級換行更緊 */
@media (max-width: 640px) {
  .hp-fold > .hp-fold-sum { padding: 10px 12px; font-size: 13.5px; }
  .hp-fold > .hp-fold-body { padding: 9px 11px 11px; }
  .hp-fold.hp-fold-alert > .hp-fold-sum { font-size: 14.5px; }
  .hp-gongye-narrative { padding: 11px 12px; }
  .hp-gongye-narrative p { font-size: 13.2px; line-height: 1.85; }
}