/* stgame · 简约蓝（参考 30w 风格） */
:root{--main:#222;--hover:#1D90E2;--line:#f0f2f5;--text:#666;--des:#999;--bg:#f2f4f8;--radius:8px}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--main);
 font:15px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",Arial,sans-serif}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
ul,li{margin:0;padding:0;list-style:none}
.container{width:1200px;max-width:96%;margin:0 auto}
.top{background:#fff;border-bottom:1px solid var(--line);font-size:12px;color:var(--des);padding:7px 0}
.header{background:#fff}
.logobar{display:flex;align-items:center;justify-content:space-between;padding:16px 0}
.logo{display:flex;align-items:center;gap:10px;font-size:26px;font-weight:800;letter-spacing:.5px}
.logo img{width:42px;height:42px;border-radius:12px;box-shadow:0 4px 12px rgba(255,90,31,.28)}
.logo .logo-txt{background:linear-gradient(92deg,#ff7a1a,#ff2f6d 52%,#1D90E2);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.logo .logo-txt b{font-weight:800;margin-left:2px;background:linear-gradient(92deg,#1D90E2,#12c2e9);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
/* 头部搜索栏（替代原来的下载按钮） */
.hsearch{display:flex;align-items:center;gap:8px;background:#f4f8fd;border:1px solid #dfe9f6;border-radius:24px;padding:5px 5px 5px 16px;min-width:360px;transition:box-shadow .2s,border-color .2s}
.hsearch:focus-within{border-color:#9ecdf5;box-shadow:0 0 0 4px rgba(29,144,226,.12)}
.hsearch input{flex:1;border:0;background:transparent;outline:none;font-size:14px;color:#333;padding:7px 0}
.hsearch input::placeholder{color:#9fb0c2}
.hsearch button{border:0;cursor:pointer;background:linear-gradient(92deg,#1D90E2,#12a6f0);color:#fff;border-radius:20px;padding:9px 22px;font-size:14px;font-weight:600}
.hsearch button:hover{filter:brightness(1.06)}
/* 导航：深色炭黑 + 橙色高亮 */
.nav-wrap{background:linear-gradient(90deg,#17181c,#232630 55%,#2c2f3a);box-shadow:0 2px 10px rgba(0,0,0,.22)}
.nav-menu{display:flex;gap:26px;overflow-x:auto}
.nav-menu>a{color:#d9dde6;line-height:46px;font-size:15px;white-space:nowrap;opacity:.95;padding:0 6px;border-radius:6px;transition:color .15s,background .15s}
.nav-menu>a:hover{opacity:1;color:#fff;background:rgba(255,255,255,.10)}
.nav-menu>a.on{opacity:1;color:#fff;font-weight:700;background:linear-gradient(92deg,#ff7a1a,#ff4d1a);box-shadow:0 2px 10px rgba(255,90,31,.35)}
@media (max-width:640px){.hsearch{min-width:0;flex:1;margin-left:10px}}
.layout{padding:18px 0 40px}
.section{background:#fff;border-radius:var(--radius);padding:20px 22px;margin-bottom:16px}
.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.section-title h2{font-size:20px;font-weight:700;margin:0}
.section-title .more{font-size:13px;color:var(--des)}
.section-title .more:hover{color:var(--hover)}
.grid10{display:grid;grid-template-columns:repeat(10,1fr);gap:16px 12px}
.item>a{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;transition:.2s}
.item>a:hover{transform:translateY(-4px)}
.item .ico{width:74px;height:74px;border-radius:16px;object-fit:cover;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.item .t{font-size:13px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.item .d{font-size:12px;color:var(--des);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.rank-li{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}
.rank-li:last-child{border-bottom:0}
.rank-li .ico{width:48px;height:48px;border-radius:11px;object-fit:cover;flex:0 0 auto}
.rank-li .txt{flex:1;min-width:0}
.rank-li .txt h3{margin:0;font-size:14px;font-weight:600;line-height:1.35;
 display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rank-li .txt p{margin:3px 0 0;font-size:12px;color:var(--des)}
.rank-li .go{background:var(--hover);color:#fff;font-size:12px;padding:6px 13px;border-radius:5px;white-space:nowrap}
.doc{background:#fff;border-radius:var(--radius);padding:24px 26px}
.doc h1{margin:0 0 8px;font-size:24px;line-height:1.35}
.doc .meta{color:var(--des);font-size:13px;margin:0 0 16px}
.doc .prose{font-size:15px;line-height:1.85;color:#333}
.doc .prose img{display:block;margin:14px auto;border-radius:12px;max-width:100%;height:auto}
.doc .prose h2{font-size:17px;margin:20px 0 8px}
.doc .prose ul{padding-left:20px;list-style:disc}
.doc .prose li{margin:4px 0}
.crumbs{font-size:13px;color:var(--des);margin:0 0 12px}
.crumbs a:hover{color:var(--hover)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.chips a{background:#fff;border:1px solid var(--line);border-radius:20px;padding:6px 14px;font-size:13px;color:var(--text)}
.chips a:hover{border-color:var(--hover);color:var(--hover)}
.empty{color:var(--des);font-size:14px;padding:20px 0;text-align:center}
.footer{background:#fff;border-top:1px solid var(--line);margin-top:10px;padding:22px 0 28px;text-align:center;color:var(--des);font-size:13px}
.footer a{color:var(--des);margin:0 8px}
.footer a:hover{color:var(--hover)}
@media (max-width:1100px){.grid10{grid-template-columns:repeat(6,1fr)}.cols3{grid-template-columns:1fr}}
@media (max-width:640px){.grid10{grid-template-columns:repeat(4,1fr)}.nav-menu{gap:20px}.logo{font-size:20px}}

/* zq-v3 */
.item .t{min-height:36px}
.item .ph{width:74px;height:74px;border-radius:16px;background:#e8eef7;color:#1D90E2;
 display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800}

/* zq-v4 */
.item .t{min-height:0}
.grid10{gap:18px 12px}

/* zq-v5 */
.sub-head{display:flex;align-items:center;justify-content:space-between;margin:20px 0 8px}
.sub-head h3{margin:0;font-size:16px}
.chips a.on{background:#1D90E2;color:#fff;border-color:#1D90E2}

/* 页面主标题（每个页面一个 h1，利于 SEO 结构） */
.page-h1{font-size:20px;font-weight:800;color:#1c2430;margin:18px 0 14px;padding-left:12px;border-left:4px solid #ff5a1f;line-height:1.35}
@media (max-width:640px){.page-h1{font-size:17px;margin:14px 0 10px}}

/* ============ 手机端：头部布局（logo + 搜索栏）============ */
@media (max-width:768px){
  .top{display:none}                       /* 顶部说明行在手机上省掉 */
  .header{background:#fff}
  .logobar{padding:10px 0;flex-wrap:wrap;gap:8px;justify-content:space-between}
  .logo{font-size:20px;gap:8px;flex:0 0 auto}
  .logo img{width:32px;height:32px;border-radius:9px;box-shadow:0 3px 8px rgba(255,90,31,.22)}
  .hsearch{order:3;flex:1 1 100%;min-width:0;width:100%;margin:8px 0 2px;
           padding:4px 4px 4px 14px;border-radius:20px}
  .hsearch input{font-size:13px;padding:6px 0}
  .hsearch button{padding:7px 16px;font-size:13px;border-radius:16px}
  .nav-menu{gap:16px}
  .nav-menu>a{line-height:42px;font-size:14px;padding:0 2px}
  .container{width:100%;max-width:100%;padding:0 12px}
  .grid10{grid-template-columns:repeat(3,1fr);gap:10px}
  .item .t{font-size:12px}
}
@media (max-width:400px){
  .logo .logo-txt b{display:none}          /* 极窄屏只留 "st" */
  .hsearch button{padding:7px 12px}
  .grid10{grid-template-columns:repeat(2,1fr)}
}
