*{box-sizing:border-box;margin:0;padding:0}
body{background:#f6f7f9;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;color:#333;line-height:1.6}
a{text-decoration:none}
ul{list-style:none}

/* 头部 */
.header{background:#165DFF;color:#fff;box-shadow:0 2px 12px rgba(0,0,0,0.08)}
.header-container{max-width:1280px;margin:0 auto;padding:16px 20px}
.header-top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.logo{font-size:24px;font-weight:bold}
.search-wrap{flex:1;min-width:280px}
.search-form{display:flex}
.search-form input{width:100%;padding:10px 14px;border:none;border-radius:8px 0 0 8px;font-size:14px;outline:none}
.search-form button{padding:0 20px;background:#0E4BDB;color:#fff;border:none;border-radius:0 8px 8px 0;cursor:pointer;font-size:14px}

.nav{margin-top:14px;display:flex;gap:6px;flex-wrap:wrap}
.nav a{color:rgba(255,255,255,0.92);padding:8px 16px;border-radius:6px;transition:0.2s}
.nav a:hover{background:rgba(255,255,255,0.15)}

/* 主体容器 */
.container{max-width:1280px;margin:30px auto;padding:0 20px;display:grid;grid-template-columns:1fr 300px;gap:30px}
@media (max-width:992px){
    .container{grid-template-columns:1fr}
}

.main{}
.sidebar{}

/* 筛选排序栏 */
.filter-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:12px}
.title-bar h2{font-size:20px;font-weight:600}
.sort-group{display:flex;gap:10px}
.sort-group a{padding:7px 18px;border-radius:6px;border:1px solid #165DFF;color:#165DFF;font-size:14px;transition:0.2s}
.sort-group a.active{background:#165DFF;color:#fff}

/* 版块标题 */
.section-header{
    display:flex;
    align-items:baseline;
    gap:12px;
    margin:36px 0 18px;
    padding-bottom:12px;
    border-bottom:2px solid #165DFF;
}
.section-header:first-child{margin-top:0}
.section-title{font-size:20px;font-weight:700;color:#1a1a1a}
.section-desc{font-size:13px;color:#999}

/* 图标放在 H 标签外时的样式 */
.section-icon{
    font-size:20px;
    line-height:1;
    display:inline-block;
    margin-right:6px;
}

/* APP横向列表（最新更新） */
.app-list{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:2px;
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 2px 14px rgba(0,0,0,0.06);
}
.app-list-item{
    display:flex;
    align-items:center;
    gap:16px;
    padding:14px 20px;
    text-decoration:none;
    transition:background 0.15s;
    border-bottom:1px solid #f4f4f4;
}
.app-list-item:nth-child(odd){border-right:1px solid #f4f4f4}
.app-list-item:last-child{border-bottom:none}
.app-list-item:hover{background:#f8faff}
.list-thumb{
    width:56px;
    height:56px;
    flex-shrink:0;
    border-radius:12px;
    overflow:hidden;
    background:#f0f2f5;
    box-shadow:0 2px 6px rgba(0,0,0,0.06);
}
.list-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.list-thumb .no-thumb{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
    color:#aaa;
    background:#e8eaef;
}
.list-info{
    flex:1;
    min-width:0;
}
.list-title{
    font-size:15px;
    font-weight:600;
    color:#1a1a1a;
    margin-bottom:4px;
    transition:color 0.2s;
}
.app-list-item:hover .list-title{color:#165DFF}
.list-meta{
    font-size:12px;
    color:#888;
    display:flex;
    gap:12px;
    flex-wrap:wrap;
}

/* 热门文章侧边栏列表 */
.widget-empty{padding:20px 0;text-align:center;color:#999;font-size:13px}
.hot-post-list{display:flex;flex-direction:column}
.hot-post-item{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 0;
    text-decoration:none;
    border-bottom:1px solid #f4f4f4;
    transition:0.15s;
}
.hot-post-item:last-child{border-bottom:none}
.hot-post-item:hover{background:#fafbfc;margin:0 -12px;padding-left:12px;padding-right:12px;border-radius:6px}
.hot-post-rank{
    width:26px;height:26px;
    flex-shrink:0;
    border-radius:4px;
    text-align:center;
    line-height:26px;
    font-size:13px;font-weight:600;
    background:#e8e8e8;color:#666;
}
.hot-post-rank.top{background:linear-gradient(135deg,#f53f3f,#e02e2e);color:#fff}
.hot-post-title{
    flex:1;min-width:0;
    font-size:14px;color:#222;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    line-height:1.4;
}
.hot-post-item:hover .hot-post-title{color:#165DFF}
.hot-post-views{
    flex-shrink:0;
    font-size:11px;color:#aaa;
}

/* 首页最新文章 */
.home-post-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.home-post-card{
    display:flex;gap:14px;align-items:flex-start;
    background:#fff;border-radius:10px;padding:16px;
    text-decoration:none;color:inherit;
    box-shadow:0 1px 6px rgba(0,0,0,0.04);
    transition:0.2s;
}
.home-post-card:hover{box-shadow:0 3px 12px rgba(0,0,0,0.1);transform:translateY(-2px)}
.home-post-thumb{
    width:70px;height:70px;flex-shrink:0;
    border-radius:8px;overflow:hidden;background:#f0f2f5;
    display:flex;align-items:center;justify-content:center;
}
.home-post-thumb img{width:100%;height:100%;object-fit:cover}
.home-post-noimg{font-size:28px;color:#ccc}
.home-post-body{flex:1;min-width:0}
.home-post-title{
    font-size:15px;font-weight:600;color:#1a1a1a;
    margin-bottom:6px;line-height:1.4;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;
}
.home-post-card:hover .home-post-title{color:#165DFF}
.home-post-summary{
    font-size:12px;color:#888;line-height:1.5;margin-bottom:6px;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;
}
.home-post-meta{font-size:11px;color:#bbb}
@media(max-width:768px){
    .home-post-grid{grid-template-columns:1fr}
}

/* APP卡片列表 */
.app-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}
a.app-card, .app-card{display:block;color:inherit;text-decoration:none}
.app-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 14px rgba(0,0,0,0.06);transition:transform 0.2s,box-shadow 0.2s}
.app-card:hover{transform:translateY(-4px);box-shadow:0 6px 20px rgba(0,0,0,0.1)}
.card-img{height:160px;background:#f0f2f5;display:flex;align-items:center;justify-content:center;overflow:hidden}
.card-img img{width:80px;height:80px;object-fit:cover;border-radius:14px;box-shadow:0 2px 8px rgba(0,0,0,0.08)}
.card-img .no-pic{width:80px;height:80px;display:flex;align-items:center;justify-content:center;border-radius:14px;background:#e0e3e8;color:#999;font-size:12px}
.card-body{padding:16px}
.card-title{font-size:16px;font-weight:600;margin-bottom:8px}
.card-title a{color:#222}
.card-meta{font-size:13px;color:#666;line-height:1.7}
.card-meta span{display:inline-block;margin-right:10px}

/* 分页 */
.pagination{margin-top:40px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pagination a,.pagination span{padding:7px 14px;border-radius:6px;font-size:14px}
.pagination a{border:1px solid #dde0e6;color:#333}
.pagination span{background:#165DFF;color:#fff;border:1px solid #165DFF}

/* 侧边栏 */
.widget{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 14px rgba(0,0,0,0.06)}
.widget-title{font-size:16px;font-weight:600;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid #eee}

/* 热门条目样式 */
.hot-item{
    display:flex;
    align-items:center;
    padding:10px 0;
    border-bottom:1px solid #f4f4f4;
    gap:10px;
}
.hot-item:last-child{border:none}
.hot-num{
    width:26px;
    height:26px;
    border-radius:4px;
    text-align:center;
    line-height:26px;
    font-size:13px;
    background:#e8e8e8;
    color:#666;
    flex-shrink:0;
}
.hot-num.top{background:#f53f3f;color:#fff}
.hot-thumb{
    width:44px;
    height:44px;
    flex-shrink:0;
    border-radius:6px;
    overflow:hidden;
    background:#eeeeee;
}
.hot-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.hot-info{
    flex:1;
    min-width:0;
}
.hot-name a{
    color:#222;
    font-size:14px;
    display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.hot-count{
    font-size:12px;
    color:#888;
    margin-top:2px;
}

.empty-tip{padding:60px 0;text-align:center;color:#999;font-size:15px}

/* ========== 详情页样式 ========== */

/* 面包屑 */
.breadcrumb{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin-bottom:20px;
    padding:10px 16px;
    background:#fff;
    border-radius:8px;
    box-shadow:0 1px 6px rgba(0,0,0,0.04);
    font-size:14px;
}
.breadcrumb a{color:#165DFF;transition:0.2s}
.breadcrumb a:hover{color:#0E4BDB;text-decoration:underline}
.breadcrumb .sep{color:#bbb;font-size:16px;line-height:1}
.breadcrumb .current{color:#666}

/* 详情头部卡片 */
.detail-card{
    display:grid;
    grid-template-columns:1fr 280px;
    gap:30px;
    background:#fff;
    border-radius:12px;
    padding:28px;
    box-shadow:0 2px 14px rgba(0,0,0,0.06);
    margin-bottom:24px;
}

/* 左侧信息区 */
.detail-info{
    display:flex;
    gap:20px;
    align-items:flex-start;
}
.detail-thumb{
    width:80px;
    height:80px;
    flex-shrink:0;
    border-radius:14px;
    overflow:hidden;
    background:#f0f2f5;
    box-shadow:0 2px 8px rgba(0,0,0,0.08);
}
.detail-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.detail-head{
    flex:1;
    min-width:0;
}
.detail-title{
    font-size:22px;
    font-weight:700;
    color:#1a1a1a;
    margin-bottom:16px;
    line-height:1.4;
}
.detail-meta{
    display:flex;
    flex-direction:column;
    gap:10px;
}
.meta-item{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:14px;
    color:#555;
}
.meta-item a{color:#165DFF;transition:0.2s}
.meta-item a:hover{text-decoration:underline}
.meta-item strong{color:#333}
.meta-icon{font-size:16px;flex-shrink:0}

/* 右侧下载区 */
.detail-download{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:20px;
    background:#fafbfc;
    border-radius:10px;
    border:1px solid #eef0f4;
    text-align:center;
    align-self:start;
}
.qr-wrap{
    margin-bottom:20px;
}
.qr-wrap img{
    width:180px;
    height:180px;
    border-radius:8px;
    border:1px solid #e5e7eb;
    background:#fff;
    padding:4px;
}
.qr-tip{
    margin-top:8px;
    font-size:13px;
    color:#888;
}
.download-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100%;
    max-width:220px;
    padding:14px 32px;
    background:linear-gradient(135deg,#165DFF,#0E4BDB);
    color:#fff;
    font-size:17px;
    font-weight:600;
    border-radius:10px;
    text-decoration:none;
    transition:all 0.25s;
    box-shadow:0 4px 14px rgba(22,93,255,0.35);
    letter-spacing:0.5px;
}
.download-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 6px 20px rgba(22,93,255,0.45);
    background:linear-gradient(135deg,#4080FF,#165DFF);
}
.download-btn:active{transform:translateY(0)}
.btn-icon{font-size:18px}
.btn-text{}
.download-safe{
    margin-top:14px;
    font-size:12px;
    color:#999;
}

/* 详情页任务信息（嵌在 detail-head 内） */
.detail-task{
    margin-top:16px;
    padding-top:14px;
    border-top:1px dashed #e5e7eb;
    display:flex;
    flex-direction:column;
    gap:8px;
}
.task-row{
    display:flex;
    align-items:flex-start;
    gap:6px;
    flex-wrap:wrap;
}
.task-label{
    font-size:13px;
    color:#888;
    flex-shrink:0;
    line-height:1.9;
}
.task-value{
    font-size:14px;
    font-weight:600;
    color:#E67E22;
    line-height:1.9;
}
.task-tags{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    align-items:center;
}
.task-tag{
    display:inline-block;
    padding:3px 12px;
    border-radius:20px;
    color:#fff;
    font-size:12px;
    font-weight:500;
    line-height:1.6;
    white-space:nowrap;
}

/* 应用介绍内容卡片 */
.content-card{
    background:#fff;
    border-radius:12px;
    padding:28px;
    box-shadow:0 2px 14px rgba(0,0,0,0.06);
    margin-bottom:24px;
}
.content-title{
    font-size:18px;
    font-weight:600;
    color:#1a1a1a;
    margin-bottom:20px;
    padding-bottom:14px;
    border-bottom:2px solid #165DFF;
}

/* 富文本内容排版 */
.content{
    font-size:15px;
    line-height:1.85;
    color:#444;
    word-wrap:break-word;
    overflow-wrap:break-word;
}
.content h1,.content h2,.content h3,.content h4{
    color:#1a1a1a;
    margin:1.2em 0 0.6em;
    line-height:1.4;
}
.content h1{font-size:20px;font-weight:700}
.content h2{font-size:18px;font-weight:600}
.content h3{font-size:16px;font-weight:600}
.content h4{font-size:15px;font-weight:600}
.content h1:first-child,
.content h2:first-child,
.content h3:first-child,
.content h4:first-child{margin-top:0}

.content p:last-child{margin-bottom:0}
.content ul,.content ol{
    margin:0.8em 0;
    padding-left:1.5em;
}
.content li{margin-bottom:0.4em}
.content img{
    max-width:100%;
    height:auto;
    border-radius:8px;
    margin:12px 0;
    display:block;
}
.content a{color:#165DFF;text-decoration:underline}
.content a:hover{color:#0E4BDB}
.content blockquote{
    margin:1em 0;
    padding:12px 20px;
    border-left:4px solid #165DFF;
    background:#f6f8fc;
    border-radius:0 8px 8px 0;
    color:#555;
}
.content code{
    background:#f0f2f5;
    padding:2px 8px;
    border-radius:4px;
    font-size:13px;
    font-family:"SF Mono",Monaco,"Cascadia Code",Consolas,monospace;
    color:#d63384;
}
.content pre{
    background:#1e1e1e;
    color:#d4d4d4;
    padding:16px 20px;
    border-radius:8px;
    overflow-x:auto;
    margin:1em 0;
    font-size:13px;
    line-height:1.6;
}
.content pre code{
    background:none;
    padding:0;
    color:inherit;
    font-size:inherit;
}
.content table{
    width:100%;
    border-collapse:collapse;
    margin:1em 0;
    font-size:14px;
}
.content table th,
.content table td{
    padding:10px 14px;
    border:1px solid #e5e7eb;
    text-align:left;
}
.content table th{
    background:#f6f8fc;
    font-weight:600;
    color:#333;
}
.content table tr:nth-child(even){background:#fafbfc}
.content hr{
    border:none;
    border-top:1px solid #e5e7eb;
    margin:1.5em 0;
}
.content strong{color:#222;font-weight:600}

/* 详情页响应式 */
.post-list{display:grid;gap:20px}
.post-card{display:grid;grid-template-columns:180px 1fr;gap:20px;background:linear-gradient(135deg,#ffffff 0%,#f9fbff 100%);border:1px solid #e7ecf3;border-radius:18px;padding:18px;box-shadow:0 10px 30px rgba(22,93,255,0.06);transition:transform .2s ease, box-shadow .2s ease}
.post-card:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(22,93,255,0.12)}
.post-cover{display:flex;align-items:center;justify-content:center;min-height:120px;background:linear-gradient(135deg,#eef4ff,#f8fbff);border-radius:14px;overflow:hidden;border:1px solid #e7ecf3;position:relative}
.post-cover img{width:100%;height:100%;object-fit:cover;display:block}
.post-cover .cover-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#7a8aa0;font-size:13px;gap:8px}
.post-cover .cover-placeholder small{font-size:12px;opacity:.9}
.post-body{display:flex;flex-direction:column;justify-content:center;min-width:0}
.post-topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.post-badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;background:#ecf4ff;color:#165DFF;font-size:12px;font-weight:700;letter-spacing:.02em}
.post-date{font-size:12px;color:#8a94a6}
.post-title{font-size:20px;font-weight:700;color:#1f2937;margin-bottom:8px;line-height:1.35}
.post-title a{color:inherit;display:block;transition:color .2s ease}
.post-title a:hover{color:#165DFF}
.post-summary{color:#6b7280;font-size:14px;line-height:1.8;margin-bottom:12px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.post-meta{font-size:12px;color:#8a94a6;display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.post-footer{margin-top:auto}
.post-link{display:inline-flex;align-items:center;gap:6px;color:#165DFF;font-weight:600;font-size:14px;padding:8px 0}
.post-link span{display:inline-block;transition:transform .2s ease}
.post-link:hover span{transform:translateX(2px)}
.post-detail{background:#fff;border-radius:12px;padding:28px;box-shadow:0 2px 14px rgba(0,0,0,0.06)}
.post-detail h1{font-size:24px;margin-bottom:12px;color:#1a1a1a}
.post-detail .post-meta{margin-bottom:18px}
.post-detail .content{font-size:15px}
.post-side-list{display:grid;gap:12px}
.post-side-item{display:block;padding:12px 14px;background:#fff;border-radius:10px;box-shadow:0 2px 10px rgba(0,0,0,0.05);color:#333}
.post-side-item:hover{color:#165DFF}
.post-side-item strong{display:block;margin-bottom:4px;font-size:14px}
.post-side-item span{font-size:12px;color:#888}

@media (max-width:768px){
    .detail-card{
        grid-template-columns:1fr;
        padding:20px;
        gap:20px;
    }
    .detail-download{
        padding:20px 16px;
    }
    .detail-title{font-size:19px}
    .detail-thumb{
        width:64px;
        height:64px;
        border-radius:12px;
    }
    .qr-wrap img{width:150px;height:150px}
    .content-card{padding:20px}
    .content{font-size:14px}
    .detail-task{padding-top:10px;margin-top:12px}
    .app-list{grid-template-columns:1fr}
    .post-card{grid-template-columns:1fr;gap:14px;padding:16px}
    .post-cover{min-height:140px}
    .post-title{font-size:18px}
    .post-detail{padding:20px}
    .app-list-item{padding:12px 16px;gap:12px}
    .list-thumb{width:48px;height:48px;border-radius:10px}
    .list-title{font-size:14px}
}

/* 页脚样式 */
.footer{margin-top:60px;background:#fff;padding:40px 20px;border-top:1px solid #e5e7eb}
.footer-inner{max-width:1280px;margin:0 auto;text-align:center;color:#666;font-size:14px;line-height:1.8}
.footer a{color:#165DFF}

/* 复制按钮和提示样式 */
.copy-btn{
    display:inline-block;
    margin-left:8px;
    padding:4px 10px;
    font-size:13px;
    border-radius:6px;
    border:1px solid #e5e7eb;
    background:#fff;
    color:#165DFF;
    cursor:pointer;
    transition:background 0.18s,transform 0.08s;
}
.copy-btn:hover{background:#f6f9ff}
.copy-btn:active{transform:translateY(1px)}

.copied-toast{
    position:fixed;
    left:50%;
    bottom:80px;
    transform:translateX(-50%);
    background:rgba(0,0,0,0.8);
    color:#fff;
    padding:10px 14px;
    border-radius:8px;
    font-size:14px;
    opacity:0;
    transition:opacity 0.18s,transform 0.18s;
    z-index:9999;
}
.copied-toast.visible{opacity:1;transform:translateX(-50%) translateY(-6px)}