/* jcamd responsive patch — mobile-first polish 2026-07-10
 * Loads after site.css. Adds safe-area insets and 44px touch targets.
 * Solo personal project, no connection to employer, built with public/free-tier only.
 */
:root{
  --page-gutter: clamp(12px, 4vw, 20px);
  --touch-min: 44px;
}
img{max-width:100%;height:auto;}
.site-header__inner{
  padding-left: max(20px, env(safe-area-inset-left));
  padding-right: max(20px, env(safe-area-inset-right));
}
.nav-toggle{
  min-height:44px;
  min-width:44px;
}
.site-nav a{
  min-height:44px;
  display:flex;
  align-items:center;
}
@media (max-width:820px){
  .site-nav{
    padding-left: max(20px, env(safe-area-inset-left));
    padding-right: max(20px, env(safe-area-inset-right));
    padding-bottom: max(16px, env(safe-area-inset-bottom));
  }
  .site-nav.is-open{
    gap:4px;
  }
}
main{
  padding-left: max(20px, env(safe-area-inset-left));
  padding-right: max(20px, env(safe-area-inset-right));
  padding-bottom: max(80px, env(safe-area-inset-bottom));
}
.lab-featured-grid{
  display:grid;
  gap:12px;
  grid-template-columns:1fr;
  margin-bottom:12px;
}
@media (min-width:640px){
  .lab-featured-grid{grid-template-columns:1fr 1fr;}
}
@media (min-width:1000px){
  .lab-featured-grid{grid-template-columns:1fr 1fr 1fr;}
}
.repo-card h3{
  overflow-wrap:anywhere;
}
.btn{
  min-height:44px;
}