:root{
    --main-color:#409EFF;
    --text-color:#303133;
    --bg-color:#ffffff;
    --card-bg:#f5f7fa;
    --border-color:#e4e7ed;
    --shadow-sm:0 2px 8px rgba(0,0,0,0.04);
    --shadow-md:0 4px 16px rgba(0,0,0,0.08);
    --radius:12px;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
    background:var(--bg-color);
    color:var(--text-color);
    line-height:1.6;
    transition:background 0.25s,color 0.25s;
}

a{
    color:inherit;
    text-decoration:none;
}

ul{
    list-style:none;
}

.container{
    max-width:1400px;
    margin:0 auto;
    padding:24px 16px;
}

.flex{
    display:flex;
    gap:24px;
}

.screen-reader-text{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    border:0;
}

/* header */
.onenav-header{
    background:var(--card-bg);
    padding:16px 0;
    box-shadow:var(--shadow-sm);
    position:sticky;
    top:0;
    z-index:99;
}

.header-inner{
    max-width:1400px;
    margin:0 auto;
    padding:0 16px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.site-logo{
    font-size:24px;
    font-weight:800;
    color:var(--main-color);
    letter-spacing:0.5px;
}

.header-right{
    display:flex;
    align-items:center;
    gap:20px;
}

.top-menu{
    display:flex;
    gap:16px;
    font-size:14px;
}

.top-menu a{
    padding:6px 12px;
    border-radius:8px;
    color:var(--text-color);
    opacity:0.85;
    transition:0.2s;
}

.top-menu a:hover{
    background:rgba(64,158,255,0.1);
    color:var(--main-color);
    opacity:1;
}

.color-switch-btn{
    background:transparent;
    border:1px solid var(--border-color);
    color:var(--text-color);
    width:36px;
    height:36px;
    border-radius:50%;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:0.2s;
}

.color-switch-btn:hover{
    border-color:var(--main-color);
    color:var(--main-color);
}

/* 搜索头部 */
.search-header{
    margin-bottom:32px;
    background:var(--card-bg);
    padding:24px;
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
}

.home-subtitle{
    text-align:center;
    margin-bottom:16px;
    font-size:15px;
    opacity:0.75;
}

.search-engine-switch{
    display:flex;
    gap:10px;
    margin-bottom:14px;
    flex-wrap:wrap;
}

.search-tab{
    padding:8px 16px;
    border-radius:8px;
    background:var(--bg-color);
    border:1px solid var(--border-color);
    cursor:pointer;
    font-size:14px;
    transition:0.2s;
}

.search-tab.active{
    background:var(--main-color);
    border-color:var(--main-color);
    color:#fff;
}

.search-input-box{
    display:flex;
    gap:10px;
}

#global-search{
    flex:1;
    padding:14px 16px;
    border:1px solid var(--border-color);
    border-radius:10px;
    font-size:15px;
    background:var(--bg-color);
    color:var(--text-color);
    outline:none;
    transition:0.2s;
}

#global-search:focus{
    border-color:var(--main-color);
    box-shadow:0 0 0 3px rgba(64,158,255,0.15);
}

#search-submit{
    padding:0 24px;
    border:none;
    background:var(--main-color);
    color:#fff;
    border-radius:10px;
    cursor:pointer;
    font-size:15px;
    transition:0.2s;
}

#search-submit:hover{
    filter:brightness(1.05);
}

/* 侧边栏 */
.sidebar{
    width:260px;
    flex-shrink:0;
}

.sidebar-inner{
    background:var(--card-bg);
    border-radius:var(--radius);
    padding:18px;
    position:sticky;
    top:80px;
    box-shadow:var(--shadow-sm);
    max-height:calc(100vh - 100px);
    overflow-y:auto;
}

.sidebar-menu li a{
    display:block;
    padding:10px 12px;
    border-radius:8px;
    margin:6px 0;
    font-size:14px;
    color:var(--text-color);
    opacity:0.85;
    transition:0.2s;
}

