/* 紫微斗数界面：与八字排盘统一的卡片、字段与移动端节奏。 */
.ziwei-section {
  padding: 34px 24px 64px;
}

.ziwei-wrap {
  width: min(100%, 920px);
  max-width: 920px;
  gap: 20px;
}

.ziwei-form-card,
.ziwei-history-wrap,
.ziwei-panel {
  border: 1px solid rgba(120, 91, 49, 0.18) !important;
  background: rgba(255, 253, 248, 0.82) !important;
  box-shadow: 0 14px 38px rgba(74, 52, 24, 0.08) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.ziwei-form-card {
  padding: 28px 30px 30px;
  border-radius: 18px;
}

.ziwei-form-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(120, 91, 49, 0.14);
}

.ziwei-form-card .ziwei-form-head h3 {
  margin: 2px 0 5px;
  color: var(--text);
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: .08em;
  text-align: left;
}

.ziwei-eyebrow {
  color: #b47b28;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .16em;
}

.ziwei-form-subtitle {
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.6;
}

.ziwei-price {
  display: flex;
  align-items: baseline;
  gap: 5px;
  flex: 0 0 auto;
  padding: 9px 13px;
  border: 1px solid rgba(200, 146, 62, .28);
  border-radius: 12px;
  background: rgba(200, 146, 62, .08);
  color: #9b6822;
}

.ziwei-price strong {
  font-family: var(--font-serif);
  font-size: 23px;
  line-height: 1;
}

.ziwei-price span { font-size: 12px; font-weight: 600; }

.ziwei-form-card .feature-intro {
  margin: 18px 0 20px;
  padding: 15px 17px;
  border: 0;
  border-left: 3px solid #c8923e;
  border-radius: 0 10px 10px 0;
  background: rgba(200, 146, 62, .055);
}

.ziwei-form-card .feature-intro p {
  margin: 0;
  color: #5b4a35;
  font-size: 13px;
  line-height: 1.75;
}

.ziwei-form-card .feature-intro p + p { margin-top: 8px; }
.ziwei-form-card .intro-label { color: #b47b28; font-weight: 700; }

.ziwei-mode-tabs {
  width: 100%;
  margin: 0 0 20px;
  padding: 4px;
  border: 1px solid rgba(120, 91, 49, .16);
  border-radius: 12px;
  background: rgba(120, 91, 49, .045);
}

.ziwei-mode-tab {
  flex: 1;
  min-height: 38px;
  padding: 8px 18px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 600;
}

.ziwei-mode-tab:first-child { border-right: 0; }
.ziwei-mode-tab.active { box-shadow: 0 5px 14px rgba(160, 105, 31, .18); }

.ziwei-form-row {
  display: grid;
  gap: 14px;
  width: 100%;
  margin: 0 0 16px;
  align-items: end;
}

.ziwei-identity-grid { grid-template-columns: minmax(0, 2fr) minmax(150px, 1fr); }
#zwBasicRow1 { grid-template-columns: 1.25fr repeat(4, minmax(0, 1fr)); }
#zwBasicRow2 { grid-template-columns: minmax(360px, 1fr) auto; }
.ziwei-basic-submit-row { grid-template-columns: 1fr; }

.ziwei-location-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
}

.ziwei-location-title {
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.35;
}

.ziwei-location-selects {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.ziwei-location-selects select {
  width: 100%;
  max-width: none !important;
  min-width: 0;
  height: 44px;
  padding: 0 13px;
  border: 1px solid rgba(120, 91, 49, .22);
  border-radius: 10px;
  background: rgba(255, 255, 255, .82);
  color: var(--text);
  font: inherit;
  font-size: 14px;
  outline: none;
  transition: border-color .2s, box-shadow .2s, background .2s;
}

.ziwei-location-selects select:focus {
  border-color: #c8923e;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(200, 146, 62, .12);
}

.ziwei-location-selects select:disabled {
  cursor: not-allowed;
  color: rgba(57, 48, 37, .5);
  background: rgba(255, 255, 255, .5);
}

.ziwei-location-meta {
  min-height: 17px;
  color: rgba(86, 68, 46, .72);
  font-size: 11px;
  line-height: 1.5;
}

.ziwei-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.35;
}

