/* Give the reader something useful before the supporting read. */
.resources-flow .reading-page { max-width: 920px; }
.resources-flow .reading-head { max-width: 860px; margin: 0 auto 29px; text-align: center; }
.resources-flow .reading-head .reading-crumbs { justify-content: center; }
.resources-flow .reading-head h1 { max-width: none; margin: 12px auto 0; font-size: clamp(31px, 3.3vw, 44px); font-weight: 440; line-height: 1.13; letter-spacing: -.035em; }
.resources-flow .reading-lead { max-width: 58ch; margin: 17px auto 0; color: #59616d; font-size: 16px; line-height: 1.65; }
.resources-flow .reading-meta { margin-top: 14px; color: #68717e; font-size: 11px; }
/* The synonym line under a term's lead (decision WD-5): the meta line's color, sized and balanced for a sentence. */
.resources-flow .reading-synonym { max-width: 58ch; margin-inline: auto; font-size: 13px; line-height: 1.55; text-wrap: balance; }
.reading-content { width: 100%; max-width: 700px; margin-inline: auto; }
.reading-page .reading-answer { max-width: 700px; margin: 0 auto 29px; padding: 0; border: 0; border-radius: 0; background: none; }
.reading-page .reading-answer h2 { margin: 0 0 15px; color: #a72135; font-size: 13px; font-weight: 500; text-align: center; }
.reading-page .reading-answer p, .reading-page .reading-answer li { color: #343b46; font-size: 20px; line-height: 1.65; letter-spacing: -.013em; }
.guide-first-read { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); align-items: start; gap: 44px; margin: 35px auto 38px; }
.reading-page--guide .reading-answer { max-width: none; margin: 0; padding-top: 17px; text-align: left; }
.reading-page--guide .reading-answer p { margin: 0; color: #505966; }
.reading-page--guide .reading-answer .reading-meta { margin-top: 22px; color: #68717e; font-size: 11px; line-height: 1.6; letter-spacing: 0; }
.reading-quick { padding: 25px 28px 28px; border: 1px solid #e0e4e9; border-radius: 18px; background: linear-gradient(145deg, #fff, #fdfdfe); box-shadow: inset 0 1px 0 #fff, 0 8px 16px -14px #31425a35; }
.reading-quick h2 { margin: 0 0 22px; color: #303844; font-size: 20px; font-weight: 480; line-height: 1.35; letter-spacing: -.024em; }
.reading-steps { display: grid; gap: 21px; margin: 0; padding: 0; list-style: none; }
.reading-steps li { display: grid; grid-template-columns: 22px minmax(0, 1fr); align-items: baseline; gap: 12px; }
.reading-step-number { color: #a72135; font-size: 11px; font-weight: 520; font-variant-numeric: tabular-nums; }
.reading-steps p { margin: 0; color: #46515e; font-size: 16px; line-height: 1.65; }
.reading-instruction { margin: 0 0 20px; color: #5d6774; font-size: 13px; line-height: 1.6; text-wrap: pretty; }
.reading-quick h2:has(+ .reading-instruction) { margin-bottom: 9px; }
.reading-response__heading:has(+ .reading-instruction) { margin-bottom: 8px; }
.reading-response > .reading-instruction { margin-bottom: 20px; }
.reading-term-use { max-width: 60ch; margin: 0 0 27px; }
.reading-template { margin: 0; color: #37414f; font-size: 17px; line-height: 1.7; white-space: pre-wrap; }
.reading-copybar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: 15px; }
.reading-copybar:has(.reading-copy[hidden]) { display: none; }
.reading-copy { display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border: 1px solid #dce2e9; border-radius: 9px; background: #fff; color: #465363; font: inherit; font-size: 12px; font-weight: 480; cursor: pointer; box-shadow: 0 1px 1px #28364a08; }
.reading-copy[hidden] { display: none; }
.reading-copy:hover { border-color: #bfc8d4; color: #a72135; }
.reading-copy:focus-visible { outline: 2px solid #a72135; outline-offset: 3px; }
.reading-copy-status { color: #68717e; font-size: 12px; line-height: 1.5; }
.reading-page .reading-answer p + p { margin-top: 16px; }
.reading-page .reading-answer li + li { margin-top: 8px; }

/* A real example, a next action, then an editable response. */
.signal-first-read { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 38px; margin: 31px auto 29px; }
.reading-page .reading-quote { width: 100%; max-width: 700px; margin: 0 auto; padding: 0; border: 0; text-align: center; }
.reading-conversation { position: relative; max-width: 700px; margin-inline: auto; padding: 27px 32px; border: 1px solid #9d2437; border-radius: 24px 24px 24px 8px; background: linear-gradient(160deg, #b83246 0%, #a7273b 52%, #982336 100%); box-shadow: inset 0 1px 0 #ffffff38, inset 1px 0 0 #ffffff12, 0 13px 25px -21px #6e152c80; }
.reading-conversation::after { content: ''; position: absolute; left: 32px; bottom: -13px; width: 23px; height: 14px; background: #9c2437; clip-path: polygon(0 0, 100% 0, 0 100%); }
.reading-conversation__mark { display: none; }
.reading-page .reading-quote blockquote { margin: 0; color: #fff; font-size: 26px; font-weight: 430; line-height: 1.4; letter-spacing: -.025em; text-wrap: balance; }
.reading-page .reading-quote blockquote::before, .reading-page .reading-quote blockquote::after { content: none; }
.reading-page .reading-quote figcaption { margin-top: 23px; color: #69717d; font-size: 11px; }
.reading-next { margin: 0; padding-bottom: 26px; color: #424b59; font-size: 17px; line-height: 1.75; }
.reading-next h2 { margin: 0 0 13px; color: #a72135; font-size: 14px; font-weight: 500; text-align: left; }
.reading-next p + p { margin-top: 15px; }
.reading-next a { text-decoration: underline; text-underline-offset: 4px; }

.reading-response { margin-bottom: 30px; padding: 25px 29px 23px; border: 1px solid #e0e4e9; border-radius: 17px; background: #fff; box-shadow: inset 0 1px 0 #fff, 0 8px 16px -14px #31425a35; }
.reading-response__heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin-bottom: 18px; }
.reading-response__heading h2 { margin: 0; color: #37414e; font-size: 15px; font-weight: 500; }
.reading-response__heading > span { color: var(--secondary); font-size: 10px; line-height: 1.5; }
.reading-response__context { margin: 0 0 20px; color: #697482; font-size: 14px; line-height: 1.6; }
.reading-response__context > span { color: var(--secondary); font-size: 11px; }
.reading-response__context > p { margin: 5px 0 0; }
.reading-response > blockquote { margin: 0; color: #313c4a; font-size: 21px; line-height: 1.6; letter-spacing: -.018em; }

/* One continuous definition surface, with the authored calculation set clearly. */
.reading-term-entry { max-width: 800px; margin-top: 35px; padding: 35px 38px 36px; border: 1px solid #e0e4e9; border-radius: 21px; background: linear-gradient(145deg, #fff, #fdfdfe); box-shadow: inset 0 1px 0 #fff, 0 9px 20px -17px #31425a35; }
.reading-term-entry h2 { margin: 5px 0 0; color: #9b3542; font-size: 12px; font-weight: 500; line-height: 1.6; letter-spacing: 0; }
.reading-term-entry .reading-definition, .reading-term-entry .reading-relevance { display: grid; grid-template-columns: 84px minmax(0, 1fr); column-gap: 26px; }
.reading-page .reading-definition { max-width: none; margin: 0; padding: 0; color: #4d5865; font-size: 17px; line-height: 1.75; }
.reading-page .reading-definition > div > p:first-child { color: #303c4b; font-size: 19px; font-weight: 430; line-height: 1.7; letter-spacing: -.016em; }
.reading-page .reading-definition p + p { margin-top: 20px; }
.reading-term-entry .reading-relevance { margin-top: 28px; color: #4d5865; font-size: 17px; line-height: 1.75; }
.reading-relevance p + p { margin-top: 18px; }
.reading-relevance a { text-decoration: underline; text-underline-offset: 4px; }
.reading-formula { margin: 0 0 31px; padding: 4px 0 29px; border-bottom: 1px solid #e2e6eb; }
.reading-formula > div { display: grid; grid-template-columns: minmax(0, .75fr) 22px minmax(0, 1.25fr); align-items: center; gap: 17px; }
.reading-formula__name { color: #455160; font-size: 19px; line-height: 1.35; letter-spacing: -.025em; text-align: right; }
.reading-formula__equals { color: #9fa7b2; font-size: 25px; font-weight: 400; text-align: center; }
.reading-formula__fraction { display: grid; color: #a72135; font-size: 20px; font-weight: 440; line-height: 1.4; letter-spacing: -.018em; text-align: center; }
.reading-formula__fraction > span { padding: 12px 6px; }
.reading-formula__fraction > span:first-child { border-bottom: 1px solid #c67380; }
.reading-formula figcaption { margin-top: 11px; color: #7b8490; font-size: 11px; text-align: center; }

/* A single seam opens a continuous article, without nested accordions or pitches. */
.reading-content > .reading-detail { margin: 0; border-block: 1px solid #d8dee6; }
.reading-content .reading-detail > summary { min-height: 65px; padding: 20px 36px 20px 0; color: #39414d; font-size: 16px; font-weight: 470; }
.reading-content .reading-detail > summary::after { right: 2px; color: #788290; font-size: 22px; }
.reading-content .reading-detail > summary:hover, .reading-content .reading-detail[open] > summary, .reading-content .reading-detail[open] > summary::after { color: #a72135; }
.reading-content .reading-detail__body { padding: 7px 0 28px; color: #454f5e; font-size: 16px; line-height: 1.75; }
.reading-content .reading-detail__body h2 { text-align: center; }
.reading-content .reading-detail__body h3 { text-align: left; font-size: 18px; line-height: 1.4; }
.resources-flow .reading-content .res-body { margin-top: 0; font-size: 17px; line-height: 1.75; }
.resources-flow .reading-content .res-body h2 { font-size: 25px; margin-top: 35px; }
.resources-flow .reading-content .res-body h2:first-child { margin-top: 8px; }
.reading-content .reading-section { margin: 32px 0 0; }
.reading-content .reading-section:first-child { margin-top: 0; }
.reading-content .reading-section > h2 { margin: 0 0 17px; font-size: 23px; line-height: 1.3; font-weight: 490; letter-spacing: -.02em; }
.reading-content .reading-question { margin-top: 23px; }
.reading-content .reading-question > h3 { margin: 0 0 8px; font-weight: 500; }
.reading-content .reading-question > p { margin: 0; }
.reading-content .reading-sources { font-size: 14px; }
.reading-content .reading-sources li + li { margin-top: 8px; }
.reading-page > .reading-return { margin: 27px auto 0; text-align: center; }
.reading-return a { display: inline-flex; align-items: center; min-height: 38px; color: #697382; font-size: 13px; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: #bcc4cf; }
.reading-return a:hover { color: #a72135; }

/* The working endpoint is immediate; the full technical reference is one read. */
.resources-flow .reading-page--api .reading-head h1 { max-width: 22ch; }
.reading-page .api-connection { max-width: 700px; margin: 0 auto 28px; padding: 0; text-align: center; }
.reading-page .api-connection h2 { margin: 0 0 13px; color: #616b78; font-size: 13px; font-weight: 450; }
.reading-page .api-endpoint { margin: 0; padding: 24px 22px; border: 1px solid #dce1e8; border-radius: 12px; background: #fff; box-shadow: 0 2px 2px -2px #23344f24; white-space: pre-wrap; overflow-wrap: anywhere; }
.reading-page .api-endpoint code { color: #a92235; font-size: clamp(16px, 1.9vw, 22px); line-height: 1.5; letter-spacing: -.03em; }
.resources-flow .reading-content .api-section { max-width: none; margin: 34px 0 0; }
.resources-flow .reading-content .api-section:first-child { margin-top: 0; }
.resources-flow .reading-content .api-setup { margin-bottom: 30px; }
.reading-content .api-setup > h2 { font-size: 25px; }
.reading-page .api-connection .reading-copybar { justify-content: center; }
.reading-content .api-steps { margin: 12px 0 0; }
.reading-content .api-steps li { border: 0; padding: 9px 0; }
.reading-content .api-list { padding-left: 0; list-style: none; }
.reading-content .api-list > li { padding-top: 15px; }
.reading-content .api-code { max-width: 100%; font-size: 12px; }
.reading-content .api-code code { white-space: pre; word-break: normal; overflow-wrap: normal; font-size: 12px; }
.reading-content .reading-detail__body code { overflow-wrap: anywhere; }
@media (max-width: 650px) {
  .resources-flow .reading-head { margin-bottom: 25px; }
  .resources-flow .reading-head h1 { margin-top: 10px; font-size: clamp(29px, 7.3vw, 38px); line-height: 1.15; }
  .resources-flow .reading-lead { margin-top: 15px; font-size: 15px; }
  .resources-flow .reading-meta { font-size: 11px; margin-top: 13px; }
  .resources-flow .reading-synonym { font-size: 13px; }
  .guide-first-read, .signal-first-read { grid-template-columns: 1fr; gap: 24px; margin-top: 25px; margin-bottom: 29px; }
  .reading-page .reading-answer { margin-bottom: 0; padding-top: 0; }
  .reading-page--guide .reading-answer .reading-meta { margin-top: 13px; }
  .reading-quick { padding: 23px 20px 24px; border-radius: 15px; }
  .reading-quick h2 { font-size: 19px; margin-bottom: 20px; }
  .reading-steps { gap: 19px; }
  .reading-steps li { grid-template-columns: 18px minmax(0, 1fr); gap: 10px; }
  .reading-steps p { font-size: 15px; }
  .reading-template { font-size: 16px; }
  .reading-next { padding-bottom: 0; }
  .reading-next h2 { margin-bottom: 10px; }
  .reading-response { padding: 22px 20px; border-radius: 15px; }
  .reading-response > blockquote { font-size: 19px; }
  .reading-term-entry { margin-top: 28px; padding: 25px 22px 27px; border-radius: 16px; }
  .reading-term-entry .reading-definition, .reading-term-entry .reading-relevance { grid-template-columns: 1fr; gap: 12px; }
  .reading-term-entry h2 { margin: 0; font-size: 11px; }
  .reading-term-entry .reading-relevance { margin-top: 23px; font-size: 16px; }
  .reading-formula { padding-bottom: 23px; margin-bottom: 24px; }
  .reading-formula > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .reading-formula__name { font-size: 16px; text-align: center; }
  .reading-formula__equals { font-size: 19px; }
  .reading-formula__fraction { font-size: 19px; }
  .reading-formula__fraction > span { padding-block: 10px; }
  .reading-page .reading-answer p, .reading-page .reading-answer li { font-size: 17px; line-height: 1.7; }
  .reading-conversation { padding: 23px 22px; border-radius: 21px 21px 21px 7px; }
  .reading-conversation::after { left: 25px; }
  .reading-page .reading-quote blockquote { font-size: 22px; line-height: 1.45; }
  .reading-page .reading-quote figcaption { margin-top: 21px; }
  .reading-next, .reading-relevance { font-size: 16px; }
  .reading-page .reading-definition { font-size: 16px; }
  .reading-page .reading-definition > div > p:first-child { font-size: 17px; line-height: 1.7; }
  .reading-content .reading-detail > summary { min-height: 61px; padding-block: 18px; font-size: 15px; }
  .reading-content .reading-detail__body, .resources-flow .reading-content .res-body { font-size: 16px; }
  .reading-content .reading-detail__body h3 { font-size: 17px; }
  .reading-content .reading-section > h2, .resources-flow .reading-content .res-body h2 { font-size: 23px; }
  .reading-page .api-endpoint { padding: 21px 14px; }
  .reading-page .api-endpoint code { font-size: 16px; }
}
@media print {
  .resources-flow .reading-page, .reading-content { max-width: none; }
  .guide-first-read, .signal-first-read { display: block; }
  .reading-quick, .reading-response { margin-top: 20px; box-shadow: none; break-inside: avoid; }
  .reading-content .res-body { display: block !important; }
  .reading-page .api-endpoint, .reading-term-entry { box-shadow: none; }
  .reading-conversation { background: none; border-color: #a1a8b1; box-shadow: none; }
  .reading-conversation::after { display: none; }
  .reading-page .reading-quote blockquote { color: #222; }
  .reading-return, .reading-copybar { display: none; }
}
