/* Ordered study notes: a position stays beside its two possible readings. */
/* Match the async card's height so deep links do not jump when artwork mounts. */
body[data-page="spread-card"] .spread-card-mount { min-height: var(--card-height); }
.spread-card-study { --study-ink: #eeeadd; --study-muted: #bdcbbf; --study-brass: #d2bc85; --study-line: #40594a; color: var(--study-ink); padding-top: 28px; }
.spread-card-study .spread-card-study-wrap { max-width: 1080px; }
.spread-card-study :is(h2, h3) { text-transform: none; letter-spacing: 0; color: var(--study-ink); line-height: 1.35; }
.spread-card-study h2 { font-size: clamp(1.55rem, 3vw, 2.15rem); margin: 0 0 20px; max-width: 30ch; }
.spread-card-study h3 { font-size: 1.2rem; margin: 0; }
.spread-card-study :is(p, dd, li) { font-weight: 400; font-size: 1rem; line-height: 1.85; color: var(--study-muted); }
.spread-card-study p { max-width: 74ch; }
.spread-card-study a { color: var(--study-brass); text-decoration: underline; text-underline-offset: .22em; }
.spread-card-study a:hover { color: #eee0b5; }
.spread-card-study a:focus-visible { outline: 3px solid #e6d69d; outline-offset: 5px; }
.spread-card-study :is(h2, h3, #spread-card-positions) { scroll-margin-top: 110px; }
.spread-card-study-positions-heading > p { margin-bottom: 20px; }
.spread-card-study-index { border-block: 1px solid var(--study-line); margin: 27px 0 10px; padding-block: 13px; }
.spread-card-study-index ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px 22px; list-style: none; padding: 0; margin: 0; }
.spread-card-study-index a { display: flex; align-items: center; gap: 8px; min-height: 44px; padding-block: 8px; font-size: .94rem; line-height: 1.55; }
.spread-card-study-index a span { color: var(--study-muted); font-size: .82rem; text-decoration: none; }
.spread-card-study .spread-card-study-positions { list-style: none; padding: 0; margin: 0 0 35px; }
.spread-card-study-position { border-bottom: 1px solid var(--study-line); padding: 32px 0; }
.spread-card-study-position article { display: grid; grid-template-columns: 185px minmax(0, 1fr); gap: 34px; align-items: start; }
.spread-card-study-number { display: block; font-size: .86rem; color: var(--study-brass); margin-bottom: 11px; }
.spread-card-study-contrast { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 29px; margin: 0; }
.spread-card-study-contrast dt { color: var(--study-ink); font-size: .95rem; font-weight: 500; margin: 0 0 10px; }
.spread-card-study-contrast dd { margin: 0; }
.spread-card-study .spread-card-study-question { border-left: 2px solid #899c77; padding-left: 18px; margin: 23px 0 0; font-size: .96rem; }
.spread-card-study-question strong { display: block; font-weight: 500; color: #dde2cc; font-size: .9rem; margin-bottom: 7px; }
.spread-card-study-example { max-width: 850px; margin: 62px auto 0; padding: 32px 38px; background: #15271d; border: 1px solid var(--study-line); border-radius: 9px; scroll-margin-top: 100px; }
.spread-card-study-example h2 { max-width: 28ch; }
.spread-card-study .spread-card-study-fiction { font-size: .94rem; line-height: 1.8; margin-bottom: 26px; }
.spread-card-study .spread-card-study-example-question { font-size: 1.1rem; line-height: 1.7; margin: 0 0 24px; color: var(--study-ink); }
.spread-card-study-example-question strong { display: block; color: var(--study-brass); font-size: .9rem; font-weight: 500; margin-bottom: 9px; }
.spread-card-study .spread-card-study-connections { margin: 25px 0; padding: 0; list-style: none; }
.spread-card-study-connections li { border-top: 1px solid var(--study-line); padding-top: 22px; margin-top: 22px; }
.spread-card-study-connections h3 { font-size: 1.1rem; margin-bottom: 12px; }
.spread-card-study-connections p { margin-bottom: 0; }
.spread-card-study-reading { border-top: 1px solid var(--study-line); padding-top: 23px; margin-top: 28px; }
.spread-card-study-reading > div + div { margin-top: 24px; }
.spread-card-study-reading dt { color: var(--study-brass); font-size: 1rem; font-weight: 500; margin-bottom: 10px; }
.spread-card-study-reading dd { margin: 0; }
.spread-card-study-exercise { max-width: 850px; margin: 46px auto 0; padding-block: 24px 0; }
.spread-card-study-next { display: flex; flex-wrap: wrap; gap: 6px 25px; margin-top: 19px; }
.spread-card-study-next a { display: inline-flex; align-items: center; min-height: 44px; font-size: .94rem; line-height: 1.6; }
@media (max-width: 900px) {
  .spread-card-study-position article { grid-template-columns: 1fr; gap: 22px; }
  .spread-card-study-position header { display: flex; align-items: baseline; gap: 17px; }
  .spread-card-study-number { flex: 0 0 auto; margin: 0; }
  .spread-card-study-position h3 { font-size: 1.28rem; }
  .spread-card-study-example { padding: 28px; }
}
@media (max-width: 600px) {
  .spread-card-study-index ol { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 17px; }
  .spread-card-study-contrast { grid-template-columns: 1fr; gap: 22px; }
  .spread-card-study-position article { gap: 24px; }
  .spread-card-study-position header { display: block; }
  .spread-card-study-number { margin-bottom: 9px; }
  .spread-card-study-position { padding-block: 28px; }
  .spread-card-study-example { margin-top: 40px; padding: 23px 20px; }
  .spread-card-study-exercise { margin-top: 29px; }
}
@media print {
  .spread-card-study { --study-ink: #101810; --study-muted: #25352a; --study-brass: #334831; --study-line: #81927e; }
  .spread-card-study-example { background: transparent; }
  .spread-card-study-position, .spread-card-study-connections li, .spread-card-study-reading > div { break-inside: avoid; }
}
