.hidden { display: none; }

/* 表单卡片样式 */
.card { background: var(--color-pan); border: 1px solid var(--color-brand); border-radius: 8px; padding: 16px; margin-bottom: 16px; box-shadow: 0 1px 6px rgba(0,0,0,.08); }
.lbl-inline { min-width: auto; margin-left: 8px; }
.mob-row { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sx-action-row { justify-content: flex-end; }
.sx-yuan { font-size: 11px; color: var(--color-text-muted); }
.sx-result-area { padding: 10px; background: #fff; border-radius: 8px; margin-bottom: 20px; box-shadow: 0 1px 6px rgba(0,0,0,.08); }
.mobile-actions-outside { display: none; }

/* 坐山 / 度数下拉 */
#shanSelect, #degreeSelect { padding: 4px 6px; border: 1px solid var(--color-border); border-radius: 4px; font-size: 13px; font-family: inherit; background: #fff; }
.hint { font-size: 11px; color: var(--color-text-muted); }

.ju-val { font-weight: 700; color: var(--color-gold); font-size: 16px; }

/* 结果表格 */
.qm-result-table { width: 100%; margin: 0 auto; border-collapse: collapse; font-size: 12px; color: var(--color-text); border: 1px solid var(--color-border-warm); table-layout: fixed; background: #fff; }
.qm-result-table td, .qm-result-table th { padding: 1px 6px; vertical-align: middle; border-right: 1px solid var(--color-border-warm); border-bottom: 1px solid var(--color-border-warm); }
.qm-result-table td:last-child, .qm-result-table th:last-child { border-right: none; }
.qm-result-table tr:last-child td { border-bottom: none; }
.qm-result-table .qm-label { width: 50px; color: var(--color-gold); font-weight: 500; text-align: center; background: var(--color-parchment); white-space: nowrap; border-right: 1px solid var(--color-border-warm); }
.qm-result-table .qm-value { text-align: center; font-weight: 500; color: var(--color-text); }
.qm-result-table .qm-sublabel { text-align: center; font-size: 11px; color: var(--color-star-sub); background: var(--color-parchment); }
.qm-hl { color: var(--color-fire); font-weight: 700; }

.qm-color-legend { max-width:620px; margin:8px auto; text-align:center; font-size:11px; color: var(--color-text-sec); }
.qm-palace-hint { max-width:620px; margin:4px auto; text-align:center; font-size:11px; color: var(--color-text-muted); }
.qm-zuo-mark { border: 1px solid var(--color-fire); }
.qm-xiang-mark { border: 1px solid #3498db; }

/* ===== 五行颜色 ===== */
.e-mu   { color: #2d8a2d; }
.e-huo  { color: var(--color-fire); }
.e-tu   { color: #8B4513; }
.e-jin  { color: #b8860b; }
.e-shui { color: #1a6fb5; }

/* ===== 九宫格（renderPalaceGrid 依赖）===== */
.qm-palace-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--color-border-warm);
  border: 1px solid var(--color-border-warm);
  max-width: 620px;
  margin: 15px auto;
}
.qm-palace {
  background: #fff;
  min-height: 148px;
  position: relative;
}
.qm-palace-inner {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 148px;
}
.qm-palace-col1 { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); }
.qm-palace-col1 .an-gan { font-size: 13px; font-weight: 500; line-height: 1.2; color: var(--color-text-muted); }
.shen-mark { position: absolute; left: 15px; bottom: 20px; font-size: 13px; font-weight: 500; line-height: 1.2; color: var(--color-text-sec); }
.shen { position: absolute; top: 23px; left: 43px; font-size: 18px; font-weight: 300; color: var(--color-text); line-height: 1.2; }
.shen.qm-zhifu { color: #20b2aa; }
.xing { position: absolute; top: 66px; left: 43px; font-size: 18px; font-weight: 300; color: var(--color-text); line-height: 1.2; }
.xing.qm-zhifu { color: #20b2aa; font-weight: 500; }
.xing .xing-qin { color: #8B4513; }
.men { position: absolute; top: 109px; left: 43px; font-size: 18px; font-weight: 300; color: var(--color-text); line-height: 1.2; }
.men.qm-zhishi { color: #20b2aa; }
.men.men-po { color: var(--color-fire) !important; font-weight: 400; }
.tian-pan-gan { position: absolute; top: 66px; right: 38px; font-size: 18px; font-weight: 500; line-height: 1.2; color: var(--color-text); }
.di-pan-gan { position: absolute; top: 109px; right: 38px; font-size: 18px; font-weight: 500; line-height: 1.2; color: var(--color-text); }
.ji-gong-gan { position: absolute; top: 66px; right: 13px; font-size: 18px; font-weight: 500; line-height: 1.2; color: var(--color-text); }
.qm-empty-mark { position: absolute; top: 23px; left: 15px; font-size: 18px; color: var(--color-text); font-weight: 700; line-height: 1; }
.qm-ma-mark { position: absolute; top: 25px; right: 40px; font-size: 11px; color: var(--color-gold); font-weight: 500; line-height: 1.2; }
.qm-ma-mark::before { content: ''; position: absolute; width: 15px; height: 15px; border: 1px solid var(--color-gold); border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.qm-gong-name { position: absolute; top: 4px; right: 4px; font-size: 11px; font-weight: 500; line-height: 1.2; white-space: nowrap; }
.xing-yuewang { position: absolute; top: 63px; left: 84px; font-size: 11px; font-weight: 500; line-height: 1.2; color: var(--color-text-muted); }
.xing-gongwang { position: absolute; top: 79px; left: 84px; font-size: 11px; font-weight: 500; line-height: 1.2; color: var(--color-text-muted); }
.men-yuewang { position: absolute; top: 109px; left: 84px; font-size: 11px; font-weight: 500; line-height: 1.2; color: var(--color-text-muted); }
.men-gongwang { position: absolute; top: 122px; left: 84px; font-size: 11px; font-weight: 500; line-height: 1.2; color: var(--color-text-muted); }
.chang-sheng-double { position: absolute; top: -15px; left: 0; right: 0; display: flex; flex-direction: row; justify-content: center; gap: 1px; font-size: 11px; font-weight: 500; line-height: 1.2; color: var(--color-text-muted); white-space: nowrap; }
.gan-zhi-cell { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 2px; }
.gan-zhi-cell .gan, .gan-zhi-cell .zhi { font-size: 12px; font-weight: 500; line-height: 1.1; }

/* ===== Dark Mode ===== */
/* result area / table / palace backgrounds */
html[data-theme="dark"] .sx-result-area        { background: var(--color-panel); box-shadow: 0 1px 6px rgba(0,0,0,.3); }
html[data-theme="dark"] .qm-result-table       { background: var(--color-panel); }
html[data-theme="dark"] .qm-palace             { background: var(--color-panel); }
html[data-theme="dark"] .qm-palace-grid        { background: #2a1f4a; border-color: #2a1f4a; }

/* form inputs */
html[data-theme="dark"] #shanSelect,
html[data-theme="dark"] #degreeSelect         { background: var(--color-input-bg); color: var(--color-text); border-color: #9a8ab8; }

/* table borders */
html[data-theme="dark"] .qm-result-table,
html[data-theme="dark"] .qm-result-table td,
html[data-theme="dark"] .qm-result-table th  { border-color: #2a1f4a; }
html[data-theme="dark"] .qm-result-table .qm-label { border-color: #2a1f4a; }

/* five elements */
html[data-theme="dark"] .e-mu   { color: #5ab85a; }
html[data-theme="dark"] .e-huo  { color: #e06060; }
html[data-theme="dark"] .e-tu   { color: var(--color-gold); }
html[data-theme="dark"] .e-jin  { color: var(--color-gold); }
html[data-theme="dark"] .e-shui { color: #6db8e0; }

/* zhiFu / zhiShi / xiang marks */
html[data-theme="dark"] .shen.qm-zhifu   { color: #5abfaf; }
html[data-theme="dark"] .xing.qm-zhifu   { color: #5abfaf; }
html[data-theme="dark"] .men.qm-zhishi   { color: #5abfaf; }
html[data-theme="dark"] .qm-xiang-mark   { border-color: #9a8ab8; }

/* xingQin (brown → gold) / destructive door (red → adjusted) */
html[data-theme="dark"] .xing .xing-qin  { color: var(--color-gold); }
html[data-theme="dark"] .men.men-po      { color: #e06060 !important; }