/* A full-width question, then casting and results side by side. */
html body.tianji-mystic[data-orchid-tool="yaogua"] .divination-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 22px;
  align-items: stretch;
}
html body.tianji-mystic[data-orchid-tool="yaogua"] .question-card {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 172px minmax(0, 1fr);
  align-items: center;
  gap: 26px;
  min-width: 0;
  padding: 24px 28px;
}
html body.tianji-mystic[data-orchid-tool="yaogua"] .question-card .card-heading { margin: 0; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .question-card .question-field { min-width: 0; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .question-card .question-field small { display: flex; justify-content: flex-end; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .question-card textarea {
  display: block;
  min-height: 76px;
  border-radius: 12px;
}
html body.tianji-mystic[data-orchid-tool="yaogua"] :is(.ritual-card, .reading-card) { min-width: 0; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .ritual-card { align-self: start; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .progress-block { margin-top: 0; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .reading-card { display: flex; flex-direction: column; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading:not([hidden]) {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
  min-height: 0;
}
html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading-art {
  order: -1;
  flex: 0 0 auto;
  width: min(45%, 174px);
  margin: 0 auto;
}
html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading-copy { width: 100%; text-align: center; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading-copy > .card-kicker { display: none; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading-copy > p { margin-inline: auto; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading h2 { font-size: 22px; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading ol {
  max-width: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 22px;
}
html body.tianji-mystic[data-orchid-tool="yaogua"] .yao-row {
  grid-template-columns: 32px minmax(0, 1fr) 64px;
  gap: 8px;
}
html body.tianji-mystic[data-orchid-tool="yaogua"] .gua-identity { flex-wrap: wrap; gap: 6px; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .gua-identity h3 { white-space: normal; overflow-wrap: anywhere; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .result-heading { flex-wrap: wrap; }
html body.tianji-mystic[data-orchid-tool="yaogua"] .history-heading { flex-wrap: wrap; }
html body.tianji-mystic[data-orchid-tool="yaogua"] :is(#yaoguaHistory, a[href="#historyTitle"])[hidden] { display: none; }

@media (max-width: 980px) {
  html body.tianji-mystic[data-orchid-tool="yaogua"] .divination-grid { grid-template-columns: minmax(0, 1fr); }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .question-card { grid-template-columns: 140px minmax(0, 1fr); gap: 20px; }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading:not([hidden]) { padding-block: 10px; }
}
@media (max-width: 680px) {
  html body.tianji-mystic[data-orchid-tool="yaogua"] .divination-grid { gap: 16px; }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .question-card { grid-template-columns: minmax(0, 1fr); gap: 15px; padding: 20px 17px; border-radius: 18px; }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .question-card .card-kicker { display: none; }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .question-card textarea { font-size: 16px; }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .ritual-stage { padding-inline: 10px; }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .coin-stage { min-height: 132px; gap: clamp(6px, 2vw, 12px); }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .coin { width: clamp(54px, 17vw, 78px); height: clamp(54px, 17vw, 78px); }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading h2 { font-size: 20px; }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .empty-reading li { padding: 10px; }
  html body.tianji-mystic[data-orchid-tool="yaogua"] .history-actions { flex-wrap: wrap; }
}