/* Lab uses the shared brand tokens and local fonts defined in styles.css. */
.lab-page { display: flex; flex-direction: column; min-height: 100svh; }
.lab-main { flex: 1; }
.lab-header nav { gap: clamp(1rem, 2.5vw, 2rem); }
.lab-header a[aria-current="page"] { font-weight: 600; text-decoration-thickness: 2px; }
.lab-intro { padding-block: 5rem var(--fd-space-16); }
.lab-intro h1 { margin-bottom: var(--fd-space-8); }
.lab-lead { max-width: 55ch; font-size: 1.25rem; line-height: 1.6; }
.lab-intro > p:last-child { max-width: var(--fd-reading-width); margin-bottom: 0; }
.lab-collection { padding-block: var(--fd-space-8) var(--fd-space-16); }
.lab-collection > h2 { margin-bottom: var(--fd-space-8); font-size: clamp(1.75rem, 3vw, 2rem); }
.lab-list { margin: 0; padding: 0; list-style: none; }
.lab-entry { padding-block: var(--fd-space-8); border-top: 1px solid var(--fd-rule); }
.lab-entry:last-child { border-bottom: 1px solid var(--fd-rule); }
.lab-entry-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin-bottom: var(--fd-space-4); color: var(--fd-muted); font-size: .875rem; line-height: 1.5; }
.lab-entry-meta > * { margin: 0; }
.lab-entry-title { max-width: 32ch; margin-block: 0 var(--fd-space-4); font-family: var(--fd-font-ui); font-size: clamp(1.5rem, 2.6vw, 2rem); font-weight: 500; line-height: 1.25; letter-spacing: -.025em; }
.lab-entry-title a { display: inline-block; padding-block: .25rem; }
.lab-entry-summary { max-width: var(--fd-reading-width); margin-bottom: var(--fd-space-4); }
.lab-entry-byline { margin: 0; color: var(--fd-muted); font-size: .9375rem; }
.lab-entry-byline a { display: inline-flex; min-height: 44px; align-items: center; }
.lab-empty { padding-block: var(--fd-space-8); border-block: 1px solid var(--fd-rule); }
.lab-empty :where(h3, p) { max-width: var(--fd-reading-width); }
.lab-empty h3 { margin-block: 0 var(--fd-space-4); color: var(--fd-heading); font-size: 1.25rem; font-weight: 500; line-height: 1.35; }
.lab-empty p:last-child { margin-bottom: 0; color: var(--fd-muted); }
.lab-contributors { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: var(--fd-space-8) var(--fd-space-16); padding-block: var(--fd-space-8) var(--fd-space-24); }
.lab-contributors h2 { margin-bottom: var(--fd-space-4); font-size: 1.25rem; line-height: 1.3; letter-spacing: -.015em; }
.lab-contributors p { margin: 0; max-width: 45ch; color: var(--fd-muted); font-size: .9375rem; }
.lab-contributor-links { display: flex; flex-wrap: wrap; gap: .5rem var(--fd-space-8); }
.lab-contributor-links :where(ul, p) { margin: 0; padding: 0; }
.lab-contributor-links ul { display: flex; flex-wrap: wrap; gap: .5rem var(--fd-space-8); list-style: none; }
.lab-contributor-links a { display: inline-flex; min-height: 44px; align-items: center; font-size: 1rem; font-weight: 500; }
.lab-piece { padding-block: var(--fd-space-8) var(--fd-space-24); }
.lab-back { display: inline-flex; min-height: 44px; align-items: center; font-size: .9375rem; font-weight: 500; }
.lab-piece-heading { max-width: 55rem; padding-block: var(--fd-space-12) var(--fd-space-12); }
.lab-kind { margin-bottom: var(--fd-space-6); color: var(--fd-copper); font-size: .9375rem; font-weight: 500; line-height: 1.5; }
.lab-piece-heading h1 { max-width: 23ch; }
.lab-piece-heading .lab-lead { margin-bottom: var(--fd-space-8); }
.lab-piece-meta { display: flex; flex-wrap: wrap; gap: .5rem var(--fd-space-8); color: var(--fd-muted); font-size: .9375rem; line-height: 1.5; }
.lab-piece-meta p { margin: 0; }
.lab-byline a { display: inline-flex; min-height: 44px; align-items: center; }
.lab-dates { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; }
.lab-dates time { white-space: normal; }
.lab-piece-body { max-width: var(--fd-reading-width); }
.lab-section { padding-top: var(--fd-space-12); }
.lab-section:first-child { padding-top: var(--fd-space-8); border-top: 1px solid var(--fd-rule); }
.lab-section h2 { margin-bottom: var(--fd-space-6); font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.25; }
.lab-section :where(p, ul, ol, figure, pre) { margin-block: 0 var(--fd-space-6); }
.lab-section :where(ul, ol) { padding-left: 1.4em; }
.lab-section li + li { margin-top: .75rem; }
.lab-section :where(p, li, a, code) { overflow-wrap: anywhere; }
.lab-section > :last-child { margin-bottom: 0; }
.lab-section pre { overflow-x: auto; padding: var(--fd-space-6); border-radius: var(--fd-radius); background: var(--fd-sage); color: var(--fd-forest); font-size: .9375rem; line-height: 1.6; }
.lab-section pre code { overflow-wrap: normal; }
.lab-figure { margin-inline: 0; }
.lab-figure img { display: block; max-width: 100%; height: auto; border-radius: var(--fd-radius); }
.lab-figure figcaption { margin-top: var(--fd-space-3); color: var(--fd-muted); font-size: .875rem; line-height: 1.6; }
.lab-resources a { display: inline-block; min-height: 44px; padding-block: .5rem; }
.lab-code { margin: var(--fd-space-8) 0; }
.lab-code figcaption { margin-bottom: var(--fd-space-3); color: var(--fd-muted); font-size: .875rem; }
.lab-code pre { max-width: 100%; overflow-x: auto; padding: var(--fd-space-6); border-radius: var(--fd-radius); background: var(--fd-sage); color: var(--fd-forest); font-size: .9375rem; line-height: 1.6; }
.lab-empty > a { display: inline-flex; align-items: center; min-height: 44px; }
.lab-piece-footer { max-width: var(--fd-reading-width); margin-top: var(--fd-space-16); padding-top: var(--fd-space-8); border-top: 1px solid var(--fd-rule); }