.sidebar-menu li a:hover,
.sidebar-menu li.current-cat a{
    background:rgba(64,158,255,0.1);
    color:var(--main-color);
    opacity:1;
}

.home-content{
    flex:1;
    min-width:0;
}

.site-group{
    margin-bottom:48px;
}

.cat-title{
    font-size:20px;
    margin-bottom:16px;
    font-weight:700;
    display:flex;
    align-items:center;
    gap:8px;
}

.cat-title::before{
    content:"";
    width:4px;
    height:20px;
    background:var(--main-color);
    border-radius:2px;
}

.child-cat-tabs{
    display:flex;
    gap:8px;
    margin-bottom:16px;
    flex-wrap:wrap;
}

.child-tab{
    padding:6px 14px;
    border-radius:8px;
    background:var(--card-bg);
    border:1px solid var(--border-color);
    cursor:pointer;
    font-size:13px;
    transition:0.2s;
}

.child-tab.active{
    background:var(--main-color);
    border-color:var(--main-color);
    color:#fff;
}

/* 卡片网格 */
.site-card-grid{
    display:grid;
    gap:18px;
}

.site-card-grid.col-4{grid-template-columns:repeat(4,1fr);}
.site-card-grid.col-5{grid-template-columns:repeat(5,1fr);}
.site-card-grid.col-6{grid-template-columns:repeat(6,1fr);}

.site-card{
    background:var(--card-bg);
    border-radius:var(--radius);
    padding:18px;
    cursor:pointer;
    transition:0.25s;
    position:relative;
    overflow:hidden;
}

.site-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-md);
}

.card-icon{
    width:46px;
    height:46px;
    margin-bottom:12px;
}

.card-icon img{
    width:100%;
    height:100%;
    object-fit:contain;
    border-radius:8px;
}

.icon-default{
    display:flex;
    align-items:center;
    justify-content:center;
    width:46px;
    height:46px;
    background:linear-gradient(135deg,var(--main-color),#66b1ff);
    color:#fff;
    border-radius:8px;
    font-size:20px;
    font-weight:bold;
}

.card-name{
    font-size:16px;
    margin-bottom:6px;
    font-weight:600;
}

.card-desc{
    font-size:13px;
    opacity:0.75;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    margin-bottom:6px;
}

.card-click{
    font-size:12px;
    opacity:0.6;
}

.card-actions{
    position:absolute;
    top:12px;
    right:12px;
    opacity:0;
    transition:0.2s;
}

.site-card:hover .card-actions{
    opacity:1;
}

.card-copy{
    background:var(--bg-color);
    border:1px solid var(--border-color);
    border-radius:6px;
    width:28px;
    height:28px;
    cursor:pointer;
    font-size:14px;
}

/* 资讯模块 */
.news-module{
    margin-top:60px;
}

.news-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
}

.news-item{
    background:var(--card-bg);
    padding:18px;
    border-radius:var(--radius);
    transition:0.2s;
}

.news-item:hover{
    transform:translateY(-2px);
    box-shadow:var(--shadow-sm);
}

.news-item h4{
    font-size:15px;
    margin-bottom:8px;
    font-weight:600;
}

.news-excerpt{
    font-size:13px;
    opacity:0.7;
    line-height:1.5;
}

/* single页面 */
.single-site-box{
    background:var(--card-bg);
    padding:32px;
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
}

.single-head{
    text-align:center;
    margin-bottom:24px;
}

.single-icon{
    width:72px;
    height:72px;
    border-radius:12px;
    margin-bottom:16px;
}

.meta-info{
    margin:12px 0;
    opacity:0.7;
    font-size:14px;
}

.btn-go{
    display:inline-block;
    background:var(--main-color);
    color:#fff;
    padding:12px 28px;
    border-radius:10px;
    margin-top:12px;
    font-weight:500;
    transition:0.2s;
}

.btn-go:hover{
    filter:brightness(1.05);
}

/* 悬浮工具 */
.float-tool{
    position:fixed;
    right:24px;
    bottom:24px;
    display:flex;
    flex-direction:column;
    gap:10px;
    z-index:98;
}

