* {margin:0;padding:0;box-sizing:border-box;}
body {font-family:'Inter',sans-serif; background:#0f172a; color:#e2e8f0; overflow-x:hidden;}

/* 粒子背景 */
#particle-background {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: -2;
}

/* 毛玻璃动态背景 */
.background {
    position: fixed;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 20% 30%, #1e3a8a, transparent 40%),
                radial-gradient(circle at 80% 70%, #0ea5e9, transparent 40%);
    z-index: -1;
    animation: pulse 8s infinite alternate;
}

@keyframes pulse { from {opacity:0.7;} to {opacity:1;} }

/* 导航栏 */
.navbar {
    display:flex; justify-content:space-between; align-items:center;
    padding:20px 40px; background: rgba(15,23,42,0.7); backdrop-filter: blur(10px);
    position: sticky; top:0; z-index:100;
}
.logo{font-weight:800;}
.nav-links a{margin-left:20px;color:#38bdf8;text-decoration:none;}
.theme-btn{margin-left:20px;background:none;border:none;font-size:1rem;cursor:pointer;}

/* 主体 */
.container{max-width:1100px;margin:80px auto;padding:20px;}

/* Hero 区 */
.hero{margin-bottom:40px;text-align:center;}
.hero-title{font-size:3rem;font-weight:800;margin-bottom:10px;}
.hero-subtitle{color:#38bdf8;font-weight:500; font-size:1.3rem;}

/* 搜索框 */
.search-box{width:100%;padding:12px;margin-bottom:30px;border-radius:10px;border:none;outline:none;}

/* 文章卡片 */
.post-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;}
.post-card{background:rgba(30,41,59,0.6);backdrop-filter:blur(12px);padding:25px;border-radius:16px;transition:0.3s ease;border:1px solid rgba(56,189,248,0.2);}
.post-card:hover{transform:translateY(-10px);box-shadow:0 10px 40px rgba(14,165,233,0.4);border-color:#38bdf8;}
.post-card h2{margin-bottom:10px;}
.post-card p{margin-bottom:10px;}
.post-card small{color:#64748b;}

/* 文章页 */
#content{margin-top:40px; line-height:1.8;}
#content h1{margin-bottom:20px;}
#content p{margin-bottom:16px;}
#content pre{background:#1e293b;padding:15px;border-radius:8px;overflow-x:auto;}

/* 浅色模式 */
body.light{background:#f1f5f9;color:#0f172a;}
body.light .post-card{background:#ffffff;color:#0f172a;}

/* 动画渐入 */
@keyframes fadeIn { from {opacity:0; transform:translateY(20px);} to {opacity:1; transform:translateY(0);} }

footer{margin-top:80px;font-size:0.9rem;color:#64748b;}