/* One selected reader for recipient, publication review and independent cases. */
.reading-surface { --reading-accent: #397b63; --reading-wash: #e4eeea; border: 1px solid var(--rule); background: #fffdf9; container-type: inline-size; container-name: reading-surface; min-width: 0; }
.reading-surface * { min-width: 0; }
.reading-surface > .profile-header, .reading-surface > .uploaded-header { border: 0; border-bottom: 4px solid var(--reading-accent); }
.reading-introduction { padding: 42px 46px 35px; background: linear-gradient(120deg, var(--reading-wash), #fffdf9 85%); border-bottom: 1px solid var(--rule); }
.reading-introduction > .eyebrow { margin: 0 0 24px; font-size: .65rem; }
.reading-identity { display: flex; align-items: center; gap: 24px; }
.reading-identity > .portrait { width: 84px; height: 88px; flex: none; background: #fffdf9; }
.reading-identity > .portrait.initials { color: var(--reading-accent); font-size: 2.25rem; }
.reading-identity h1, .reading-identity h2, .reading-identity h3 { font: 46px/1.08 Newsreader, Georgia, serif; margin: 0; overflow-wrap: anywhere; }
.reading-intro-words { font: 29px/1.4 Newsreader, Georgia, serif; max-width: 38ch!important; margin: 27px 0 20px; }
.reading-personal-detail { font-size: .9rem; line-height: 1.7; max-width: 58ch; margin: 15px 0; }
.study .reading-contact-shortcut { border: 0; border-bottom: 1px solid var(--reading-accent); padding: 10px 0 5px; border-radius: 0; font-size: .85rem; min-height: 40px; margin-top: 8px; color: var(--reading-accent); }
.study .reading-contact-shortcut:hover { background: transparent; color: var(--ink); }
.reading-surface-body { padding: 35px 42px 30px; }
.reading-quiet-note { font: 24px/1.5 Newsreader, Georgia, serif; margin: 0 0 24px; }
.reading-collection > h2 { font-size: 33px; line-height: 1.2; margin: 8px 0 16px; }
.reading-collection-intro { font-size: .875rem; line-height: 1.7; color: var(--muted); margin: 0 0 24px; }
.reading-filters { display: flex; gap: 18px; align-items: end; padding: 19px 0; border-block: 1px solid var(--rule); }
.reading-filters label { min-width: 0; font-size: .75rem; }
.reading-filters > label:first-child { flex: 1; }
.reading-filters input, .reading-filters select { width: 100%; font-size: .85rem; }
.reading-filters button { flex: none; font-size: .75rem; border-color: var(--rule); padding: 10px 12px; }
.reading-count { margin-block: 17px 25px; font-size: .75rem; }
.reading-count:focus-visible, .reading-detail h2:focus-visible, .reading-continuation:focus-visible, .reading-receipt:focus-visible { outline: 3px solid var(--reading-accent); outline-offset: 6px; }
.reading-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px; align-items: stretch; }
.reading-piece-card { background: #fff; border: 1px solid var(--rule); border-radius: 3px; overflow: hidden; min-width: 0; }
.reading-piece-card > .media-art, .reading-piece-card > .uploaded-frame, .reading-piece-card > .reading-fallback-art { height: 190px; width: 100%; border: 0; border-bottom: 1px solid var(--rule); }
.reading-piece-card .media-art img { max-height: 100%; }
.reading-fallback-art { background: #fbf2e3; display: grid; place-items: center; }
.reading-fallback-art img { width: 70%; height: 80%; object-fit: contain; }
.reading-card-copy { padding: 24px; }
.reading-card-copy .eyebrow { font-size: .62rem; margin: 0 0 13px; }
.reading-card-copy h3 { font-size: 29px; line-height: 1.15; margin: 0 0 17px; overflow-wrap: anywhere; }
.reading-card-copy > p:not(.eyebrow) { font-size: .85rem; line-height: 1.7; }
.reading-card-copy > p.fine { font-size: .75rem; }
.study .reading-card-copy > button { font-size: .85rem; border: 0; border-bottom: 1px solid var(--reading-accent); border-radius: 0; padding: 10px 0 5px; color: var(--reading-accent); margin-top: 5px; }
.study .reading-card-copy > button:hover { background: transparent; color: var(--ink); }
.reading-piece-card.is-featured { grid-column: 1 / -1; }
.reading-piece-card.is-featured:has(> .media-art), .reading-piece-card.is-featured:has(> .uploaded-frame), .reading-piece-card.is-featured:has(> .reading-fallback-art) { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); }
.reading-piece-card.is-featured > .media-art, .reading-piece-card.is-featured > .uploaded-frame, .reading-piece-card.is-featured > .reading-fallback-art { height: 100%; min-height: 225px; border-bottom: 0; border-right: 1px solid var(--rule); }
.reading-no-results { text-align: center; background: var(--reading-wash); padding: 30px 24px; }
.reading-no-results img { width: 48px; height: 65px; margin-bottom: 15px; }
.reading-no-results h3 { font-size: 28px; line-height: 1.2; }
.reading-no-results p { margin-inline: auto; font-size: .875rem; }
.reading-pages { display: flex; justify-content: center; align-items: center; gap: 18px; margin: 30px 0 12px; }
.reading-pages button { font-size: .8rem; padding: 10px 14px; border-color: var(--rule); }
.reading-pages button:disabled { opacity: .45; cursor: not-allowed; }
.reading-pages span { text-align: center; }
.reading-detail { max-width: 760px; margin-inline: auto; scroll-margin-top: 24px; }
.study .reading-back { border: 0; padding: 10px 0; color: var(--reading-accent); text-decoration: underline; text-underline-offset: 4px; font-size: .85rem; margin-bottom: 28px; }
.study .reading-back:hover { background: transparent; color: var(--ink); }
.reading-detail > h2 { font: 42px/1.1 Newsreader, Georgia, serif; margin-block: 17px 25px; overflow-wrap: anywhere; }
.reading-detail > .reading-summary { font: 25px/1.5 Newsreader, Georgia, serif; }
.reading-detail > .reading-context { font-size: 1rem; line-height: 1.85; margin-block: 24px 30px; }
.reading-detail > .media-art, .reading-detail > .uploaded-frame, .reading-detail > .reading-fallback-art { height: 260px; margin-block: 30px; border: 1px solid var(--rule); }
.reading-detail > .reading-contribution { padding: 22px 24px; border-left: 3px solid var(--reading-accent); background: var(--reading-wash); font-size: .9rem; line-height: 1.8; }
.reading-detail > .reading-contribution strong { font-size: .75rem; }
.reading-detail .writing-prose { margin-block: 30px; }
.reading-detail .writing-prose p { max-width: none; }
.reading-source { margin-top: 34px; padding: 24px; border: 1px solid var(--rule); background: #f6f2e9; }
.reading-source p { font-size: .85rem; line-height: 1.7; overflow-wrap: anywhere; }
.reading-source p.fine { font-size: .75rem; }
.reading-source > .eyebrow { font-size: .65rem; }
.reading-source button { font-size: .85rem; }
.reading-related { border-top: 1px solid var(--rule); margin-top: 35px; padding-top: 27px; }
.reading-related h3 { font-size: 29px; line-height: 1.2; }
.reading-related > div { padding-block: 8px 15px; }
.reading-related p { font-size: .875rem; line-height: 1.7; }
.reading-related button { text-align: left; font-size: .875rem; }
.reading-continuation { border-top: 1px solid var(--rule); margin-top: 42px; padding: 32px 0 12px; scroll-margin-top: 24px; }
.reading-continuation h2 { font-size: 31px; line-height: 1.2; margin: 0 0 15px; }
.reading-continuation > p { font-size: .875rem; }
.reading-contact-paths { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px 22px; margin-top: 19px; }
.study .reading-contact-paths > button { border: 0; border-radius: 0; border-bottom: 1px solid var(--reading-accent); padding: 10px 0 5px; font-size: .875rem; color: var(--reading-accent); }
.study .reading-contact-paths > button:hover { background: transparent; color: var(--ink); }
.reading-elsewhere { margin-top: 30px; }
.reading-elsewhere h3 { font-size: 27px; line-height: 1.2; margin-bottom: 12px; }
.reading-elsewhere .fine { font-size: .75rem; }
.reading-receipt { background: var(--reading-wash); border-left: 3px solid var(--reading-accent); padding: 20px 24px; margin-block: 25px; font-size: .85rem; line-height: 1.75; overflow-wrap: anywhere; }
.reading-receipt:empty { display: none; }
.reading-inspector { border-top: 1px solid var(--rule); margin-top: 30px; padding-top: 22px; }
.reading-inspector summary { cursor: pointer; font-size: .875rem; line-height: 1.65; }
.reading-inspector p { font-size: .85rem; line-height: 1.75; }
.reading-inspector p.fine { font-size: .75rem; }
.reading-inspector pre { padding: 20px; max-height: 28rem; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; background: #fff; border: 1px solid var(--rule); font: .75rem/1.7 ui-monospace, monospace; }
.reading-unavailable { background: #f7f2e7; border: 1px solid var(--rule); padding: clamp(26px,5vw,54px); text-align: center; }
.reading-unavailable > img { width: 67px; height: 90px; margin-bottom: 25px; }
.reading-unavailable h2 { font-size: 34px; line-height: 1.2; }
.reading-unavailable p { margin-inline: auto; max-width: 52ch; }
.reading-unavailable .reading-inspector { text-align: left; }
.reading-lab-tools { display: flex; align-items: end; justify-content: space-between; gap: 24px; padding: 24px 0; border-block: 1px solid var(--rule); margin: 32px 0 25px; }
.reading-lab-tools > label { width: min(100%,440px); }
.reading-lab-tools select { width: 100%; }
.reading-lab-tools > button { flex: none; }
.reading-lab-intro { max-width: 77ch!important; }
.reading-lab [data-reading-root] { margin-top: 35px; }
.reading-lab-confirm { padding: 22px 25px; background: #f8e9e9; border: 1px solid var(--rule); margin-block: 24px; }
.reading-lab-confirm[hidden] { display: none; }
.reading-lab-confirm p { margin-top: 0; }
.reading-lab-feedback { color: var(--chosen); font-size: .875rem; }
.reading-lab-feedback:empty { display: none; }
@container reading-surface (max-width: 650px) {
  .reading-introduction { padding: 28px; }
  .reading-surface-body { padding: 28px; }
  .reading-identity { gap: 18px; }
  .reading-identity h1, .reading-identity h2, .reading-identity h3 { font-size: 38px; }
  .reading-identity > .portrait { width: 72px; height: 76px; }
  .reading-intro-words { font-size: 26px; }
  .reading-card-grid { grid-template-columns: 1fr; gap: 22px; }
  .reading-piece-card.is-featured:has(> .media-art), .reading-piece-card.is-featured:has(> .uploaded-frame), .reading-piece-card.is-featured:has(> .reading-fallback-art) { display: block; }
  .reading-piece-card.is-featured > .media-art, .reading-piece-card.is-featured > .uploaded-frame, .reading-piece-card.is-featured > .reading-fallback-art { min-height: 0; height: 190px; border-right: 0; border-bottom: 1px solid var(--rule); }
  .reading-filters { flex-wrap: wrap; }
  .reading-filters > label:first-child { flex-basis: 100%; }
  .reading-filters > label:not(:first-child) { flex: 1; }
  .reading-detail > h2 { font-size: 36px; }
}
@container reading-surface (max-width: 400px) {
  .reading-introduction { padding: 24px 22px; }
  .reading-surface-body { padding: 24px 20px; }
  .reading-identity { display: block; }
  .reading-identity h1, .reading-identity h2, .reading-identity h3 { font-size: 34px; margin-top: 18px; }
  .reading-intro-words { font-size: 24px; margin-top: 22px; }
  .reading-card-copy { padding: 20px; }
  .reading-card-copy h3 { font-size: 27px; }
  .reading-card-copy .eyebrow { font-size: .6rem; }
  .reading-collection > h2 { font-size: 29px; }
  .reading-source { padding: 20px; }
  .reading-detail > h2 { font-size: 33px; }
  .reading-detail > .media-art, .reading-detail > .uploaded-frame, .reading-detail > .reading-fallback-art { height: 195px; }
  .reading-pages { gap: 10px; flex-wrap: wrap; }
  .reading-pages button { font-size: .7rem; padding: 10px; }
  .reading-pages span { font-size: .7rem; }
  .reading-continuation h2 { font-size: 29px; }
  .reading-receipt { padding: 18px; }
  .reading-inspector pre { padding: 13px; }
}
@media (max-width: 620px) {
  .reading-lab-tools { display: block; }
  .reading-lab-tools > label { width: 100%; }
  .reading-lab-tools > button { margin-top: 18px; }
}

.reading-brand{display:flex;align-items:baseline;gap:.8rem;margin:2rem 0 0;padding-top:1.3rem;border-top:1px solid var(--line,#d6cec1);font-size:.85rem}.reading-brand .wordmark{font-size:1rem}.reading-brand em{font-family:var(--serif,Georgia,serif)}

/* Keep the shared sign-off intact inside narrow module readers. */
.reading-brand .wordmark { display: inline-flex; align-items: center; gap: .08em; white-space: nowrap; }
.reading-brand .cycle { display: inline-flex; width: 1em; height: 1em; flex: none; }
.reading-brand .cycle svg { display: block; width: 100%; height: 100%; }
