/* Knowledge pages only (week 1 hub, sludge article and later knowledge pages). Loaded after style.css on pages built
   from the knowledge templates, so the main stylesheet stays unchanged. Sections carry the class "kn". */
.kn.sec{padding-block:clamp(32px,4.5vw,56px)}
.sec.kn+.sec.kn{padding-top:0}
/* one centred reading column, wide elements in a centred 1080 px container on the same centre line */
.kn .prose{max-width:1080px;margin-inline:auto}
.kn .prose>*,.kn .sec-head,.kn .faq{max-width:720px;margin-inline:auto}
.kn .prose>.tbl,.kn .prose>.kd,.kn .prose>.result,.kn .kgrid,.kn .ksplit{max-width:1080px;margin-inline:auto}
.kn .prose li{max-width:none}
.kn .prose h2:first-child{margin-top:0}
/* text beside an image: the whole row is the wide container, 58/42, top-aligned */
.kn .ksplit{display:grid;gap:clamp(24px,4vw,48px);align-items:start}
.kn .ksplit .prose{max-width:none;margin:0}.kn .ksplit .prose>*{max-width:none}
@media (min-width:960px){.kn .ksplit{grid-template-columns:58fr 42fr}}
/* tables */
.kn .tbl{overflow:visible}
.kn table{table-layout:fixed;font-size:15px}
.kn th,.kn td{padding:12px 16px}
.kn thead th{white-space:normal}
.kn thead th:first-child{width:22%}
.kn caption.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media (max-width:767px){
.kn .tbl{border:0;background:none}
.kn table,.kn tbody,.kn tr,.kn th,.kn td{display:block;width:auto!important}
.kn thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.kn caption:not(.vh){display:block;padding:0 0 10px;border:0}
.kn tbody tr{background:var(--surface);border-radius:var(--r);padding:14px 16px;margin-bottom:12px}
.kn tbody th{padding:0 0 6px;border:0;font-size:1rem}
.kn tbody td{padding:4px 0;border:0;text-align:left}
.kn tbody td[data-label]::before{content:attr(data-label) ": ";font-weight:700}
}
/* diagrams: wide drawing from 1024 px, vertical drawing below; caption on the drawing's left edge */
.kn .kd{margin:0 auto 1.5rem}
.kn .kd svg{display:block;width:100%;height:auto}
.kn .kd .dg-wide{display:none}
.kn .kd figcaption{text-align:left;margin-top:10px}
@media (max-width:1023px){.kn .kd{max-width:420px!important}}
@media (min-width:1024px){.kn .kd .dg-wide{display:block}.kn .kd .dg-narrow{display:none}}
/* short-answer box and result box (moved out of inline styles) */
.answer{background:var(--tint);border-radius:var(--r);padding:18px 22px;margin:0 0 1.6rem}
.answer p{margin:0}
.kn .result{background:var(--tint);border-radius:var(--r);padding:clamp(18px,3vw,28px);margin:0 auto 1.5rem}
.kn .result>p{max-width:720px}.kn .result>p:last-child{margin-bottom:0}
.kn .result .tbl{margin:0 0 1rem}
/* result cards: left-aligned, equal height, heading reserves two lines, link pinned to the bottom */
.kn .kgrid{display:grid;gap:clamp(16px,2.4vw,24px)}
@media (min-width:768px){.kn .kgrid{grid-template-columns:1fr 1fr}}
.kn .kcard{display:flex;flex-direction:column;background:var(--tint);border-radius:var(--r);padding:22px 24px;text-align:left}
.kn .kcard h3{min-height:2.6em;margin:0 0 .5em;text-align:left}
.kn .kcard p{text-align:left;margin:0 0 .8em}
.kn .kcard .klink{margin-top:auto;margin-bottom:0;padding-top:6px}
/* reviewer profile pages */
.kp-head{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.kp-head img{width:144px;height:144px;border-radius:50%;object-fit:cover}
.srcs{margin:24px 0 16px;border-top:1px solid var(--border)}
.srcs>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;min-height:44px;padding-top:4px;font:400 14px/1.5 var(--head);color:var(--muted)}
.srcs>summary::-webkit-details-marker{display:none}
.srcs>summary::after{content:"";width:6px;height:6px;margin-top:-3px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg);transition:transform .2s}
.srcs[open]>summary::after{margin-top:3px;transform:rotate(-135deg)}
.srcs .sources{max-width:720px;margin:4px 0 0;font-size:14px;line-height:1.5;color:var(--muted)}
.srcs .sources li{margin-bottom:6px}
.sec.srcs-sec{padding-block:0 16px}
@media (prefers-reduced-motion:reduce){.srcs>summary::after{transition:none}}