.tool-btn{
    background:var(--card-bg);
    color:var(--text-color);
    border:1px solid var(--border-color);
    padding:10px 12px;
    border-radius:50%;
    font-size:16px;
    cursor:pointer;
    box-shadow:var(--shadow-md);
    transition:0.2s;
}

.tool-btn:hover{
    background:var(--main-color);
    color:#fff;
    border-color:var(--main-color);
}

/* 移动端底部导航 */
.mobile-bottom-nav{
    display:none;
    position:fixed;
    left:0;
    bottom:0;
    width:100%;
    background:var(--card-bg);
    border-top:1px solid var(--border-color);
    padding:10px 0;
    z-index:99;
}

.mobile-nav-menu{
    display:flex;
    justify-content:space-around;
}

.mobile-nav-menu a{
    font-size:12px;
    color:var(--text-color);
    opacity:0.75;
}

.mobile-nav-menu a:hover{
    color:var(--main-color);
    opacity:1;
}

.onenav-footer{
    margin-top:60px;
    padding:24px 0;
    text-align:center;
    font-size:13px;
    opacity:0.6;
}

/* 响应式 */
@media(max-width:1024px){
    .flex{
        flex-direction:column;
    }

    .sidebar{
        width:100%;
    }

    .sidebar-inner{
        position:static;
        max-height:none;
    }

    .site-card-grid.col-4,
    .site-card-grid.col-5,
    .site-card-grid.col-6{
        grid-template-columns:repeat(2,1fr);
    }

    .news-grid{
        grid-template-columns:1fr;
    }

    .mobile-bottom-nav{
        display:block;
    }

    .onenav-footer{
        padding-bottom:80px;
    }
}

@media(max-width:640px){
    .container{
        padding:16px 12px;
    }

    .site-card-grid.col-4,
    .site-card-grid.col-5,
    .site-card-grid.col-6{
        grid-template-columns:1fr;
    }

    .search-input-box{
        flex-direction:column;
    }

    #search-submit{
        width:100%;
        padding:14px;
    }

    .float-tool{
        right:12px;
        bottom:80px;
    }
}

/*面包屑*/
.breadcrumb{
    font-size:13px;
    margin-bottom:16px;
    opacity:0.75;
}
.breadcrumb a{
    color:var(--main-color);
}
.breadcrumb span{
    margin:0 6px;
}

/*空提示*/
.empty-tip{
    grid-column:1/-1;
    text-align:center;
    padding:60px 20px;
    opacity:0.65;
    font-size:14px;
}

/*404页面*/
.page-404{
    display:flex;
    justify-content:center;
    padding:80px 0;
}
.box-404{
    text-align:center;
    background:var(--card-bg);
    padding:48px 64px;
    border-radius:var(--radius);
}
.box-404 h1{
    font-size:72px;
    color:var(--main-color);
}

/*详情页按钮组*/
.single-action-group{
    margin-top:14px;
    display:flex;
    gap:12px;
    justify-content:center;
    flex-wrap:wrap;
}
.btn-copy-link,.btn-fav{
    padding:12px 24px;
    border-radius:10px;
    border:1px solid var(--border-color);
    background:var(--card-bg);
    cursor:pointer;
    transition:0.2s;
}
.btn-copy-link:hover,.btn-fav:hover{
    border-color:var(--main-color);
    color:var(--main-color);
}

/*toast弹窗提示*/
.toast{
    position:fixed;
    left:50%;
    top:40%;
    transform:translate(-50%,-50%);
    background:rgba(0,0,0,0.75);
    color:#fff;
    padding:10px 20px;
    border-radius:8px;
    z-index:9999;
    opacity:0;
    pointer-events:none;
    transition:0.25s;
}
.toast.show{
    opacity:1;
}

/*收藏激活状态*/
.btn-fav.active{
    background:var(--main-color);
    color:#fff;
    border-color:var(--main-color);
}

/*卡片筛选隐藏类*/
.site-card.filter-hide{
    display:none;
}