.work-category{
    margin: 1rem 0;
    font-weight: bold;
    font-style: italic;
    color: gray;
}

.works-list{
    margin-left: 0.5rem;
    margin-bottom: 1rem;
}

.works-item{
    margin-bottom: 1.5rem;
}

.works-item-name{
    font-weight: bold;
}
.works-item-name img{
    vertical-align: middle;
}

.works-item-desc{
    margin-top: 0.5rem;
}

.paper-authors{
    font-size: small;
    font-style: italic;
}

.pub-name{
    font-size: small;
}

.css-badge {
    display: inline-flex;
    border-radius: 4px;
    overflow: hidden;
    font-family: "DejaVu Sans", Verdana, Geneva, sans-serif;
    font-size: 11px;
    font-weight: normal;
    color: white;
    height: 20px;
    line-height: 20px;
    text-shadow: 0 1px 0 rgba(0,0,0,0.1);
    text-decoration: none; 
    vertical-align: middle;
}

.css-badge:hover{
    color: white;
}

.css-badge span{
    padding: 0 8px 0 8px;
}

/* Badge 的左侧部分 */
.badge-gray {
    background-color: #555; /* 左侧的深灰色背景 */
}
/* Badge 的右侧部分 */
.badge-green {
    background-color: #97CA00; /* 右侧的绿色背景 (shields.io 的 'green' 颜色) */
}

.badge-cpp {
    background-color: #f34b7d;
}

.badge-c {
    background-color: #555555;
}

.badge-scala {
    background-color: #c22d40;
}

.badge-verilog{
    background-color: #b2b7f8;
}

.badge-js{
    background-color: #f1e05a;
    color: black;
}

.work-gallery{
    display: flex;
    flex-wrap: nowrap;
    column-gap: 1rem;
    height: 8.5rem;
    overflow-x: auto;
    overflow-y: hidden;
}

.work-gallery a{
    flex-shrink: 0;
}

.work-gallery img{
    height: 8rem;
}

.work-year{
    float: right;
    color: gray;
    font-size: small;
}

.works-item-badges{
    margin-top: 0.5rem;
}

.works-item-badges img{
    vertical-align: middle;
}