@media (max-width: 580px) {
  .lab-intro { padding-block: var(--fd-space-12) var(--fd-space-12); }
  .lab-intro h1 { margin-bottom: var(--fd-space-6); }
  .lab-lead { font-size: 1.125rem; }
  .lab-collection { padding-block: var(--fd-space-6) var(--fd-space-12); }
  .lab-collection > h2 { margin-bottom: var(--fd-space-6); }
  .lab-entry { padding-block: var(--fd-space-6); }
  .lab-contributors { display: block; padding-block: var(--fd-space-6) var(--fd-space-16); }
  .lab-contributor-links { margin-top: var(--fd-space-6); }
  .lab-piece { padding-block: var(--fd-space-4) var(--fd-space-16); }
  .lab-piece-heading { padding-block: var(--fd-space-8) var(--fd-space-8); }
  .lab-kind { margin-bottom: var(--fd-space-4); }
  .lab-piece-heading h1 { margin-bottom: var(--fd-space-6); }
  .lab-piece-heading .lab-lead { margin-bottom: var(--fd-space-6); }
  .lab-piece-meta { display: block; }
  .lab-dates { margin-top: .25rem; }
  .lab-section { padding-top: var(--fd-space-8); }
  .lab-section pre { padding: var(--fd-space-4); }
  .lab-piece-footer { margin-top: var(--fd-space-12); }
}