/* 多人页只负责布局与状态；站点外框、表单、主按钮复用公共 Web 样式。 */
.gh-lede { border-bottom: 1px solid var(--border); }
.tool-page-group .gh-lede h1 { max-width: 20em; margin: 0 0 16px; font: 500 clamp(30px, 4vw, 48px)/1.4 var(--display); letter-spacing: .04em; text-wrap: balance; overflow-wrap: anywhere; }
.gh-lede .synastry-mode { display: flex; width: fit-content; }
.gh-lede .synastry-mode + .gh-muted { max-width: 46em; margin: 16px 0 0; }
.gh-shell { padding-top: 32px; padding-bottom: 56px; }
.gh-shell *, .gh-shell *::before, .gh-shell *::after { box-sizing: border-box; }
.gh-shell h2, .gh-shell h3 { font-family: var(--display); font-weight: 500; line-height: 1.5; letter-spacing: .04em; }
.gh-shell h2 { margin: 0 0 24px; font-size: 24px; overflow-wrap: anywhere; }
.gh-shell h3 { margin: 0 0 12px; font-size: 20px; }
.gh-shell p { line-height: 1.8; }
.gh-shell a:not(.shu-start-link) { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--near-black); font: 400 14px/1.7 var(--sans); text-decoration: none; text-underline-offset: 5px; }
.gh-shell a:not(.shu-start-link):hover { color: var(--seal); text-decoration: underline; }
.gh-muted { color: var(--stone); font: 400 13px/1.8 var(--sans); letter-spacing: .02em; }
.gh-layout { display: grid; grid-template-columns: minmax(0, 1fr) 240px; align-items: start; gap: 48px; }
.gh-layout > *, .gh-row > * { min-width: 0; }
.gh-layout > aside { padding-left: 24px; border-left: 1px solid var(--border-soft); }
.gh-section { margin-bottom: 36px; }
.gh-shell :is(#gh-create, #gh-draft, #gh-report) { scroll-margin-top: 84px; }
.gh-reading article { margin: 16px 0; padding: 24px; background: color-mix(in srgb, var(--ivory) 86%, var(--warm-sand)); border: 1px solid var(--border-soft); border-radius: 14px; box-shadow: 0 8px 24px rgba(24,24,26,.035); }
.gh-reading p { margin: 12px 0; font-size: 16px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.gh-shell label { display: grid; gap: 8px; margin: 16px 0; font: 400 14px/1.7 var(--sans); letter-spacing: .03em; }
.gh-shell input[type="checkbox"] { width: 18px; min-height: 18px; flex-shrink: 0; margin: 3px 0 0; padding: 0; accent-color: var(--near-black); }
.gh-shell button:not(.submit-button) { min-height: 44px; max-width: 100%; padding: 9px 13px; border: 1px solid var(--border); border-radius: 3px; background: transparent; color: var(--near-black); font: 400 14px/1.6 var(--sans); letter-spacing: .03em; cursor: pointer; }
.gh-shell button:not(.submit-button):hover:not(:disabled) { border-color: var(--near-black); background: rgba(24,24,26,.025); }
.gh-shell button:disabled { opacity: .5; cursor: default; }
.gh-shell :focus-visible { outline: 1px solid var(--seal); outline-offset: 3px; }
.gh-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-block: 16px; }
.gh-date { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 12px; margin-block: 16px; }
.gh-shell :is(.gh-row, .gh-date) > label { min-width: 0; margin: 0; }
.gh-check { display: flex !important; align-items: flex-start; gap: 10px !important; }
.gh-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 18px 0; }
.gh-member { padding: 20px 0; border-top: 1px solid var(--border-soft); }
.gh-member-editor { margin: 24px 0; padding: 24px; border: 1px solid var(--border); border-top: 3px solid var(--near-black); background: var(--parchment); scroll-margin-top: 84px; }
.gh-member-editor > h3 { padding-bottom: 14px; border-bottom: 1px solid var(--border-soft); color: var(--seal); }
.gh-member-editor > .gh-row { margin-top: 16px; }
.gh-member-editor > :last-child { margin-bottom: 0; }
.gh-shell .city-sug-item { display: block; min-height: 44px; border: 0; border-radius: 0; text-align: left; }
.gh-shell .city-sug-item + .city-sug-item { border-top: 1px solid var(--border-soft); }
.gh-member fieldset { min-width: 0; padding: 0; margin: 0; border: 0; }
.gh-shell .gh-member fieldset > label:first-child { margin-top: 0; }
.gh-member fieldset:disabled { display: none; }
.gh-shell details { padding: 12px 0; border-top: 1px solid var(--border-soft); }
.gh-shell summary { min-height: 44px; padding: 8px 0; font: 400 14px/1.8 var(--sans); cursor: pointer; }
.gh-group-item { margin-top: 16px; }
.gh-shell .gh-list-item { display: grid; gap: 8px; width: 100%; padding: 14px 16px; text-align: left; overflow-wrap: anywhere; }
.gh-list-title { font-weight: 500; }
.gh-list-meta { color: var(--stone); font-size: 12px; line-height: 1.7; }
.gh-shell .gh-group-manage { margin-top: 4px; font-size: 13px; }
.gh-shell .gh-list-item[aria-current="true"] { border-color: var(--near-black); background: var(--parchment); }
.gh-bubble { padding: 20px 0; border-top: 1px solid var(--border-soft); }
.gh-price { color: var(--near-black); font: 600 15px/1.8 var(--sans); }
#gh-status { margin: 0 0 24px; color: var(--stone); font: 400 14px/1.8 var(--sans); white-space: pre-wrap; }
#gh-status:empty { display: none; }
.gh-shell [hidden] { display: none !important; }
.gh-join { max-width: 640px; margin-inline: auto; }
.gh-join-lede h1 { font-size: clamp(28px, 4vw, 42px); overflow-wrap: anywhere; }
#gh-create-note, #gh-submit-note { margin-top: 12px; color: var(--stone); }
#gh-status.is-error, #gh-create-note.is-error, #gh-submit-note.is-error { color: var(--seal); }
:is(#gh-create, #gh-join) .submit-button.is-loading { justify-content: center; gap: 10px; opacity: 1; cursor: wait; }
.cr-group-members { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px; }
.cr-group-members > span { padding: 12px 16px; border: 1px solid var(--border); font: 500 18px/1.5 var(--display); }
.gh-reading-open { grid-template-columns: minmax(0, 1fr); max-width: 960px; margin-inline: auto; }
.gh-reading-open > aside { display: none; }
.gh-page.is-result-view .gh-lede { display: none; }
#gh-result-nav { margin-bottom: 24px; }
#gh-create > h3 { margin-top: 32px; }
#gh-create > .submit-button, #gh-join > .submit-button { margin-top: 8px; }
#gh-report-meta { margin: -8px 0 24px; }
.gh-reading-lead { padding: 24px 0 32px; border-block: 1px solid var(--border); }
.gh-reading-lead p { font-size: 18px; line-height: 1.85; }
.gh-reading-kicker { display: block; margin-bottom: 12px; color: var(--seal); font: 500 12px/1.6 var(--sans); letter-spacing: .1em; }
.gh-reading-nav { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 16px 0 32px; border-bottom: 1px solid var(--border); }
.gh-guide article { scroll-margin-top: 84px; margin-block: 16px; }
.gh-guide .gh-section-lead { font-weight: 500; color: var(--near-black); }
.gh-guide .gh-reading-subtitle { margin: 28px 0 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border-soft); font: 500 18px/1.65 var(--display); }
.gh-guide strong { font-weight: 650; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--seal) 45%, transparent); text-underline-offset: 5px; text-decoration-thickness: 1px; }
.gh-member-briefs { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; padding-block: 12px 24px; border-bottom: 1px solid var(--border-soft); margin-bottom: 20px; }
.gh-member-briefs h4, .gh-pair-detail h4 { margin: 0 0 8px; font: 500 18px/1.5 var(--display); }
.gh-member-briefs .gh-muted { margin: 6px 0; font-size: 13px; }
.gh-relations svg { display: block; width: 100%; max-width: 680px; margin: auto; overflow: visible; }
.gh-relation-line { stroke: var(--stone); stroke-width: 1.5; opacity: .28; cursor: pointer; }
.gh-relation-line.is-key { opacity: .7; stroke-width: 2.5; }
.gh-relation-line.is-support { stroke: var(--olive); }
.gh-relation-line.is-strain { stroke: var(--seal); }
.gh-relation-line.is-mixed { stroke: var(--seal); stroke-dasharray: 8 5; }
.gh-relation-line.is-unmarked { stroke-dasharray: 2 6; }
.gh-relation-line.is-selected { opacity: 1; stroke-width: 4; }
.gh-relation-node { fill: var(--ivory); stroke: var(--border); stroke-width: 1.5; }
.gh-relation-initial { fill: var(--near-black); font: 500 26px var(--display); }
.gh-relation-name { fill: var(--near-black); font: 400 24px var(--sans); }
.gh-relation-legend, .gh-pair-options { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-block: 16px; }
.gh-relation-legend { font: 400 12px/1.7 var(--sans); color: var(--stone); }
.gh-relation-legend span::before { content: ''; display: inline-block; width: 18px; margin-right: 6px; border-top: 2px solid var(--olive); vertical-align: middle; }
.gh-relation-legend .is-strain::before { border-color: var(--seal); }
.gh-relation-legend .is-mixed::before { border-color: var(--seal); border-top-style: dashed; }
.gh-relation-legend .is-unmarked::before { border-color: var(--stone); border-top-style: dotted; }
.gh-pair-options button { overflow-wrap: anywhere; }
.gh-shell .gh-pair-options button[aria-pressed="true"] { border-color: var(--near-black); background: var(--near-black); color: var(--ivory); }
.gh-pair-detail { padding-block: 20px; border-block: 1px solid var(--border-soft); margin-bottom: 28px; }
.gh-guide .gh-pair-detail p { margin-block: 8px; font-size: 14px; }
.gh-pair-state { color: var(--near-black); font-weight: 500; }
.gh-guide .gh-relations > .gh-muted { font-size: 13px; line-height: 1.8; }
@media (max-width: 900px) {
  .gh-layout { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .gh-layout > aside { padding: 24px 0 0; border-top: 1px solid var(--border-soft); border-left: 0; }
}
@media (max-width: 700px) {
  .gh-shell { padding-top: 24px; padding-bottom: 36px; }
  .tool-page-group .gh-lede h1 { font-size: 30px; }
  .gh-reading article { padding: 24px 16px; }
  .gh-lede .synastry-mode { width: 100%; }
  .gh-row { grid-template-columns: minmax(0, 1fr); }
  .gh-member-editor { padding: 20px 16px; }
  .gh-actions { align-items: stretch; }
  .gh-actions > .submit-button { flex-basis: 100%; }
}