.ziwei-form-row .ziwei-field > span {
  min-width: 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.35;
}

.ziwei-form-row .ziwei-field input,
.ziwei-form-row .ziwei-field select {
  width: 100%;
  max-width: none !important;
  min-width: 0;
  height: 44px;
  padding: 0 13px;
  border: 1px solid rgba(120, 91, 49, .22);
  border-radius: 10px;
  background: rgba(255, 255, 255, .82);
  color: var(--text);
  font: inherit;
  font-size: 14px;
  outline: none;
  transition: border-color .2s, box-shadow .2s, background .2s;
}

.ziwei-form-row .ziwei-field input:focus,
.ziwei-form-row .ziwei-field select:focus {
  border-color: #c8923e;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(200, 146, 62, .12);
}

.ziwei-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 13px;
  border: 1px solid rgba(120, 91, 49, .16);
  border-radius: 10px;
  background: rgba(255, 255, 255, .55);
  color: var(--text-secondary);
  font-size: 13px;
  white-space: nowrap;
}

.ziwei-form-row .ziwei-check input[type="checkbox"] {
  width: 17px;
  height: 17px;
  min-width: 17px;
  margin: 0;
  accent-color: #c8923e;
}

.ziwei-form-row .ziwei-btn,
.ziwei-form-row .ziwei-more-btn {
  min-height: 44px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
}

