.fit-picture{
    max-width:100px;
    max-height:auto;
}


/*基础设置：字体，背景，颜色*/
body{
    margin:0;
    /*保证字体在各种设备上都可以显示出来，默认各个设备系统default字体*/
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    color:#1f2937;
    background:#606add;
    line-height:1.6;
    }
    a{ color:#2563eb; text-decoration:none; }
    a:hover{ 
        text-decoration:underline; 
    }
    .container{ 
        max-width: 960px; margin: 0 auto; padding: 24px; 
    }
    .row{ 
        display:flex; gap:14px; flex-wrap:wrap; 
    }
    .card{
        background:#fff; border-radius:14px;
        box-shadow: 0 10px 25px rgba(0,0,0,.06);
        padding:18px;
    }
    main{ 
        padding:24px 0 40px;
    }
    section{
        margin-bottom:28px;
    }
    h1,h2,h3{
        margin:0 0 10px;
    }
    h1{
        font-size:22px;
    } 
    h2{
        font-size:20px;
    }
    h3{
        font-size:17px;
    }
    .muted{
        color:#6b7280;
    }
    header{
    background:#fff;
    box-shadow: 0 10px 25px rgba(0,0,0,.06);
    position: sticky; top:0; z-index:10;
    }
    .nav{
        display:flex; gap:19px; flex-wrap:wrap; align-items:center; 
    }
    .nav a{
        color:#1f2937; padding:8px 10px; border-radius:10px;
    }
    /**/
    .nav a[aria-current="page"], .nav a:hover{
    background:#eef2ff; color:#1e40af; text-decoration:none;
    }

    @media (max-width: 720px){
    .row{ flex-direction: column; }
    }
    /*给project上下间距加*/
    .projects-list {
        display: flex;
        flex-direction: column; /* 竖着排 */
        gap: 16px;              /* 自动给子元素之间加间距 */
    }