/* Page layout extends the public illustration kit and Reporter typography. */
/* The shared bar deliberately uses a high layer; keyboard access must remain above it. */
.living-research .prp-skip:focus { position: fixed; z-index: 2147483001; }
.living-research .lr-hero { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 32px; padding-top: clamp(48px, 8vw, 100px); }
.lr-hero h1 { font-size: clamp(44px, 5.5vw, 74px); line-height: 1.03; letter-spacing: -.025em; }
.lr-lead { font: 400 clamp(20px, 2vw, 24px)/1.45 var(--prp-serif); }
.lr-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 28px; }
.lr-hero figure { margin: 0; }
.lr-hero figcaption { font: 12px/1.5 var(--prp-mono); color: var(--prp-muted); text-align: center; margin-top: 14px; }
.lr-section { padding-block: clamp(64px, 8vw, 112px); }
.lr-heading { max-width: 44em; margin-bottom: 32px; }
.living-research h2 { font-size: clamp(34px, 4.2vw, 56px); line-height: 1.07; letter-spacing: -.02em; text-wrap: balance; }
.lr-heading > p { max-width: 38em; font-size: 18px; color: var(--prp-body); }
.lr-example { scroll-margin-top: 24px; }
.lr-demo-note { padding: 16px 22px; background: var(--pil-cobalt-soft); font-size: 13px; border-bottom: var(--pil-line) solid var(--pil-ink); }
.lr-stages { display: flex; flex-wrap: wrap; gap: 8px; padding: 20px 22px 12px; }
.lr-stages button { min-height: 44px; padding: 9px 16px; border: 2px solid var(--pil-ink); border-radius: 99px; background: var(--pil-paper); color: var(--pil-ink); font: 500 14px var(--prp-sans); cursor: pointer; }
.lr-stages button[aria-pressed="true"] { background: var(--pil-yellow); box-shadow: 2px 2px 0 var(--pil-ink); }
.lr-stages button:disabled { cursor: default; }
.lr-announcement { margin: 0; padding: 0 24px 18px; font-size: 14px; color: var(--pil-cobalt); }
.lr-notebook { display: grid; grid-template-columns: 1.35fr 1fr; border-top: var(--pil-line) solid var(--pil-ink); }
.lr-question { grid-column: 1/-1; padding: 24px; border-bottom: 1px solid var(--prp-strong); }
.lr-label { font: 12px/1.5 var(--prp-mono); color: var(--pil-cobalt); }
.lr-question h3 { margin-top: 8px; font-size: clamp(28px, 3vw, 38px); line-height: 1.15; }
.lr-question p { margin: 10px 0 0; }
.lr-findings { padding: 8px 24px 24px; }
.lr-findings section { margin-top: 20px; }
.lr-example h4 { font-size: 14px; margin: 0 0 8px; }
.lr-example p { overflow-wrap: anywhere; }
.lr-findings p { margin: 0; }
.lr-hypothesis { padding: 18px; margin-inline: -4px; background: var(--pil-yellow-soft); border: 1px solid var(--prp-strong); border-radius: 16px; }
.lr-earlier { border-left: 3px solid var(--pil-cobalt); padding-left: 14px; }
.lr-earlier .lr-small { margin-top: 8px; }
.lr-sources { min-width: 0; border-left: 1px solid var(--prp-strong); padding: 28px 24px; background: var(--prp-bg); }
.lr-small { font-size: 12px; color: var(--prp-muted); }
.lr-sources details { border-top: 1px solid var(--prp-strong); padding-block: 14px; }
.lr-sources summary { cursor: pointer; font-weight: 500; min-height: 32px; }
.lr-sources details p { margin: 8px 0 0; font-size: 14px; }
.lr-sources details .lr-small { font-size: 12px; }
.lr-carry { grid-column: 1/-1; padding: 20px 24px; background: var(--pil-green-soft); border-top: var(--pil-line) solid var(--pil-ink); }
.lr-carry p { margin: 6px 0 0; }
.lr-split { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; border-top: 1px solid var(--prp-strong); padding-top: 48px; }
.lr-split p:first-child { margin-top: 0; }
.lr-cycle { background: var(--pil-cobalt-soft); }
.lr-cycle-steps { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 32px; margin: 40px 0 56px; }
.lr-cycle-steps li { border-top: 2px solid var(--pil-ink); padding-top: 18px; }
.lr-cycle h3 { font-size: 28px; line-height: 1.15; margin-top: 12px; }
.lr-dream { display: grid; grid-template-columns: 180px 1fr; gap: 32px; align-items: center; max-width: 850px; }
.lr-dream img { width: 180px; height: auto; }
.lr-end { text-align: center; }
.lr-end .pil-btn { margin-top: 16px; }
@media (max-width: 760px) {
  .living-research .lr-hero { grid-template-columns: 1fr; gap: 32px; }
  .lr-hero figure { max-width: 540px; margin-inline: auto; }
  .lr-notebook, .lr-split, .lr-cycle-steps { grid-template-columns: 1fr; }
  .lr-sources { border-left: 0; border-top: 1px solid var(--prp-strong); }
  .lr-split { gap: 24px; }
  .lr-dream { grid-template-columns: 1fr; gap: 8px; }
  .lr-dream img { width: 130px; }
  .lr-demo-note, .lr-question, .lr-findings, .lr-sources, .lr-carry { padding-inline: 18px; }
  .lr-stages { padding-inline: 18px; gap: 8px; }
  .lr-stages button { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) { .living-research { scroll-behavior: auto; } }

.lr-library-head { border-top: 1px solid var(--prp-strong); padding-top: 24px; }
.lr-library-head label { display: block; margin-top: 24px; font-weight: 500; }
.lr-library-head input { width: min(100%, 440px); min-height: 46px; padding: 10px 14px; margin-top: 8px; border: 2px solid var(--pil-ink); border-radius: 12px; background: var(--pil-paper); font: inherit; color: inherit; }
.lr-library-filters { padding: 8px 0 0; }
.lr-catalogue { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 24px; }
.lr-catalogue-card { min-width: 0; padding: 22px; background: var(--pil-paper); border: 1px solid var(--prp-strong); border-radius: 20px; }
.lr-catalogue-card[hidden] { display: none; }
.lr-catalogue-card .pil-chip { margin-bottom: 18px; }
.lr-catalogue-card h3 { font-size: 28px; line-height: 1.12; }
.lr-file-name { font: 12px/1.5 var(--prp-mono); color: var(--pil-cobalt); overflow-wrap: anywhere; }
.lr-catalogue-card details { margin: 20px 0; border-block: 1px solid var(--prp-strong); padding-block: 14px; font-size: 14px; }
.lr-catalogue-card summary { cursor: pointer; min-height: 32px; font-weight: 500; }
/* a finger needs 44 px: on a touch screen a clear layer makes the source links that tall, and they look the same */
@media (pointer: coarse) {
  :is(.lr-sources, .lr-catalogue-card) summary { position: relative; }
  :is(.lr-sources, .lr-catalogue-card) summary::after { content: ""; position: absolute; inset: 50% 0 auto; height: 44px; transform: translateY(-50%); }
}
.lr-catalogue-card .pil-btn { font-size: 13px; line-height: 1.3; cursor: pointer; }
.lr-catalogue-card .pil-btn:disabled { background: var(--pil-paper); box-shadow: none; cursor: default; }
.lr-library-boundary { max-width: 54em; margin-top: 28px; color: var(--prp-body); font-size: 14px; }
@media (max-width: 900px) { .lr-catalogue { grid-template-columns: 1fr; } }