.ziwei-form-row .ziwei-btn {
  width: 100%;
  padding: 0 20px;
  background: linear-gradient(135deg, #c8923e, #dfb45d);
  box-shadow: 0 8px 18px rgba(170, 111, 32, .18);
}

.ziwei-form-row .ziwei-btn:hover {
  background: linear-gradient(135deg, #b57f31, #cd9e48);
  transform: translateY(-1px);
}

.ziwei-adv-row {
  grid-template-columns: 1fr;
  align-items: stretch;
}

.ziwei-adv-row.hidden { display: none; }
.ziwei-basic-only.hidden { display: none; }
.ziwei-adv-submit-row { margin-top: 14px; }
.ziwei-more-content.expanded { max-height: 240px; }
.ziwei-more-content .ziwei-form-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0 0 2px;
}

.ziwei-history-wrap {
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
  padding: 20px 22px !important;
  border-radius: 16px !important;
}

.ziwei-history-wrap .dh-title {
  color: var(--text) !important;
  font-family: var(--font-serif);
  font-size: 16px !important;
  font-weight: 600 !important;
}

.ziwei-chart-wrap {
  width: min(100%, 720px);
  max-width: 720px;
  padding: 5px;
  border: 1px solid rgba(120, 91, 49, .16);
  border-radius: 16px;
  background: rgba(255, 253, 248, .58);
  box-shadow: 0 14px 36px rgba(74, 52, 24, .07);
}

.ziwei-chart-grid { inset: 5px; gap: 5px; }
.ziwei-palace { border-radius: 9px; background: rgba(255, 254, 250, .9); }
.ziwei-center { border-radius: 11px; background: rgba(245, 235, 214, .62); }

.ziwei-panel {
  width: min(100%, 720px);
  max-width: 720px;
  padding: 21px 23px;
  border-radius: 16px;
}

.ziwei-panel h3 { font-size: 16px; }
.ziwei-facts { grid-template-columns: 86px minmax(0, 1fr); gap: 8px 14px; font-size: 13px; }
.ziwei-ai-btn { min-height: 44px; border-radius: 10px; font-weight: 700; }

@media (max-width: 720px) {
  .ziwei-section { padding: 22px 14px 46px !important; }
  .ziwei-wrap { gap: 14px; }
  .ziwei-form-card { padding: 20px 16px 22px !important; border-radius: 15px; }
  .ziwei-form-head { gap: 14px; padding-bottom: 16px; }
  .ziwei-form-card .ziwei-form-head h3 { font-size: 19px; letter-spacing: .04em; }
  .ziwei-form-subtitle { font-size: 12px; }
  .ziwei-price { padding: 8px 10px; }
  .ziwei-price strong { font-size: 20px; }
  .ziwei-form-card .feature-intro { margin: 15px 0 16px; padding: 13px 14px; }
  .ziwei-form-card .feature-intro p { font-size: 12px; line-height: 1.7; }
  .ziwei-identity-grid { grid-template-columns: minmax(0, 1.55fr) minmax(110px, .8fr); }
  #zwBasicRow1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #zwBasicRow1 .ziwei-field:first-child { grid-column: 1 / -1; }
  #zwBasicRow2 { grid-template-columns: 1fr; }
  .ziwei-check { justify-content: flex-start; }
  .ziwei-adv-row { grid-template-columns: 1fr; }
  .ziwei-more-content .ziwei-form-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ziwei-history-wrap { padding: 17px 16px !important; border-radius: 14px !important; }
  .ziwei-chart-wrap { border-radius: 12px; padding: 3px; }
  .ziwei-chart-grid { inset: 3px; gap: 3px; }
  .ziwei-palace { padding: 5px 5px; border-radius: 6px; }
  .ziwei-palace-gz { top: 4px; right: 5px; font-size: 8px; }
  .ziwei-palace-stars { line-height: 1.22; padding-top: 9px; }
  .zw-major { font-size: clamp(10px, 3vw, 13px); margin-right: 3px; }
  .zw-aux { font-size: clamp(8px, 2.3vw, 10px); margin-right: 3px; }
  .ziwei-palace-foot { align-items: flex-end; }
  .ziwei-palace-gong { font-size: 10px; }
  .ziwei-palace-limit { max-width: 52%; font-size: 8px; text-align: right; }
  .ziwei-center { padding: 6px; gap: 2px; }
  .ziwei-center .zw-row { font-size: clamp(8px, 2.2vw, 10px); line-height: 1.35; }
  .ziwei-panel { padding: 18px 16px; border-radius: 14px; }
  .ziwei-facts { grid-template-columns: 72px minmax(0, 1fr); gap: 7px 10px; font-size: 12px; }
  .ziwei-legend { gap: 8px 12px; padding: 2px 8px 0; line-height: 1.5; }
}

@media (max-width: 380px) {
  .ziwei-form-head { flex-direction: column; }
  .ziwei-price { align-self: flex-start; }
  .ziwei-identity-grid { grid-template-columns: 1fr; }
  .ziwei-more-content .ziwei-form-row { grid-template-columns: 1fr; }
  .ziwei-more-content.expanded { max-height: 360px; }
}

/* [主题补全] 8.15 紫微表单、命盘和扩展状态的深色视觉适配。 */
html[data-theme="dark"] .ziwei-section {
  background-color: var(--theme-canvas);
  color: var(--theme-text-1);
}

html[data-theme="dark"] .ziwei-panel,
html[data-theme="dark"] .ziwei-form-card,
html[data-theme="dark"] .ziwei-history-wrap,
html[data-theme="dark"] .ziwei-chart-wrap,
html[data-theme="dark"] .ziwei-facts {
  background-color: var(--theme-surface);
  border-color: var(--theme-line);
  box-shadow: var(--theme-shadow);
  color: var(--theme-text-1);
}

html[data-theme="dark"] .ziwei-form-card {
  background-color: var(--theme-surface);
  border-color: var(--theme-line);
}

html[data-theme="dark"] .ziwei-form-subtitle,
html[data-theme="dark"] .ziwei-location-meta,
html[data-theme="dark"] .ziwei-form-card .feature-intro p {
  color: var(--theme-text-2);
}

html[data-theme="dark"] .ziwei-eyebrow,
html[data-theme="dark"] .ziwei-price strong,
html[data-theme="dark"] .ziwei-form-card .intro-label {
  color: var(--theme-gold);
}

html[data-theme="dark"] .ziwei-mode-tabs {
  background-color: var(--theme-surface-soft);
  border-color: var(--theme-line);
}

html[data-theme="dark"] .ziwei-mode-tab {
  background-color: transparent;
  border-color: var(--theme-line);
  color: var(--theme-text-2);
}

html[data-theme="dark"] .ziwei-mode-tab.active {
  background-color: var(--theme-gold-soft);
  border-color: var(--theme-gold);
  color: var(--theme-text-1);
}

html[data-theme="dark"] .ziwei-location-selects select,
html[data-theme="dark"] .ziwei-form-row .ziwei-field select {
  background-color: var(--theme-surface-raised);
  border-color: var(--theme-line-strong);
  color: var(--theme-text-1);
}

html[data-theme="dark"] .ziwei-location-selects select:disabled {
  background-color: var(--theme-surface-soft);
  color: var(--theme-text-disabled);
}

html[data-theme="dark"] .ziwei-form-row .ziwei-more-btn,
html[data-theme="dark"] .ziwei-form-row .ziwei-btn,
html[data-theme="dark"] .ziwei-ai-btn {
  background-color: var(--theme-gold-soft);
  border-color: var(--theme-gold);
  color: var(--theme-text-1);
}

html[data-theme="dark"] .ziwei-form-row .ziwei-btn:hover,
html[data-theme="dark"] .ziwei-ai-btn:hover {
  background-color: var(--theme-gold);
  color: var(--theme-text-1);
}

html[data-theme="dark"] .ziwei-form-row .ziwei-btn:focus-visible {
  outline-color: var(--theme-gold);
  box-shadow: 0 0 0 4px var(--theme-gold-soft);
}

html[data-theme="dark"] .ziwei-palace {
  background-color: var(--theme-surface-raised);
  border-color: var(--theme-line);
  color: var(--theme-text-1);
}

html[data-theme="dark"] .ziwei-center {
  background-color: var(--theme-surface-soft);
  border-color: var(--theme-line-strong);
  color: var(--theme-text-1);
}

/* [暗色修复] 8.16 反制基底 !important 白蒙层，补全星曜/面板/详解/AI解读暗色 */
html[data-theme="dark"] .ziwei-section {
  --text: var(--theme-text-1);
  --text-secondary: var(--theme-text-2);
  --text-muted: var(--theme-text-3);
  --card-bg: var(--theme-surface);
}

/* 基底 12-20 行 rgba(255,253,248,0.82) !important 白蒙层，必须 !important 反制 */
html[data-theme="dark"] .ziwei-form-card,
html[data-theme="dark"] .ziwei-history-wrap,
html[data-theme="dark"] .ziwei-panel {
  background: var(--theme-surface) !important;
  border-color: var(--theme-line) !important;
  box-shadow: var(--theme-shadow) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html[data-theme="dark"] .ziwei-form-head {
  border-bottom-color: var(--theme-line);
}

html[data-theme="dark"] .ziwei-price {
  background: var(--theme-gold-soft);
  border-color: var(--theme-line-strong);
  color: var(--theme-gold);
}

html[data-theme="dark"] .ziwei-form-card .feature-intro {
  background: rgba(198, 161, 92, .08);
  border-left-color: var(--theme-gold);
}

/* 文本输入（既有 dark 块只覆盖了 select）与 focus 态白底反制 */
html[data-theme="dark"] .ziwei-form-row .ziwei-field input {
  background-color: var(--theme-surface-raised);
  border-color: var(--theme-line-strong);
  color: var(--theme-text-1);
}

html[data-theme="dark"] .ziwei-location-selects select:focus,
html[data-theme="dark"] .ziwei-form-row .ziwei-field input:focus,
html[data-theme="dark"] .ziwei-form-row .ziwei-field select:focus {
  background: var(--theme-surface-raised);
  border-color: var(--theme-gold);
  box-shadow: 0 0 0 3px var(--theme-gold-soft);
}

/* 真太阳时勾选框白底 */
html[data-theme="dark"] .ziwei-check {
  background: var(--theme-surface-raised);
  border-color: var(--theme-line);
  color: var(--theme-text-2);
}

/* 主按钮：金色实心规范（覆盖上方 gold-soft 分组规则与渐变底色） */
html[data-theme="dark"] .ziwei-form-row .ziwei-btn {
  background: var(--theme-gold);
  color: var(--theme-canvas);
  box-shadow: none;
}

html[data-theme="dark"] .ziwei-form-row .ziwei-btn:hover {
  background: var(--theme-gold);
  color: var(--theme-canvas);
  filter: brightness(1.07);
}

/* 次按钮文字统一金色 */
html[data-theme="dark"] .ziwei-form-row .ziwei-more-btn,
html[data-theme="dark"] .ziwei-ai-btn {
  color: var(--theme-gold);
}

/* 命盘宫位选中/三方四正关联态：浅金洗底改暗色晕染 */
html[data-theme="dark"] .ziwei-palace.sel {
  background: rgba(207, 117, 106, .14);
  border-color: var(--theme-danger);
  box-shadow: 0 0 0 1px var(--theme-danger) inset;
}

html[data-theme="dark"] .ziwei-palace.rel {
  background: rgba(198, 161, 92, .10);
  border-color: var(--theme-gold);
}

html[data-theme="dark"] .ziwei-palace:hover {
  border-color: var(--theme-gold);
}

/* 星曜与宫位文字提亮 */
html[data-theme="dark"] .zw-major { color: var(--theme-text-1); }
html[data-theme="dark"] .zw-major.s-miao { color: #6FBD8C; }
html[data-theme="dark"] .zw-major.s-wang { color: #8FCE9F; }
html[data-theme="dark"] .zw-major.s-de { color: #C9A05C; }
html[data-theme="dark"] .zw-major.s-li { color: #D29A6A; }
html[data-theme="dark"] .zw-major.s-xian { color: var(--theme-danger); }
html[data-theme="dark"] .zw-aux.ji { color: #6FBD8C; }
html[data-theme="dark"] .zw-aux.sha { color: var(--theme-danger); }
html[data-theme="dark"] .zw-aux.misc { color: var(--theme-text-3); }
html[data-theme="dark"] .ziwei-palace-empty { color: var(--theme-text-3); }
html[data-theme="dark"] .ziwei-palace-gong { color: var(--theme-gold); }
html[data-theme="dark"] .ziwei-palace-limit { color: var(--theme-text-3); }
html[data-theme="dark"] .ziwei-palace-foot { border-top-color: var(--theme-line); }
html[data-theme="dark"] .ziwei-center .zw-ju { color: var(--theme-gold); }

/* 宫位详解面板 */
html[data-theme="dark"] .ziwei-panel h3 {
  color: var(--theme-gold);
  border-left-color: var(--theme-danger);
}

html[data-theme="dark"] .ziwei-facts dt { color: var(--theme-text-3); }

html[data-theme="dark"] .ziwei-facts .zw-tag.ji {
  background: rgba(111, 189, 140, .16);
  color: #6FBD8C;
}

html[data-theme="dark"] .ziwei-facts .zw-tag.sha {
  background: rgba(207, 117, 106, .16);
  color: var(--theme-danger);
}

html[data-theme="dark"] .ziwei-facts .zw-tag.misc {
  background: var(--theme-surface-raised);
  color: var(--theme-text-2);
}

/* AI 命盘解读结果 */
html[data-theme="dark"] .ziwei-ai-result {
  background: rgba(198, 161, 92, .06);
  border-color: var(--theme-line-strong);
  color: var(--theme-text-2);
}

html[data-theme="dark"] .ziwei-ai-result h4 {
  color: var(--theme-gold);
  border-bottom-color: var(--theme-line);
}

html[data-theme="dark"] .ziwei-ai-result .zw-ai-loading {
  color: var(--theme-gold);
}