/* 四柱视觉再设计：保持数据与传统纵向结构，只重做材质和层级。 */
.chart-sheet {
  padding: 29px 25px 23px;
  border: 0;
  border-radius: 3px;
  background: #e8eee3;
  box-shadow: none;
  position: relative;
}
.chart-sheet::before {
  content: '';
  position: absolute;
  inset: 9px;
  border-top: 1px solid #9bb49d75;
  border-bottom: 1px solid #9bb49d75;
  pointer-events: none;
}
.chart-sheet:hover { background: #e8eee3; }
.chart-head { padding: 0 8px; margin-bottom: 23px; }
.chart-head strong { color: #294b3a; font-size: 24px; }
.chart-head span { color: #5f7562; }
.chart-controls { padding: 0; background: transparent; gap: 25px; border-radius: 0; margin: 0 8px 28px; }
.chart-controls button { padding: 9px 3px; border-radius: 0; border-bottom: 2px solid transparent; color: #526c57; }
.chart-controls button[aria-pressed='true'] { background: transparent; color: #234b36; border-bottom-color: #98783a; box-shadow: none; }
.bazi-table { border-collapse: separate; border-spacing: 8px 0; }
.bazi-table thead { background: transparent; }
.bazi-table th {
  padding: 16px 0 13px;
  color: #60765e;
  background: #f6f6ed;
  border: 1px solid #b9cbb675;
  border-bottom: 0;
  border-top: 2px solid #a1b49a;
  border-radius: 2px 2px 0 0;
  letter-spacing: .2em;
  font-size: 12px;
}
.bazi-table th:nth-child(3) { background: #d3e0cb; color: #305338; border-top-color: #426d4b; }
.bazi-table td { padding: 13px 0 26px; border: 1px solid #b9cbb675; border-top: 0; background: linear-gradient(180deg,#f6f6ed,#f0f1e5); }
.bazi-table .day-pillar { background: linear-gradient(180deg,#d3e0cb,#e0e8d6); }
.pillar-text { font-size: clamp(39px,3.8vw,55px); line-height: 1.2; gap: 22px; }
.pillar-text span { min-width: 1.2em; }
.pillar-text span+span { padding-top: 18px; border-top: 1px solid #bbc8af87; }
.bazi-table .hidden-row td { padding: 12px 1px; font-size: 13px; height: 51px; border-top: 1px solid #bdcbb578; }
.chart-sheet[data-mode='hidden'] .bazi-table tr:first-child td { border-bottom: 0; }
.chart-sheet[data-mode='elements'] .pillar-text span { border-bottom: 0; text-shadow: 0 0 18px #fff9d7; }
.chart-sheet[data-mode='elements'] .pillar-text span::after { content: ''; display: block; width: 14px; height: 2px; background: currentColor; opacity: .65; margin: 7px auto 0; }
.chart-caption { margin: 20px 8px 0; font-size: 12px; min-height: 44px; }
.chart-disclaimer { margin: 19px 8px 0; color: #687762; border-top-color: #b0c2a7; }

/* 小范围的金砂颗粒；光感由密度形成，不使用大块模糊绿色光晕。 */
.jade-cursor { width: 64px; height: 64px; margin: -32px; }
.jade-cursor::before { display: none; }
.jade-cursor canvas { display: block; width: 64px; height: 64px; opacity: .94; }
.jade-cursor.is-down canvas { transform: scale(1.1,.8); }
@media(max-width:720px) {
  .chart-sheet { padding: 24px 8px 20px; }
  .chart-sheet::before { inset: 7px; }
  .chart-head { padding: 0 9px; }
  .chart-head strong { font-size: 22px; }
  .chart-controls { width: auto; gap: 28px; margin: 0 10px 24px; }
  .chart-controls button { flex: initial; padding: 8px 5px; }
  .bazi-table { border-spacing: 5px 0; }
  .bazi-table th { font-size: 11px; padding-top: 15px; }
  .bazi-table td { padding-bottom: 24px; }
  .pillar-text { font-size: 40px; gap: 19px; }
  .bazi-table .hidden-row td { font-size: 11px; }
  .chart-caption,.chart-disclaimer { margin-left: 10px; margin-right: 10px; }
}
