/* 按照参考网站的样式 */
.content {
    width: 100% !important;
    padding: 25px !important;
    margin: 0 0 30px 0 !important;
    background: #fff !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.1) !important;
}

.article-extend {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 清除浮动 */
.article-extend::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

/* 应用图标 */
.favicon {
    float: left !important;
    width: 140px !important;
    height: 140px !important;
    margin-right: 20px !important;
    margin-bottom: 20px !important;
}

.favicon img {
    width: 140px !important;
    height: 140px !important;
    border-radius: 20px !important;
}

/* 应用信息区 */
.article-extend-app {
    overflow: hidden !important;
    position: relative !important;
    min-height: 140px !important;
}

.article-extend-app h1 {
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #333 !important;
    margin: 0 0 15px 0 !important;
    line-height: 1.3 !important;
}

.article-extend-app p {
    color: #666 !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
    margin: 0 0 15px 0 !important;
}

/* 标签 */
.appattr {
    display: flex !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.appattr span {
    display: inline-block !important;
    padding: 4px 12px !important;
    background: #fff !important;
    color: #42b983 !important;
    border: 1px solid #42b983 !important;
    border-radius: 4px !important;
    font-size: 13px !important;
}

/* 详细信息区 */
.article-extend-info {
    clear: both !important;
    margin-top: 20px !important;
}

.app-info {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

.app-info::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

.app-info > div {
    float: left !important;
    width: 50% !important;
    padding: 8px 0 !important;
    color: #666 !important;
    font-size: 15px !important;
}

.app-info > div span {
    color: #333 !important;
}

.app-info > div img {
    width: 18px !important;
    height: 18px !important;
    vertical-align: middle !important;
    margin-right: 5px !important;
}

.app-info > div a {
    color: #1890ff !important;
    text-decoration: none !important;
}

.app-info > div a:hover {
    text-decoration: underline !important;
}

/* 响应式 */
@media (max-width: 768px) {
    .favicon {
        float: none !important;
        margin: 0 auto 20px !important;
        width: 120px !important;
        height: 120px !important;
    }
    
    .favicon img {
        width: 120px !important;
        height: 120px !important;
        border-radius: 16px !important;
    }
    
    .article-extend-app h1 {
        font-size: 22px !important;
    }
    
    .app-info > div {
        width: 100% !important;
        float: none !important;
    }
}
