/* ===== 星星魔方传奇私服发布网 样式 ===== */
:root{
  --bg:#0b0f1a; --bg2:#121829; --card:#181f34; --line:#28314a;
  --gold:#f5c542; --gold2:#ffdd77; --red:#e6392f; --orange:#ff8a1f;
  --txt:#e8ecf5; --txt2:#aab4cc; --blue:#4aa3ff;
  --maxw:1200px; --radius:10px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--txt);
  font-family:"Microsoft YaHei","PingFang SC","WenQuanYi Micro Hei",-apple-system,Segoe UI,Arial,sans-serif;
  font-size:15px; line-height:1.8; -webkit-font-smoothing:antialiased;
}
a{color:var(--gold); text-decoration:none; transition:.2s;}
a:hover{color:var(--gold2); text-decoration:underline;}
img{max-width:100%;}
ul,ol{padding-left:1.4em;}
.container{max-width:var(--maxw); margin:0 auto; padding:0 18px;}
.site-main{padding:22px 18px 50px;}
.breadcrumb{font-size:13px; color:var(--txt2); margin:4px 0 18px;}
.breadcrumb a{color:var(--blue);}
.breadcrumb .cur{color:var(--gold);}

/* 顶部 */
.topbar{background:linear-gradient(180deg,#101830,#0c1120); border-bottom:2px solid var(--gold); padding:12px 0;}
.topbar-inner{display:flex; align-items:center; gap:18px;}
.logo{font-size:26px; font-weight:800; letter-spacing:1px;}
.logo a{color:#fff; text-decoration:none;}
.logo span{color:var(--gold);}
.topbar-meta{flex:1; color:var(--txt2); font-size:13px; display:flex; gap:16px; flex-wrap:wrap;}
.nav-toggle{display:none; background:none; border:none; color:var(--gold); font-size:28px; cursor:pointer;}

/* 导航 */
.mainnav{background:var(--bg2); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:50;}
.nav-list{display:flex; list-style:none; margin:0; padding:0; flex-wrap:wrap;}
.nav-list li a{display:block; padding:13px 20px; color:#dfe5f2; font-size:15px; font-weight:600; border-bottom:3px solid transparent;}
.nav-list li a:hover{background:#1c2440; color:var(--gold); text-decoration:none;}
.nav-list li.active a{color:var(--gold); border-bottom-color:var(--gold); background:#1c2440;}

/* 通用区 */
.sec{margin:26px 0;}
.sec-head{display:flex; align-items:baseline; gap:12px; margin-bottom:14px; border-left:4px solid var(--gold); padding-left:10px;}
.sec-head h2{margin:0; font-size:20px; color:#fff;}
.sec-head .sub{color:var(--txt2); font-size:13px;}
.more{font-size:13px; color:var(--blue); margin-left:auto;}
.btn{display:inline-block; padding:8px 18px; border-radius:6px; font-size:14px; font-weight:600; cursor:pointer; border:1px solid transparent;}
.btn-primary{background:linear-gradient(180deg,var(--gold),#d4a017); color:#201600; border-color:#f5c542;}
.btn-primary:hover{background:linear-gradient(180deg,var(--gold2),var(--gold)); color:#201600;}
.btn-ghost{background:transparent; color:var(--gold); border-color:var(--gold);}
.btn-ghost:hover{background:rgba(245,197,66,.12);}

/* Hero */
.hero{background:radial-gradient(1200px 300px at 20% 0%,#22305c 0%,transparent 60%),linear-gradient(135deg,#141c33,#0d1224); border:1px solid var(--line); border-radius:var(--radius); padding:28px; display:flex; gap:30px; align-items:center; flex-wrap:wrap;}
.hero-text{flex:1; min-width:280px;}
.hero-text h1{font-size:26px; margin:0 0 12px; color:#fff;}
.hero-text p{margin:0 0 18px; color:var(--txt2); max-width:620px;}
.hero-actions{display:flex; gap:12px; flex-wrap:wrap;}
.hero-stat{display:flex; gap:16px; flex-wrap:wrap;}
.hero-stat div{background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:8px; padding:12px 18px; text-align:center;}
.hero-stat b{display:block; font-size:26px; color:var(--gold);}
.hero-stat span{font-size:12px; color:var(--txt2);}

/* 快捷入口 */
.quick-nav{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin:22px 0;}
.quick-item{background:var(--card); border:1px solid var(--line); border-radius:8px; padding:14px; display:block; color:var(--txt);}
.quick-item:hover{background:#1f2947; border-color:var(--gold); text-decoration:none;}
.quick-item b{display:block; color:var(--gold); font-size:16px; margin-bottom:4px;}
.quick-item span{font-size:12px; color:var(--txt2);}

/* 开服卡片 */
.server-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:16px;}
.server-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:16px; display:flex; flex-direction:column;}
.server-card:hover{border-color:var(--gold);}
.sc-head{display:flex; align-items:center; justify-content:space-between; gap:10px;}
.sc-name{margin:0; font-size:18px; color:#fff;}
.sc-name a{color:#fff;}
.sc-tag{font-size:12px; font-weight:700; padding:2px 9px; border-radius:20px; white-space:nowrap;}
.tag-rec{background:#1f5c2f; color:#7dffa8;}
.tag-new{background:#1d4b8f; color:#8fc6ff;}
.tag-hot{background:#7a1d12; color:#ff9b7d;}
.tag-gold{background:#6b5200; color:var(--gold2);}
.tag-stable{background:#2b4a4a; color:#8ee5d8;}
.tag-pre{background:#4a2b6b; color:#d7a8ff;}
.tag-old{background:#555; color:#eee;}
.sc-desc{color:var(--txt2); font-size:14px; margin:10px 0; flex:1;}
.sc-meta{list-style:none; padding:0; margin:0 0 12px; display:grid; grid-template-columns:repeat(3,1fr); gap:6px; font-size:13px;}
.sc-meta li{background:rgba(255,255,255,.03); border-radius:5px; padding:5px 8px;}
.sc-meta b{display:block; color:var(--gold); font-size:12px; font-weight:600;}
.sc-foot{display:flex; gap:10px; flex-wrap:wrap;}

/* 栏目卡 */
.cols-sec{}
.col-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px;}
.col-card{background:var(--bg2); border:1px solid var(--line); border-left:3px solid var(--gold); border-radius:8px; padding:14px;}
.col-card-head{display:flex; align-items:center; justify-content:space-between;}
.col-card-head h2{margin:0; font-size:18px;}
.col-card-head h2 a{color:#fff;}
.col-card-intro{color:var(--txt2); font-size:13px; margin:8px 0;}
.col-card-list{list-style:none; padding:0; margin:0;}
.col-card-list li{border-top:1px dashed var(--line); padding:7px 0;}
.col-card-list a{color:var(--txt); font-size:14px;}
.col-card-list a:hover{color:var(--gold);}

/* 文章卡 */
.article-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px;}
.article-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column;}
.article-card:hover{border-color:var(--gold);}
.ac-cover{height:110px; position:relative; font-weight:700; color:#fff; font-size:18px; display:flex; align-items:flex-end; padding:12px;}
.ac-cover span{background:rgba(0,0,0,.45); padding:2px 10px; border-radius:20px; font-size:13px;}
.ac-1{background:linear-gradient(135deg,#3a1c02,#8a3b00);}
.ac-2{background:linear-gradient(135deg,#012a3a,#005a6b);}
.ac-3{background:linear-gradient(135deg,#2a0040,#5a0090);}
.ac-4{background:linear-gradient(135deg,#3a2a00,#8a6700);}
.ac-5{background:linear-gradient(135deg,#001a3a,#00408a);}
.ac-6{background:linear-gradient(135deg,#3a0010,#8a0028);}
.ac-7{background:linear-gradient(135deg,#0a3a1c,#1c7a3a);}
.ac-8{background:linear-gradient(135deg,#2b0040,#5e1d8a);}
.ac-9{background:linear-gradient(135deg,#402000,#a05a00);}
.ac-body{padding:14px; display:flex; flex-direction:column; flex:1;}
.ac-title{margin:0 0 8px; font-size:16px; line-height:1.5;}
.ac-title a{color:#fff;}
.ac-meta{font-size:12px; color:var(--txt2); display:flex; gap:10px; flex-wrap:wrap;}
.ac-col{color:var(--gold);}
.ac-excerpt{color:var(--txt2); font-size:13.5px; margin:10px 0; flex:1;}
.ac-more{font-size:13px;}

/* 两栏 */
.two-col{display:grid; grid-template-columns:1fr 300px; gap:26px;}
.main-col .article-list{display:flex; flex-direction:column; gap:16px;}
.article-list .article-card{display:grid; grid-template-columns:200px 1fr; align-items:stretch;}
.article-list .article-card .ac-cover{height:auto; min-height:120px;}
@media(max-width:900px){.two-col{grid-template-columns:1fr;} .article-list .article-card{grid-template-columns:1fr;} }

/* 侧栏 */
.sidebar{display:flex; flex-direction:column; gap:16px;}
.side-box{background:var(--bg2); border:1px solid var(--line); border-radius:8px; padding:14px;}
.side-title{margin:0 0 10px; font-size:16px; color:var(--gold); border-bottom:1px solid var(--line); padding-bottom:6px;}
.side-nav,.side-hot{list-style:none; padding:0; margin:0;}
.side-nav li{border-bottom:1px dashed var(--line);}
.side-nav a{display:flex; justify-content:space-between; padding:8px 4px; color:var(--txt);}
.side-nav a:hover{color:var(--gold);}
.side-nav li.on a{color:var(--gold); font-weight:700;}
.side-nav span{color:var(--txt2); font-size:12px;}
.side-hot li{display:flex; gap:10px; padding:7px 0; border-bottom:1px dashed var(--line);}
.side-hot i{background:var(--gold); color:#201600; width:22px; height:22px; text-align:center; line-height:22px; border-radius:4px; font-style:normal; font-weight:700; font-size:12px; flex:0 0 auto;}
.side-hot a{color:var(--txt); font-size:14px;}
.side-hot span{display:block; font-size:12px; color:var(--txt2);}
.side-tags{display:flex; flex-wrap:wrap; gap:8px;}
.tag{background:var(--card); border:1px solid var(--line); color:var(--txt2); padding:3px 10px; border-radius:20px; font-size:12.5px;}
.tag:hover{color:var(--gold); border-color:var(--gold);}

/* 栏目头 */
.col-hero{background:linear-gradient(90deg,#1a2340,#0d1224); border:1px solid var(--line); border-radius:var(--radius); padding:22px 26px; margin-bottom:22px;}
.col-hero h1{margin:0 0 8px; font-size:24px; color:#fff;}
.col-hero p{margin:0; color:var(--txt2);}
.empty{color:var(--txt2); padding:20px; text-align:center; border:1px dashed var(--line); border-radius:8px;}

/* 文章正文 */
.article-full{background:var(--bg2); border:1px solid var(--line); border-radius:var(--radius); padding:24px; margin-bottom:22px;}
.art-head{margin-bottom:16px;}
.art-col{font-size:13px; color:var(--gold); margin-bottom:8px;}
.art-col a{color:var(--gold);}
.art-title{margin:0 0 12px; font-size:26px; line-height:1.4; color:#fff;}
.art-meta{font-size:13px; color:var(--txt2); display:flex; gap:16px; flex-wrap:wrap;}
.art-tags{margin-top:12px; display:flex; flex-wrap:wrap; gap:8px;}
.art-cover{height:180px; border-radius:8px; margin:18px 0; display:flex; align-items:flex-end; padding:16px;}
.art-cover span{background:rgba(0,0,0,.5); padding:4px 14px; border-radius:20px; color:#fff; font-weight:700;}
.art-content p{margin:0 0 16px; color:#dfe5f2; font-size:15.5px;}
.art-foot{margin-top:22px; padding-top:16px; border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px;}
.rel-list{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:10px;}
.rel-list li{border:1px solid var(--line); border-radius:6px; padding:10px;}
.rel-list a{color:#fff; font-size:14px;}
.rel-list span{display:block; font-size:12px; color:var(--txt2); margin-top:4px;}

/* 小贴士 */
.tips{margin:0; padding-left:1.4em; color:var(--txt2);}
.tips li{margin-bottom:8px;}

/* 站点地图页 */
.smap-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px;}
.smap-col{background:var(--bg2); border:1px solid var(--line); border-radius:8px; padding:14px;}
.smap-col h3{margin:0 0 10px; font-size:17px;}
.smap-col h3 a{color:var(--gold);}
.smap-col ul{list-style:none; padding:0; margin:0;}
.smap-col li{border-top:1px dashed var(--line); padding:7px 0; font-size:14px;}
.smap-col a{color:var(--txt);}
.smap-col span{display:block; font-size:12px; color:var(--txt2);}
.smap-home{margin:14px 0; font-size:15px;}

/* 必应页 */
.bing{background:var(--bg2); border:1px solid var(--line); border-radius:var(--radius); padding:24px;}
.bing h1{color:#fff; margin-top:0;}
.bing h2{color:var(--gold); font-size:18px; margin:22px 0 8px;}
.url-list{list-style:none; padding:0; max-height:420px; overflow:auto; border:1px solid var(--line); border-radius:6px; background:#080c16;}
.url-list li{padding:6px 12px; border-bottom:1px dashed var(--line); font-size:13px;}
.url-list code{color:var(--blue);}
.seo-list{color:var(--txt2);}

/* 页脚 */
.footer{background:#080c16; border-top:2px solid var(--gold); padding:24px 0; margin-top:30px;}
.foot-links{display:flex; flex-wrap:wrap; gap:16px; margin-bottom:14px;}
.foot-links a{color:var(--txt2); font-size:13.5px;}
.foot-about{color:var(--txt2); font-size:13.5px; margin:0 0 8px;}
.foot-copy{color:#6d7892; font-size:12.5px; margin:0;}

/* 响应式 */
@media(max-width:720px){
  .topbar-meta{display:none;}
  .nav-toggle{display:block;}
  .nav-list{display:none; flex-direction:column;}
  .nav-list.open{display:flex;}
  .hero{flex-direction:column; text-align:center;}
  .hero-actions{justify-content:center;}
  .sc-meta{grid-template-columns:repeat(2,1fr);}
  .art-title{font-size:21px;}
}
@media print{body{background:#fff; color:#000;} .mainnav,.topbar,.sidebar,.footer,.breadcrumb{display:none;}}

/* 回到顶部 */
#toTop{position:fixed; right:18px; bottom:22px; width:42px; height:42px; border-radius:50%; background:var(--gold); color:#201600; border:none; font-size:20px; cursor:pointer; display:none; z-index:60; box-shadow:0 4px 12px rgba(0,0,0,.4);}
#toTop.show{display:block;}