/* ============ 结果页审查增强组件（来自 result-tabs-content-review.md） ============ */
/* 顶部"一句话结论"摘要卡、折叠面板、神煞、分项等新组件样式集中在此，不污染 result.css */

/* ---------- 通用摘要卡 ---------- */
.bazi-summary,
.review-summary {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.summary-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.summary-chip {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 14px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(124, 58, 237, 0.14), rgba(0, 0, 0, 0.25));
  border: 1px solid rgba(255, 255, 255, 0.1);
  min-width: 84px;
}
.summary-chip .sc-label {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.5);
  letter-spacing: 1px;
}
.summary-chip .sc-val {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
}
.summary-chip .sc-val.accent { color: var(--summary-accent, #00f0ff); }
.summary-text {
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.88);
  padding: 12px 14px;
  border-left: 3px solid var(--summary-accent, #00f0ff);
  background: rgba(124, 58, 237, 0.08);
  border-radius: 0 8px 8px 0;
}

/* ---------- 折叠面板（专业视图） ---------- */
.collapse {
  margin-top: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(10, 6, 20, 0.4);
}
.collapse-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.75);
  font-size: 13px;
  cursor: pointer;
  letter-spacing: 0.5px;
}
.collapse-toggle:hover { color: #fff; }
.collapse-toggle .caret { transition: transform 0.2s; font-size: 11px; opacity: 0.6; }
.collapse.open .collapse-toggle .caret { transform: rotate(90deg); }
.collapse-body {
  display: none;
  padding: 0 14px 14px;
}
.collapse.open .collapse-body { display: block; }

/* ---------- 神煞 ---------- */
.shensha-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.shensha-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 13px;
  background: rgba(201, 168, 76, 0.14);
  border: 1px solid rgba(201, 168, 76, 0.4);
  color: #e8d59a;
}
.shensha-tag .ss-where { font-size: 11px; color: rgba(255,255,255,.5); }
.shensha-empty { color: rgba(255, 255, 255, 0.45); font-size: 13px; }

