/* One mobile header contract for Home and every shared navigation page.
   Keep utilities inside the navigation layer so contrast and intro timing stay
   intact; fixed positioning removes them from the six-link row. */
@media(max-width:900px){
 html body:not(.page-project-detail){
  --mobile-header-safe-top:env(safe-area-inset-top,0px);
  --header-height:calc(108px + var(--mobile-header-safe-top));
 }
 html body:not(.page-project-detail) .site-header .brand{
  top:calc(20px + var(--mobile-header-safe-top))!important;
  left:50vw!important;right:auto!important;transform:translateX(-50%)!important;
  width:clamp(110px,calc(100vw - 224px),150px)!important;margin:0!important;
 }
 html body:not(.page-project-detail) .site-header .brand :is(svg,img){
  display:block;width:100%!important;height:auto!important;max-width:100%;
 }
 html body:not(.page-project-detail) #site-navigation{
  position:fixed!important;top:calc(56px + var(--mobile-header-safe-top))!important;
  left:max(16px,env(safe-area-inset-left,0px),calc((100vw - 600px)/2))!important;
  right:auto!important;
  display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));
  align-items:center;justify-content:stretch!important;gap:0!important;
  width:min(600px,calc(100vw - 32px))!important;max-width:none!important;height:44px!important;min-height:44px;
  padding:0!important;margin:0!important;flex-wrap:nowrap!important;overflow:visible;
 }
 html body:not(.page-project-detail) #site-navigation>a{
  display:flex!important;align-items:center;justify-content:center;justify-self:center;
  width:100%;max-width:92px;min-width:0;min-height:44px;box-sizing:border-box;
  padding:10px 2px!important;margin:0!important;white-space:nowrap;
  font:400 clamp(11px,3.1vw,13px)/1.3 var(--font-support)!important;
  letter-spacing:0!important;text-align:center;
 }
 html body:not(.page-project-detail) #site-navigation>.site-search,
 html body:not(.page-project-detail) #site-navigation>.theme-toggle{
  position:fixed!important;top:calc(8px + var(--mobile-header-safe-top))!important;
  left:auto!important;width:44px!important;height:44px!important;margin:0!important;
 }
 html body:not(.page-project-detail) #site-navigation>.theme-toggle{
  left:calc(100vw - max(16px,env(safe-area-inset-right,0px)) - 44px)!important;right:auto!important;padding:11px!important;
 }
 html body:not(.page-project-detail) #site-navigation>.site-search{
  left:calc(100vw - max(16px,env(safe-area-inset-right,0px)) - 88px)!important;right:auto!important;
 }
 html body:not(.page-project-detail) #site-navigation .site-search-toggle{
  width:44px!important;height:44px!important;padding:11px!important;margin:0!important;
 }
 html body:not(.page-project-detail) #site-navigation :is(.theme-toggle,.site-search-toggle) svg{
  width:22px;height:22px;display:block;
 }
 /* Accessible names remain available; touch controls do not need hover labels
    overlapping the row below them. */
 html body:not(.page-project-detail) #site-navigation [data-control-label]::after{display:none}
}