body{font-family:'Segoe UI', 'Microsoft YaHei', sans-serif;margin:0;padding:0;background:linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);min-height:100vh;color:#333;line-height:1.6;}
.site-header{background:#2c3e50;color:#fff;box-shadow:0 4px 20px rgba(0,0,0,0.1);position:relative;z-index:100;}
.header-container{max-width:1200px;margin:0 auto;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;}
.logo-area .logo-link{text-decoration:none;color:#fff;display:flex;align-items:center;}
.logo-text{font-size:28px;font-weight:800;background:linear-gradient(90deg, #ff7e5f, #feb47b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:1px;}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:30px;}
.main-nav a{color:#ecf0f1;text-decoration:none;font-weight:600;font-size:16px;padding:8px 15px;border-radius:20px;transition:all 0.3s ease;}
.main-nav a:hover{background:rgba(255,255,255,0.15);color:#fff;transform:translateY(-2px);}
.header-banner{height:300px;background-size:cover;background-position:center;position:relative;margin-top:10px;border-radius:0 0 30px 30px;overflow:hidden;}
.header-banner::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to bottom, rgba(44,62,80,0.4), rgba(44,62,80,0.8));}
.site-main{padding:40px 20px;max-width:1200px;margin:0 auto;}
.hero-section{background:linear-gradient(90deg, #6a11cb 0%, #2575fc 100%);border-radius:25px;padding:60px 40px;margin-bottom:50px;position:relative;overflow:hidden;color:#fff;text-align:center;}
.hero-title{font-size:48px;margin-bottom:15px;font-weight:800;text-shadow:2px 2px 4px rgba(0,0,0,0.3);}
.hero-desc{font-size:20px;opacity:0.9;max-width:700px;margin:0 auto;}
.hero-ornament{position:absolute;bottom:-50px;right:-50px;width:200px;height:200px;background:rgba(255,255,255,0.1);border-radius:50%;}
.main-layout{display:grid;grid-template-columns:1fr 350px;gap:40px;margin-bottom:50px;}
.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;padding-bottom:15px;border-bottom:2px solid #e0e6ef;}
.section-title{font-size:26px;font-weight:700;color:#2c3e50;display:flex;align-items:center;gap:10px;}
.title-icon{display:inline-block;width:10px;height:30px;background:linear-gradient(to bottom, #ff7e5f, #feb47b);border-radius:5px;}
.article-showcase{background:#fff;border-radius:20px;padding:30px;box-shadow:0 10px 30px rgba(0,0,0,0.08);}
.showcase-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));gap:20px;}
.showcase-list li{background:#f8f9fa;padding:18px 20px;border-radius:12px;transition:all 0.3s ease;border-left:4px solid #6a11cb;}
.showcase-list li:hover{background:#eef2ff;transform:translateX(5px);box-shadow:0 5px 15px rgba(106,17,203,0.2);}
.showcase-list a{text-decoration:none;color:#2c3e50;font-weight:600;font-size:16px;display:block;}
.content-sidebar{display:flex;flex-direction:column;gap:30px;}
.sidebar-widget{background:#fff;border-radius:20px;padding:25px;box-shadow:0 8px 25px rgba(0,0,0,0.06);}
.widget-header{margin-bottom:20px;padding-bottom:15px;border-bottom:1px dashed #ddd;}
.widget-title{font-size:20px;color:#2c3e50;display:flex;align-items:center;gap:10px;}
.widget-icon{display:inline-block;width:6px;height:20px;background:#2575fc;border-radius:3px;}
.ranking-list{list-style:none;margin:0;padding:0;counter-reset:ranking;}
.ranking-list li{counter-increment:ranking;padding:12px 15px;margin-bottom:10px;background:#f8f9fa;border-radius:10px;display:flex;align-items:center;}
.ranking-list li::before{content:counter(ranking);background:linear-gradient(135deg, #6a11cb, #2575fc);color:#fff;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-right:15px;font-weight:bold;font-size:14px;}
.ranking-list a{text-decoration:none;color:#333;flex:1;font-weight:500;}
.news-ticker{background:#f0f4ff;border-radius:12px;padding:15px;overflow:hidden;}
.ticker-list{list-style:none;margin:0;padding:0;animation:ticker 20s linear infinite;}
@keyframes ticker{0%{transform:translateY(0);}100%{transform:translateY(-100%);}}
.ticker-list li{padding:10px 0;border-bottom:1px dashed #ccd6f6;}
.ticker-list a{text-decoration:none;color:#2c3e50;font-size:15px;}
.feature-section{margin-top:50px;}
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(400px, 1fr));gap:30px;}
.feature-card{background:#fff;border-radius:25px;overflow:hidden;box-shadow:0 15px 35px rgba(0,0,0,0.1);position:relative;}
.card-bg{height:150px;background-size:cover;background-position:center;}
.card-content{padding:25px;}
.card-title{font-size:22px;color:#2c3e50;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #f0f4ff;}
.card-list{list-style:none;margin:0;padding:0;}
.card-list li{padding:12px 0;border-bottom:1px solid #f5f5f5;}
.card-list a{text-decoration:none;color:#555;font-size:15px;transition:color 0.3s;}
.card-list a:hover{color:#6a11cb;}
.site-footer{background:#2c3e50;color:#ecf0f1;padding:50px 20px 20px;margin-top:80px;}
.footer-top{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:50px;padding-bottom:40px;border-bottom:1px solid #3a506b;}
.links-title{font-size:20px;margin-bottom:20px;color:#fff;}
.friend-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));gap:12px;}
.friend-links a{color:#bdc3c7;text-decoration:none;font-size:14px;padding:5px 0;transition:color 0.3s;}
.friend-links a:hover{color:#fff;}
.footer-info{text-align:right;}
.info-logo{font-size:32px;font-weight:800;background:linear-gradient(90deg, #ff7e5f, #feb47b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:15px;}
.copyright{font-size:14px;color:#95a5a6;margin-bottom:10px;}
.icp{font-size:14px;color:#95a5a6;}
.footer-bottom{padding-top:20px;text-align:center;}
.footer-ornament{height:4px;background:linear-gradient(90deg, #6a11cb, #2575fc);width:200px;margin:0 auto;border-radius:2px;}
.list-page{max-width:1200px;margin:40px auto;padding:0 20px;}
.list-header{margin-bottom:40px;}
.breadcrumb{font-size:14px;color:#7f8c8d;margin-bottom:20px;}
.bc-item{color:#95a5a6;}
.bc-link{color:#3498db;text-decoration:none;}
.bc-separator{margin:0 8px;}
.category-link.current{color:#e74c3c;font-weight:600;}
.list-hero{height:200px;border-radius:20px;background-size:cover;background-position:center;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;text-align:center;padding:30px;}
.list-hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);border-radius:20px;}
.list-title{font-size:42px;font-weight:800;position:relative;z-index:1;margin-bottom:10px;}
.list-desc{font-size:18px;opacity:0.9;position:relative;z-index:1;}
.list-container{display:grid;grid-template-columns:1fr 300px;gap:40px;}
.list-filter{margin-bottom:25px;padding:15px 20px;background:#fff;border-radius:15px;box-shadow:0 5px 15px rgba(0,0,0,0.05);}
.filter-label{font-weight:600;margin-right:15px;}
.filter-option{color:#7f8c8d;text-decoration:none;margin-right:20px;padding:5px 15px;border-radius:20px;transition:all 0.3s;}
.filter-option.active{background:#6a11cb;color:#fff;}
.filter-option:hover{background:#f0f4ff;}
.article-list-container{background:#fff;border-radius:20px;padding:30px;box-shadow:0 10px 30px rgba(0,0,0,0.08);}
.list-view{list-style:none;margin:0;padding:0;}
.list-view li{padding:20px;border-bottom:1px solid #eee;transition:background 0.3s;}
.list-view li:hover{background:#f9f9ff;}
.list-view a{text-decoration:none;color:#2c3e50;font-size:17px;font-weight:600;display:block;}
.list-pagination{margin-top:40px;text-align:center;}
.pagelist{list-style:none;margin:0;padding:0;display:inline-flex;gap:10px;background:#fff;padding:15px 25px;border-radius:50px;box-shadow:0 8px 20px rgba(0,0,0,0.08);}
.pagelist li{display:inline;}
.pagelist a{display:inline-block;width:45px;height:45px;line-height:45px;text-align:center;background:#f8f9fa;color:#555;text-decoration:none;border-radius:50%;font-weight:600;transition:all 0.3s;}
.pagelist a:hover{background:#6a11cb;color:#fff;transform:scale(1.1);}
.list-sidebar .sidebar-block{background:#fff;border-radius:20px;padding:25px;margin-bottom:30px;box-shadow:0 8px 25px rgba(0,0,0,0.06);}
.block-header{margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #eee;}
.block-title{font-size:20px;color:#2c3e50;}
.recommend-list{list-style:none;margin:0;padding:0;}
.recommend-list li{padding:12px 0;border-bottom:1px dashed #eee;}
.recommend-list a{text-decoration:none;color:#555;font-size:15px;}
.detail-page{max-width:1200px;margin:40px auto;padding:0 20px;}
.detail-header{margin-bottom:40px;}
.detail-breadcrumb{font-size:14px;color:#7f8c8d;margin-bottom:20px;}
.detail-hero{height:250px;border-radius:20px;background-size:cover;background-position:center;margin-top:20px;}
.detail-container{display:grid;grid-template-columns:1fr 300px;gap:40px;}
.article-detail{background:#fff;border-radius:25px;padding:40px;box-shadow:0 15px 40px rgba(0,0,0,0.1);}
.article-info{margin-bottom:30px;padding-bottom:25px;border-bottom:2px solid #f0f4ff;}
.cat-link{display:inline-block;background:#eef2ff;color:#6a11cb;text-decoration:none;padding:8px 20px;border-radius:20px;font-size:14px;font-weight:600;margin-bottom:15px;}
.article-title{font-size:36px;color:#2c3e50;line-height:1.4;margin-bottom:20px;}
.article-meta{color:#7f8c8d;font-size:15px;display:flex;gap:25px;}
.article-meta span{display:inline-flex;align-items:center;gap:5px;}
.article-content{font-size:18px;line-height:1.8;color:#444;}
.article-content img{max-width:100%;height:auto;border-radius:10px;margin:20px 0;}
.article-nav{display:flex;justify-content:space-between;margin:40px 0;padding:25px;background:#f9f9ff;border-radius:15px;}
.article-nav a{text-decoration:none;color:#555;font-weight:500;max-width:45%;padding:12px 20px;background:#fff;border-radius:10px;box-shadow:0 5px 15px rgba(0,0,0,0.05);transition:all 0.3s;}
.article-nav a:hover{background:#6a11cb;color:#fff;transform:translateY(-3px);}
.u-back-list{display:inline-block;background:linear-gradient(90deg, #6a11cb, #2575fc);color:#fff;text-decoration:none;padding:15px 35px;border-radius:30px;font-weight:600;font-size:16px;margin-top:20px;transition:all 0.3s;}
.u-back-list:hover{transform:translateY(-3px);box-shadow:0 10px 20px rgba(106,17,203,0.3);}
.detail-sidebar .sidebar-module{background:#fff;border-radius:20px;padding:25px;margin-bottom:30px;box-shadow:0 8px 25px rgba(0,0,0,0.06);}
.module-title{font-size:20px;color:#2c3e50;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #eee;}
.hot-list, .new-list{list-style:none;margin:0;padding:0;}
.hot-list li, .new-list li{padding:12px 0;border-bottom:1px dashed #eee;}
.hot-list a, .new-list a{text-decoration:none;color:#555;font-size:15px;}
@media (max-width:992px){.main-layout,.list-container,.detail-container{grid-template-columns:1fr;}.feature-grid{grid-template-columns:1fr;}.footer-top{grid-template-columns:1fr;text-align:center;}.footer-info{text-align:center;}}
@media (max-width:768px){.hero-title{font-size:36px;}.showcase-list{grid-template-columns:1fr;}.main-nav ul{gap:15px;}.header-container{flex-direction:column;gap:20px;}}