/* ---------- 吉凶徽章（大运流年用） ---------- */
.jx-tag {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
}
.jx-daji { background: rgba(45, 255, 138, 0.18); color: #2dff8a; }
.jx-ji   { background: rgba(120, 220, 140, 0.14); color: #9be8ab; }
.jx-ping { background: rgba(255, 255, 255, 0.08); color: rgba(255,255,255,.6); }
.jx-xiong{ background: rgba(255, 90, 90, 0.16); color: #ff8a8a; }

/* ---------- 五格分项 ---------- */
.aspect-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.aspect-card {
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(15,8,30,.4);
}
.aspect-card .as-label { font-size: 12px; color: rgba(255,255,255,.55); }
.aspect-card .as-text { font-size: 13px; color: rgba(255,255,255,.9); margin-top: 4px; line-height: 1.6; }

/* ---------- 塔罗问题输入 ---------- */
.tarot-question-box { margin: 10px 0 14px; }
.tarot-cat-group { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.tarot-cat-btn {
  padding: 6px 14px; border-radius: 999px; font-size: 13px;
  border: 1px solid rgba(255,255,255,.15); background: rgba(20,10,40,.4);
  color: rgba(255,255,255,.7); cursor: pointer; transition: all .2s;
}
.tarot-cat-btn.active { border-color: var(--neon-cyan, #00f0ff); color: #fff; background: rgba(0,240,255,.12); box-shadow: 0 0 12px rgba(0,240,255,.3); }
.tarot-q-input {
  width: 100%; box-sizing: border-box; padding: 10px 12px; margin-top: 4px;
  border-radius: 8px; border: 1px solid rgba(255,255,255,.15);
  background: rgba(10,6,20,.6); color: #fff; font-size: 14px; font-family: inherit;
}
.tarot-q-input:focus { outline: none; border-color: var(--neon-cyan, #00f0ff); }

/* ---------- 星盘白话解释 / 配对 ---------- */
.astro-plain { font-size: 13px; color: rgba(255,255,255,.7); line-height: 1.7; margin: 4px 0 10px; }
.compat-pick { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.compat-pick button {
  padding: 5px 12px; border-radius: 999px; font-size: 12px; cursor: pointer;
  border: 1px solid rgba(255,255,255,.15); background: rgba(20,10,40,.4); color: rgba(255,255,255,.7);
}
.compat-pick button.active { border-color: #ff2d95; color: #fff; background: rgba(255,45,149,.14); }
.compat-result { padding: 12px 14px; border-radius: 10px; background: rgba(255,45,149,.08); border-left: 3px solid #ff2d95; }
.compat-score { font-size: 28px; font-weight: 700; color: #ff7ac0; }
.compat-desc { font-size: 13px; color: rgba(255,255,255,.85); margin-top: 6px; line-height: 1.7; }

/* ---------- 梅花白话/宜忌 ---------- */
.yiji-row { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
.yiji-box { flex: 1; min-width: 120px; padding: 10px 12px; border-radius: 10px; }
.yiji-yi { background: rgba(45,255,138,.1); border: 1px solid rgba(45,255,138,.3); }
.yiji-ji { background: rgba(255,90,90,.1); border: 1px solid rgba(255,90,90,.3); }
.yiji-box .yj-label { font-size: 12px; font-weight: 700; margin-bottom: 4px; }
.yiji-yi .yj-label { color: #2dff8a; }
.yiji-ji .yj-label { color: #ff8a8a; }
.yiji-box .yj-text { font-size: 13px; color: rgba(255,255,255,.85); line-height: 1.6; }

/* 动爻高亮 */
.meihua-yao-line.moving { box-shadow: 0 0 10px var(--neon-cyan, #00f0ff); position: relative; }
.meihua-yao-line.moving::after { content: '动'; position: absolute; right: -22px; top: 50%; transform: translateY(-50%); font-size: 11px; color: var(--neon-cyan, #00f0ff); }

/* ========== 梅花 Tab 重设计 ========== */

.mh-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.mh-title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  font-size: 20px;
  line-height: 1;
  filter: drop-shadow(0 0 4px var(--ai-accent, rgba(0, 240, 255, 0.5)));
}

/* —— 今日吉凶大徽章 —— */
.mh-luck-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 18px 0;
}
.mh-luck-badge {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 2px solid currentColor;
  position: relative;
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); /* 六角 */
}
.mh-luck-badge .mh-icon {
  width: 36px;
  height: 36px;
}
.mh-luck-badge .mh-luck-text {
  font-size: 26px;
  font-weight: 900;
  letter-spacing: 0.1em;
  margin-top: 4px;
}
.mh-luck-badge.lv-daji { color: #00ffaa; }   /* 大吉 - 赛博绿 */
.mh-luck-badge.lv-ji   { color: #00f0ff; }   /* 吉   - 赛博青 */
.mh-luck-badge.lv-ping { color: #ffd166; }   /* 平   - 暖黄 */
.mh-luck-badge.lv-xiong { color: #ff4d6d; }  /* 凶   - 警示红 */
.mh-luck-summary {
  font-size: 16px;
  line-height: 1.7;
  text-align: center;
  max-width: 540px;
  color: var(--text);
}
.mh-luck-yuan {
  font-size: 12px;
  color: var(--text-muted);
  opacity: 0.75;
  text-align: center;
  font-style: italic;
  max-width: 540px;
}

/* —— 通用图标 —— */
.mh-icon {
  width: 24px;
  height: 24px;
  vertical-align: middle;
  display: inline-block;
}
.mh-icon.large { width: 64px; height: 64px; }
.mh-icon.small { width: 18px; height: 18px; }

/* —— 起卦信息 —— */
.mh-qigua-actions {
  margin-top: 12px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.mh-qigua-actions .as-label {
  font-size: 12px;
  color: var(--text-muted);
  letter-spacing: 0.1em;
}

/* —— 体用关系 —— */
.mh-tiyong-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.mh-tiyong-cards {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}
.mh-ti-item {
  flex: 1;
  max-width: 200px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 14px;
  border: 1px solid rgba(0, 240, 255, 0.3);
  border-radius: 4px;
  background: rgba(15, 8, 35, 0.5);
}
.mh-ti-label {
  font-size: 12px;
  color: var(--text-muted);
  letter-spacing: 0.1em;
}
.mh-ti-symbol {
  font-size: 36px;
  line-height: 1;
}
.mh-ti-name {
  font-size: 16px;
  font-weight: 700;
}
.mh-ti-vs {
  font-size: 14px;
  color: var(--text-muted);
  font-family: var(--font-mono);
  letter-spacing: 0.2em;
}
.mh-relation-row {
  text-align: center;
}
.meihua-relation-tag {
  display: inline-block;
  padding: 3px 12px;
  font-size: 14px;
  font-weight: 700;
  border-radius: 2px;
  margin-right: 8px;
}
.meihua-relation-tag.lv-daji { color: #00ffaa; border: 1px solid #00ffaa; }
.meihua-relation-tag.lv-ji   { color: #00f0ff; border: 1px solid #00f0ff; }
.meihua-relation-tag.lv-ping { color: #ffd166; border: 1px solid #ffd166; }
.meihua-relation-tag.lv-xiong { color: #ff4d6d; border: 1px solid #ff4d6d; }
.mh-relation-plain {
  display: block;
  margin-top: 6px;
  font-size: 14px;
  color: var(--text);
  line-height: 1.7;
}
.mh-relation-yuan {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: var(--text-muted);
  opacity: 0.75;
  font-style: italic;
}
.mh-tg-section {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border-left: 2px solid rgba(176, 77, 255, 0.5);
  background: rgba(176, 77, 255, 0.05);
}
.mh-tg-label {
  font-size: 12px;
  color: var(--text-muted);
  letter-spacing: 0.1em;
}
.mh-tg-plain {
  font-size: 14px;
  color: var(--text);
  line-height: 1.6;
}
.mh-tg-yuan {
  font-size: 12px;
  color: var(--text-muted);
  opacity: 0.75;
  font-style: italic;
  line-height: 1.6;
}

/* —— 卦象图与读法 —— */
.mh-chart-row {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
@media (max-width: 720px) {
  .mh-chart-row { grid-template-columns: 1fr; }
}
.mh-readguide {
  padding: 12px 14px;
  border: 1px dashed rgba(0, 240, 255, 0.4);
  border-radius: 4px;
  background: rgba(0, 240, 255, 0.04);
  font-size: 12px;
  line-height: 1.7;
  color: var(--text-muted);
}
.mh-readguide h4 {
  font-size: 13px;
  margin: 0 0 6px;
  color: var(--neon-cyan, #00f0ff);
  letter-spacing: 0.05em;
}
.mh-readguide .mh-rg-item {
  margin-bottom: 6px;
}
.mh-readguide .mh-rg-symbol {
  display: inline-block;
  font-size: 16px;
  margin-right: 4px;
  color: var(--text);
}

/* —— 名词词典 —— */
.mh-dict-hint {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 10px;
}
.mh-dict-item {
  margin-bottom: 6px;
}
.mh-dict-q {
  font-size: 13px;
  font-weight: 700;
  color: var(--neon-cyan, #00f0ff);
}
.mh-dict-a {
  font-size: 13px;
  color: var(--text);
  line-height: 1.7;
  margin-top: 2px;
  padding-left: 12px;
  border-left: 2px solid rgba(0, 240, 255, 0.2);
}