/* Resource pages: a consistent rhythm between panels without changing their order. */
body.detail-page .wrap:has(>.columns){--resource-space:24px;--resource-space-small:12px}
body.detail-page .wrap:has(>.columns)>.breadcrumb{margin-bottom:var(--resource-space)}
body.detail-page .wrap:has(>.columns)>.project-top{margin-bottom:var(--resource-space)}
body.detail-page .columns{gap:var(--resource-space);align-items:start}
body.detail-page .columns>.primary{min-width:0}
body.detail-page .columns>.side{gap:var(--resource-space)}
body.detail-page .columns>.side>.card{margin:0;padding:24px}
body.detail-page .columns>.primary>.resource-header-topics{margin:0 0 var(--resource-space-small);gap:8px}
body.detail-page .columns>.primary>.gallery{margin:0 0 var(--resource-space)}
body.detail-page .columns .gallery-caption{margin:var(--resource-space-small) 0 0;gap:12px;align-items:center;min-height:18px}
body.detail-page .columns>.primary>.tabs{margin:0 0 var(--resource-space)}
body.detail-page .columns>.primary>.card,
body.detail-page .columns>.primary>#overview>.card{margin:0 0 var(--resource-space)}
body.detail-page .columns .card>.section-title{margin-top:0;margin-bottom:20px}
body.detail-page .columns .card>:last-child{margin-bottom:0}
body.detail-page .columns .facts>div:last-child{border-bottom:0;padding-bottom:0}
body.detail-page .columns #support .author{margin-bottom:16px}
body.detail-page .columns>.primary>:last-child{margin-bottom:0}
@media(min-width:801px){body.detail-page .columns>.primary>#overview{display:none}}
@media(max-width:800px){
 body.detail-page .wrap:has(>.columns){--resource-space:20px;--resource-space-small:12px}
 body.detail-page .columns .gallery-caption{align-items:flex-start;flex-wrap:wrap;gap:8px}
 body.detail-page .columns>.primary>.card,body.detail-page .columns>.primary>#overview>.card{padding:20px}
 body.detail-page .columns .card>.section-title{margin-bottom:16px}
}
/* Keep the breadcrumb close to the header and the resource identity below it. */
body.detail-page .wrap:has(>.columns){padding-top:16px}
body.detail-page .wrap:has(>.columns)>.breadcrumb{margin:0 0 16px;min-height:20px;line-height:20px}
body.detail-page .wrap:has(>.columns)>.project-top{margin-top:0}
body.detail-page .wrap:has(>.columns)>.project-top h1{margin-top:0}
@media(max-width:800px){
 body.detail-page .wrap:has(>.columns){padding-top:12px}
 body.detail-page .wrap:has(>.columns)>.breadcrumb{margin-bottom:12px}
}
body.detail-page .wrap:has(>.columns){margin-top:0}
body.detail-page:has(.columns)>.site-header{margin-bottom:0}
