/* ========== 全局重置与基础 ========== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --gold:#d4a93a;--gold-light:#f0d57a;--gold-dark:#a07c1c;
  --red:#b22222;--red-dark:#7a1414;
  --ink:#2a2118;--ink-light:#5a4a36;--muted:#8a7a63;
  --bg:#f7f3ea;--bg-card:#fffdf7;--bg-deep:#1a1410;
  --line:#e2d8c2;--shadow:0 2px 12px rgba(90,74,54,.10);
  --shadow-lg:0 8px 30px rgba(90,74,54,.16);
  --radius:8px;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:"Microsoft YaHei","PingFang SC","WenQuanYi Micro Hei",-apple-system,sans-serif;
  background:var(--bg);color:var(--ink);line-height:1.75;font-size:15px;
}
a{color:var(--ink);text-decoration:none;transition:.2s}
a:hover{color:var(--red)}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}
.container{max-width:1180px;margin:0 auto;padding:0 16px}

/* ========== 顶部工具条 ========== */
.topbar{background:var(--bg-deep);color:#c9b99a;font-size:13px;padding:6px 0}
.topbar .container{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.topbar a{color:#c9b99a}.topbar a:hover{color:var(--gold-light)}

/* ========== 头部 ========== */
.header{background:linear-gradient(135deg,#2a1c10,#4a2c14);border-bottom:3px solid var(--gold);padding:22px 0}
.header-inner{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:12px;color:#fff}
.logo-mark{
  width:52px;height:52px;flex:0 0 52px;border-radius:10px;
  background:radial-gradient(circle at 35% 30%,var(--gold-light),var(--gold) 55%,var(--gold-dark));
  display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:900;
  color:#3a2810;text-shadow:0 1px 0 rgba(255,255,255,.5);box-shadow:0 3px 10px rgba(0,0,0,.4)
}
.logo-text{font-size:22px;font-weight:900;letter-spacing:1px;text-shadow:0 2px 6px rgba(0,0,0,.5)}
.logo-text small{display:block;font-size:12px;font-weight:400;color:var(--gold-light);letter-spacing:3px;margin-top:2px}
.header-meta{margin-left:auto;text-align:right;color:#e7d9b8;font-size:13px}
.header-meta strong{display:block;color:var(--gold-light);font-size:15px}

/* ========== 导航 ========== */
.nav{background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow);position:sticky;top:0;z-index:50}
.nav-list{display:flex;flex-wrap:wrap;gap:4px}
.nav-list a{
  display:block;padding:13px 16px;font-size:15px;font-weight:700;color:var(--ink-light);
  border-bottom:3px solid transparent;white-space:nowrap
}
.nav-list a:hover{color:var(--red);background:#faf6ec;border-bottom-color:var(--red)}
.nav-list a.active{color:var(--red);border-bottom-color:var(--gold);background:#faf6ec}

/* ========== 布局 ========== */
.layout{display:grid;grid-template-columns:1fr 320px;gap:24px;margin:24px auto}
.layout.full{grid-template-columns:1fr}
.section-title{
  display:flex;align-items:center;gap:10px;font-size:19px;font-weight:900;margin-bottom:16px;
  padding-bottom:10px;border-bottom:2px solid var(--gold);color:var(--ink)
}
.section-title::before{
  content:"";width:6px;height:20px;background:var(--red);border-radius:3px;display:inline-block
}
.section-title .more{margin-left:auto;font-size:13px;font-weight:400;color:var(--muted)}
.section-title .more:hover{color:var(--red)}
.card{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);margin-bottom:24px}

/* ========== 开服表 ========== */
.srv-table{width:100%;border-collapse:collapse;font-size:14px}
.srv-table th,.srv-table td{padding:12px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
.srv-table th{background:#f3ebd9;color:var(--ink-light);font-weight:700;white-space:nowrap}
.srv-table tr:hover td{background:#fdf8ec}
.srv-table .num{color:var(--muted);font-weight:700;width:44px}
.srv-name{font-weight:700;color:var(--ink)}
.srv-name span{display:block;font-size:12px;color:var(--muted);font-weight:400}
.tag{display:inline-block;padding:2px 10px;border-radius:20px;font-size:12px;font-weight:700;white-space:nowrap}
.tag-retro{background:#f0e6cf;color:#8a6a1c}
.tag-micro{background:#e3eecf;color:#4a7a1c}
.tag-heji{background:#e6dcf5;color:#6a3aa0}
.tag-single{background:#fbd9cf;color:#b24a1c}
.tag-ice{background:#d4ecf7;color:#1a6a8a}
.tag-silent{background:#f7e6a0;color:#8a6a10}
.status{font-weight:700;font-size:13px}
.s-hot{color:var(--red)}.s-full{color:#c0392b}.s-new{color:#27ae60}
.pop{color:var(--gold-dark);font-weight:700;font-variant-numeric:tabular-nums}

/* ========== 资讯列表 ========== */
.news-list li{padding:14px 0;border-bottom:1px dashed var(--line)}
.news-list li:last-child{border-bottom:none;padding-bottom:0}
.news-list a{display:flex;gap:14px;align-items:flex-start}
.news-thumb{
  width:120px;height:78px;flex:0 0 120px;border-radius:6px;overflow:hidden;
  background:linear-gradient(135deg,var(--gold-light),var(--gold-dark))
}
.news-thumb span{display:flex;width:100%;height:100%;align-items:center;justify-content:center;font-size:32px}
.news-body{flex:1;min-width:0}
.news-title{font-size:16px;font-weight:700;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-desc{font-size:13px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-date{font-size:12px;color:var(--muted);margin-top:6px}
.news-list a:hover .news-title{color:var(--red)}

/* ========== 排行 ========== */
.rank-list li{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.rank-list li:last-child{border-bottom:none}
.rank-no{width:26px;height:26px;flex:0 0 26px;border-radius:6px;background:#f0e6cf;color:var(--gold-dark);font-weight:900;display:flex;align-items:center;justify-content:center;font-size:14px}
.rank-list li:nth-child(1) .rank-no{background:var(--gold);color:#fff}
.rank-list li:nth-child(2) .rank-no{background:#c9c9c9;color:#fff}
.rank-list li:nth-child(3) .rank-no{background:#cd8a54;color:#fff}
.rank-name{flex:1;font-weight:700;font-size:14px}
.rank-name span{display:block;font-size:12px;color:var(--muted);font-weight:400}
.rank-pop{color:var(--gold-dark);font-weight:700;font-size:14px}

/* ========== 版本卡片 ========== */
.ver-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.ver-card{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);transition:.25s}
.ver-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
.ver-icon{font-size:34px;margin-bottom:12px}
.ver-card h3{font-size:17px;margin-bottom:8px;color:var(--ink)}
.ver-card p{font-size:13.5px;color:var(--muted);line-height:1.7}

/* ========== 分页 ========== */
.pager{display:flex;gap:8px;justify-content:center;margin-top:24px;flex-wrap:wrap}
.pager a,.pager span{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 12px;border:1px solid var(--line);border-radius:6px;background:#fff;font-size:14px;color:var(--ink-light)}
.pager a:hover{border-color:var(--red);color:var(--red)}
.pager .current{background:var(--red);border-color:var(--red);color:#fff;font-weight:700}

/* ========== 文章页 ========== */
.article-head{margin-bottom:20px}
.article-crumb{font-size:13px;color:var(--muted);margin-bottom:12px}
.article-crumb a{color:var(--muted)}
.article-crumb a:hover{color:var(--red)}
.article-title{font-size:26px;font-weight:900;line-height:1.4;margin-bottom:12px;color:var(--ink)}
.article-meta{font-size:13px;color:var(--muted);padding-bottom:14px;border-bottom:1px solid var(--line);display:flex;gap:16px;flex-wrap:wrap}
.article-body{font-size:16px;line-height:2;color:#3a2e1e}
.article-body p{margin-bottom:18px;text-align:justify}
.article-body h2{font-size:20px;margin:30px 0 14px;padding-left:12px;border-left:4px solid var(--red);color:var(--ink)}
.article-body h3{font-size:17px;margin:24px 0 12px;color:var(--ink-light)}
.article-body ul,.article-body ol{margin:0 0 18px 22px}
.article-body li{margin-bottom:10px;list-style:disc}
.article-body ol li{list-style:decimal}
.article-body strong{color:var(--red)}
.article-body blockquote{background:#faf4e4;border-left:4px solid var(--gold);padding:14px 18px;margin:0 0 18px;color:var(--ink-light);border-radius:0 6px 6px 0}
.article-tags{margin-top:24px;padding-top:16px;border-top:1px dashed var(--line);display:flex;gap:8px;flex-wrap:wrap}
.article-tags a{background:#f3ebd9;color:var(--ink-light);padding:4px 12px;border-radius:20px;font-size:13px}
.article-tags a:hover{background:var(--red);color:#fff}

/* ========== 侧边通用 ========== */
.side-card{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow);margin-bottom:24px}
.side-card h3{font-size:16px;font-weight:900;padding-bottom:10px;margin-bottom:12px;border-bottom:2px solid var(--gold)}
.side-list li{padding:9px 0;border-bottom:1px dashed var(--line)}
.side-list li:last-child{border-bottom:none}
.side-list a{display:block;font-size:14px;line-height:1.5}
.side-list a:hover{color:var(--red)}

/* ========== 页脚 ========== */
.footer{background:var(--bg-deep);color:#a99;padding:36px 0 0;margin-top:30px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:30px;margin-bottom:28px}
.footer-brand .logo{margin-bottom:14px}
.footer-brand p{font-size:13px;color:#8a7a63;line-height:1.8}
.footer h4{color:var(--gold-light);font-size:15px;margin-bottom:14px}
.footer ul li{padding:6px 0}
.footer ul a{color:#a99;font-size:13.5px}
.footer ul a:hover{color:var(--gold-light)}
.footer-bottom{background:#0f0b08;border-top:1px solid #2a2018;padding:18px 0;text-align:center;font-size:13px;color:#7a6a53}
.footer-bottom a{color:#8a7a63}

/* ========== 面包屑 ========== */
.crumb{font-size:13px;color:var(--muted);margin:16px 0}
.crumb a{color:var(--muted)}
.crumb a:hover{color:var(--red)}
.crumb span{margin:0 6px;color:var(--line)}

/* ========== 工具类 ========== */
.text-center{text-align:center}
.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.badge-live{display:inline-flex;align-items:center;gap:6px;background:rgba(39,174,96,.12);color:#1e7e45;padding:4px 12px;border-radius:20px;font-size:13px;font-weight:700}
.badge-live::before{content:"";width:8px;height:8px;border-radius:50%;background:#27ae60;animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:24px}
.stat{background:linear-gradient(135deg,#fffdf7,#f7efdc);border:1px solid var(--line);border-radius:var(--radius);padding:18px;text-align:center;box-shadow:var(--shadow)}
.stat-num{font-size:28px;font-weight:900;color:var(--red);font-variant-numeric:tabular-nums}
.stat-label{font-size:13px;color:var(--muted);margin-top:4px}

/* ========== 响应式 ========== */
@media(max-width:900px){
  .layout{grid-template-columns:1fr;gap:16px;margin:16px auto}
  .footer-grid{grid-template-columns:1fr 1fr;gap:20px}
  .header-inner{flex-direction:column;text-align:center;gap:12px}
  .header-meta{margin-left:0;text-align:center}
  .news-list a{flex-direction:column}.news-thumb{width:100%;height:150px;flex:0 0 auto}
  .article-title{font-size:21px}
}
@media(max-width:560px){
  body{font-size:14px}
  .nav-list a{padding:11px 12px;font-size:14px}
  .footer-grid{grid-template-columns:1fr}
  .srv-table th:nth-child(4),.srv-table td:nth-child(4){display:none}
  .stat-num{font-size:22px}
}
