/* =========================================================
   攻略资料库 · 共享样式（浅白色系 / 大字号 / 高级质感）
   ========================================================= */

:root{
  --bg:#ffffff;
  --bg-soft:#fafafa;
  --bg-tint:#f4f4f6;
  --line:#e9e9ec;
  --line-soft:#f1f1f4;
  --ink:#111114;
  --ink-2:#4e4e57;
  --ink-3:#86868f;
  --ink-4:#b6b6be;

  --wuwa:#2f6bf0;
  --wuwa-soft:#eef3ff;
  --endfield:#c2601f;
  --endfield-soft:#fdf3ec;

  --r:16px;
  --r-sm:10px;
  --sh-1:0 1px 2px rgba(17,17,20,.04);
  --sh-2:0 1px 3px rgba(17,17,20,.05),0 8px 24px rgba(17,17,20,.06);
  --sh-3:0 2px 8px rgba(17,17,20,.06),0 20px 48px rgba(17,17,20,.10);

  --font:-apple-system,BlinkMacSystemFont,"SF Pro SC","PingFang SC","HarmonyOS Sans SC",
         "Microsoft YaHei UI","Microsoft YaHei","Segoe UI",system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono","JetBrains Mono",Consolas,"Courier New",monospace;

  --nav-h:68px;
  --subnav-h:66px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  font-family:var(--font);
  font-size:17px;              /* 基础字号调大，PC 上更清楚 */
  line-height:1.75;
  color:var(--ink-2);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select{font-family:inherit;font-size:inherit}

.wrap{width:min(1200px,90vw);margin:0 auto}
.wrap-narrow{width:min(880px,90vw);margin:0 auto}

/* ================= 顶栏 ================= */
.top{
  position:sticky;top:0;z-index:80;
  height:var(--nav-h);
  background:rgba(255,255,255,.82);
  backdrop-filter:saturate(180%) blur(18px);
  -webkit-backdrop-filter:saturate(180%) blur(18px);
  border-bottom:1px solid var(--line-soft);
}
.top-in{display:flex;align-items:center;gap:28px;height:var(--nav-h)}

.logo{display:flex;align-items:center;gap:11px;font-weight:700;color:var(--ink);font-size:18px;letter-spacing:-.01em}
.logo .mark{
  width:30px;height:30px;border-radius:9px;flex:none;
  background:var(--ink);color:#fff;
  display:grid;place-items:center;font-size:15px;font-weight:700;
}
.logo .sub{font-size:13px;color:var(--ink-4);font-weight:400;letter-spacing:.02em}

.top-nav{display:flex;gap:4px;margin-left:auto;align-items:center}
.top-nav a{
  font-size:16px;color:var(--ink-3);padding:8px 15px;border-radius:999px;
  transition:color .18s,background .18s;white-space:nowrap;
}
.top-nav a:hover{color:var(--ink);background:var(--bg-tint)}
.top-nav a.on{color:var(--ink);font-weight:600;background:var(--bg-tint)}

.back{
  display:inline-flex;align-items:center;gap:7px;
  font-size:15px;color:var(--ink-3);
  padding:8px 14px 8px 10px;border-radius:999px;transition:.18s;
}
.back:hover{color:var(--ink);background:var(--bg-tint)}

/* ================= 动态流光背景（主页） ================= */
.bgfx{
  position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;
  background:var(--bg);
}
.bgfx i{
  position:absolute;display:block;border-radius:50%;
  filter:blur(80px);opacity:.72;
  will-change:transform;
}
.bgfx .f1{
  width:62vw;height:62vw;left:-16vw;top:-20vw;
  background:radial-gradient(circle at 45% 45%,#b6d4ff 0%,rgba(182,212,255,0) 68%);
  animation:fxA 36s ease-in-out infinite alternate;
}
.bgfx .f2{
  width:54vw;height:54vw;right:-14vw;top:2vh;
  background:radial-gradient(circle at 50% 50%,#ffc6e0 0%,rgba(255,198,224,0) 68%);
  animation:fxB 44s ease-in-out infinite alternate;
}
.bgfx .f3{
  width:70vw;height:44vw;left:12vw;bottom:-20vw;
  background:radial-gradient(circle at 50% 50%,#bfeae4 0%,rgba(191,234,228,0) 68%);
  animation:fxC 40s ease-in-out infinite alternate;
}
/* 一道缓慢横扫的光带，增强“流光”感 */
.bgfx .sheen{
  width:46vw;height:170vh;left:-60vw;top:-35vh;border-radius:0;
  filter:blur(60px);opacity:.5;
  background:linear-gradient(100deg,rgba(255,255,255,0) 0%,#e8f1ff 42%,#fdeaf4 58%,rgba(255,255,255,0) 100%);
  animation:sheen 26s linear infinite;
}
@keyframes fxA{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(12vw,9vh,0) scale(1.16)}}
@keyframes fxB{0%{transform:translate3d(0,0,0) scale(1.08)}100%{transform:translate3d(-14vw,12vh,0) scale(.94)}}
@keyframes fxC{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(-10vw,-8vh,0) scale(1.2)}}
@keyframes sheen{0%{transform:translate3d(0,0,0) rotate(6deg)}100%{transform:translate3d(190vw,0,0) rotate(6deg)}}

@media (prefers-reduced-motion:reduce){
  .bgfx i{animation:none!important}
  .bgfx .sheen{opacity:.18}
}

/* ================= 通用排版 ================= */
.kicker{
  display:inline-block;
  font-size:13.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-4);
}
h1,h2,h3,h4{color:var(--ink);font-weight:700;line-height:1.2;letter-spacing:-.02em}

.h-hero{font-size:clamp(44px,6vw,76px);letter-spacing:-.035em;line-height:1.06}
.h-sec{font-size:clamp(28px,3.2vw,40px);letter-spacing:-.028em}
.h-card{font-size:21px;letter-spacing:-.015em}

.lead{font-size:19px;color:var(--ink-2);line-height:1.7}
.muted{color:var(--ink-3)}
.small{font-size:15px}

.rule{height:1px;background:var(--line);border:0;margin:0}

/* ================= 按钮 ================= */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  font-size:16px;font-weight:600;
  padding:13px 26px;border-radius:999px;
  border:1px solid var(--line);
  background:#fff;color:var(--ink);
  transition:transform .18s,box-shadow .18s,background .18s,border-color .18s;
}
.btn:hover{transform:translateY(-1px);box-shadow:var(--sh-2);border-color:var(--ink-4)}
.btn-dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-dark:hover{background:#000;border-color:#000}
.btn-sm{font-size:14.5px;padding:9px 18px}

/* ================= 主页 Hero ================= */
.hero{padding:104px 0 64px;text-align:center}
.hero .lead{margin:26px auto 0;max-width:640px}
.hero-cta{display:flex;gap:12px;justify-content:center;margin-top:38px;flex-wrap:wrap}

/* 游戏选择卡（整块可点） */
.pick{
  display:grid;gap:26px;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  width:min(1200px,90vw);margin:0 auto;
}
.pick-card{
  display:block;overflow:hidden;
  border-radius:24px;border:1px solid var(--line);background:#fff;
  transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s,border-color .3s;
}
.pick-card:hover{transform:translateY(-6px);box-shadow:var(--sh-3);border-color:var(--line)}
.pick-media{aspect-ratio:16/10;overflow:hidden;background:var(--bg-tint);position:relative}
.pick-media img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.3,1)}
.pick-card:hover .pick-media img{transform:scale(1.045)}
.pick-body{padding:30px 34px 34px}
.pick-tag{
  display:inline-block;
  font-size:13px;font-weight:600;letter-spacing:.02em;
  padding:5px 14px;border-radius:999px;
}
.pick-tag.w{background:var(--wuwa-soft);color:var(--wuwa)}
.pick-tag.e{background:var(--endfield-soft);color:var(--endfield)}
.pick-body h2{font-size:clamp(28px,2.6vw,36px);margin-top:18px;letter-spacing:-.03em}
.pick-body .en{font-size:13.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-4);margin-top:8px}
.pick-feats{list-style:none;display:flex;flex-direction:column;gap:9px;margin-top:22px}
.pick-feats li{position:relative;padding-left:22px;font-size:16px;color:var(--ink-3)}
.pick-feats li::before{
  content:"";position:absolute;left:3px;top:12px;
  width:6px;height:6px;border-radius:50%;background:var(--line);
}
.pick-feats li.w::before{background:var(--wuwa);opacity:.55}
.pick-feats li.e::before{background:var(--endfield);opacity:.55}
.pick-go{
  display:inline-flex;align-items:center;gap:11px;margin-top:28px;
  font-size:16.5px;font-weight:600;color:var(--ink);
}
.pick-go .arrow{
  width:34px;height:34px;border-radius:50%;flex:none;
  border:1px solid var(--line);background:#fff;
  display:grid;place-items:center;font-size:15px;color:var(--ink);
  transition:transform .28s,background .28s,color .28s,border-color .28s;
}
.pick-card:hover .pick-go .arrow{transform:translateX(5px);background:var(--ink);color:#fff;border-color:var(--ink)}

/* 待制作卡片：只压低一点饱和度，尺寸与其他卡一致 */
.pick-tag.soon{background:var(--bg-tint);color:var(--ink-3)}

/* ================= 区块 ================= */
.sec{padding:96px 0}
.sec-tint{
  background:rgba(249,249,251,.62);
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}
.sec-head{margin-bottom:44px;max-width:720px}
.sec-head .kicker{margin-bottom:16px}
.sec-head p{margin-top:18px;font-size:17.5px;color:var(--ink-3)}

/* ================= 通用卡片 ================= */
.grid{display:grid;gap:22px}
.g2{grid-template-columns:repeat(auto-fit,minmax(360px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}

.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);
  padding:30px;transition:transform .22s,box-shadow .22s,border-color .22s;
}
.card:hover{transform:translateY(-3px);box-shadow:var(--sh-2);border-color:var(--line)}
.card h3{font-size:19px;margin-bottom:12px}
.card p{font-size:16px;color:var(--ink-3)}

.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px 30px}
.stat b{display:block;font-size:44px;font-weight:700;color:var(--ink);letter-spacing:-.03em;line-height:1.1}
.stat span{display:block;font-size:15px;color:var(--ink-3);margin-top:8px}

/* 链接列表 */
.lnk-list{display:flex;flex-direction:column;gap:2px}
.lnk{
  display:flex;align-items:center;gap:14px;
  padding:15px 18px;border-radius:var(--r-sm);
  font-size:16.5px;color:var(--ink-2);
  transition:background .18s,color .18s;
}
.lnk:hover{background:var(--bg-tint);color:var(--ink)}
.lnk .badge{
  flex:none;font-size:12px;font-weight:600;letter-spacing:.04em;
  padding:3px 10px;border-radius:6px;background:var(--bg-tint);color:var(--ink-3);
}
.lnk:hover .badge{background:#fff}
.lnk .badge.official{background:#fef4e4;color:#a8701a}
.lnk .badge.wiki{background:#eaf6f6;color:#1d7d7d}
.lnk .badge.guide{background:#f0edfd;color:#5b48b8}
.lnk .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lnk .go{flex:none;color:var(--ink-4);font-size:14px;opacity:0;transition:opacity .18s}
.lnk:hover .go{opacity:1}

/* ================= 游戏页 Hero ================= */
.g-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line-soft)}
.g-hero-media{position:absolute;inset:0}
.g-hero-media img{width:100%;height:100%;object-fit:cover}
.g-hero-media::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(8,10,16,.16) 0%,rgba(8,10,16,0) 28%,rgba(8,10,16,.84) 100%),
    linear-gradient(100deg,rgba(8,10,16,.86) 0%,rgba(8,10,16,.58) 45%,rgba(8,10,16,.20) 100%);
}
.g-hero-in{position:relative;z-index:2;padding:88px 0 76px;color:#fff}
.g-hero-in h1{color:#fff;font-size:clamp(38px,5vw,64px);letter-spacing:-.035em}
.g-hero-in .kicker{color:rgba(255,255,255,.72)}
.g-hero-in p{color:rgba(255,255,255,.86);font-size:18px;margin-top:20px;max-width:620px}
.g-hero-stats{display:flex;gap:44px;margin-top:38px;flex-wrap:wrap}
.g-hero-stats b{display:block;font-size:32px;font-weight:700;color:#fff;letter-spacing:-.02em}
.g-hero-stats span{font-size:14.5px;color:rgba(255,255,255,.66)}

/* 页内导航 */
.subnav{
  position:sticky;top:var(--nav-h);z-index:70;
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--line-soft);
}
.subnav-in{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:10px 0}
.subnav-in::-webkit-scrollbar{display:none}
.subnav a{
  flex:none;font-size:15.5px;color:var(--ink-3);
  padding:9px 17px;border-radius:999px;transition:.18s;white-space:nowrap;
}
.subnav a:hover{color:var(--ink);background:var(--bg-tint)}
.subnav a.on{color:#fff;background:var(--ink);font-weight:600}

/* ================= 数据工具条 =================
   跟随页面滚动吸附在页内导航下方，避免每次搜索都要滚回顶部 */
.toolbar{
  position:sticky;
  top:calc(var(--nav-h) + var(--subnav-h));
  z-index:55;
  display:flex;gap:14px;align-items:center;flex-wrap:wrap;
  margin-bottom:28px;padding:16px 18px;
  background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  backdrop-filter:saturate(180%) blur(14px);
  border:1px solid var(--line);border-radius:var(--r);
  box-shadow:0 10px 26px rgba(17,17,20,.07);
}
.field{
  display:flex;align-items:center;gap:10px;flex:1;min-width:240px;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);
  padding:9px 15px;transition:border-color .18s,box-shadow .18s;
}
.field:focus-within{border-color:var(--ink-3);box-shadow:0 0 0 3px rgba(17,17,20,.05)}
.field svg{flex:none;color:var(--ink-4)}
.field input{flex:1;border:0;outline:0;background:none;font-size:16px;color:var(--ink)}
.field input::placeholder{color:var(--ink-4)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chipbtn{
  cursor:pointer;font-size:14.5px;color:var(--ink-3);
  background:#fff;border:1px solid var(--line);border-radius:999px;
  padding:7px 16px;transition:.16s;
}
.chipbtn:hover{color:var(--ink);border-color:var(--ink-4)}
.chipbtn.on{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:600}
.count{font-size:14.5px;color:var(--ink-4);margin-left:auto;white-space:nowrap}

/* ================= 数据卡片 ================= */
.dgrid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.dcard{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);
  padding:24px;transition:transform .2s,box-shadow .2s;
  display:flex;flex-direction:column;
}
.dcard:hover{transform:translateY(-2px);box-shadow:var(--sh-2)}
.dcard-h{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}
.avatar{
  width:56px;height:56px;flex:none;border-radius:14px;
  display:grid;place-items:center;overflow:hidden;
  font-size:19px;font-weight:700;color:#fff;
  background:var(--ink);
}
.avatar.w{background:var(--wuwa)}
.avatar.e{background:var(--endfield)}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.avatar.has-img{background:var(--bg-tint)}
.avatar.has-img img{object-fit:cover;padding:0}
.avatar.bare{background:transparent}
.avatar.bare img{object-fit:contain;padding:2px}
.dcard-h .nm{min-width:0;flex:1}
.dcard-h h3{font-size:18.5px;letter-spacing:-.01em;line-height:1.3}
.dcard-h .en{font-size:13px;color:var(--ink-4);letter-spacing:.03em;margin-top:3px}
.pill{
  flex:none;font-size:12.5px;font-weight:600;
  padding:3px 10px;border-radius:6px;background:var(--bg-tint);color:var(--ink-2);
}
.pill.r6{background:#fdf2dd;color:#96601a}
.pill.r5{background:#eef0f6;color:#4d5570}
.pill.r4{background:#f0f4ff;color:#4560a8}
.pill.r3{background:#f4f4f6;color:#7a7a85}

.tagrow{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px}
.tag{
  font-size:13px;color:var(--ink-3);
  background:var(--bg-tint);border-radius:6px;padding:3px 10px;
}
.kv{display:flex;gap:12px;padding:9px 0;border-top:1px solid var(--line-soft);font-size:15.5px}
.kv:first-of-type{border-top:0}
.kv .k{flex:none;width:82px;color:var(--ink-4);font-size:14.5px}
.kv .v{flex:1;color:var(--ink-2)}
.kv .v em{font-style:normal;color:var(--ink);font-weight:600}

.note{
  margin-top:14px;padding:12px 14px;border-radius:var(--r-sm);
  background:var(--bg-soft);font-size:15px;color:var(--ink-3);
  white-space:pre-line;
}
.eff{font-size:15.5px;color:var(--ink-2);white-space:pre-line}
.dcard .src{margin-top:auto;padding-top:14px;font-size:13px;color:var(--ink-4)}

/* 声骸套装小块 */
.setlist{display:flex;flex-direction:column;gap:8px;margin:4px 0 14px}
.setitem{background:var(--bg-soft);border-radius:var(--r-sm);padding:12px 14px}
.setitem .sh{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.setitem i{font-style:normal;font-size:13px;font-weight:600;color:var(--wuwa);flex:none}
.setitem b{color:var(--ink);font-weight:600;font-size:16px}
.setitem span{display:block;margin-top:6px;font-size:14.5px;color:var(--ink-3);line-height:1.65}
.setitem.e i{color:var(--endfield)}
/* 武器推荐的名字换一个安静点的颜色，不要纯黑 */
.setitem.e.w .sh b{color:#3d5171}
.setitem.e.w .sh b:hover{color:#2f425f}

/* ================= 基建 ================= */
.baseitem{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);
  padding:30px;margin-bottom:20px;
}
.baseitem-h{display:flex;gap:16px;align-items:baseline;margin-bottom:14px;flex-wrap:wrap}
.baseitem-h .no{
  font-size:14px;font-weight:700;color:var(--endfield);
  background:var(--endfield-soft);border-radius:8px;padding:4px 12px;flex:none;
}
.baseitem-h h3{font-size:22px}
.pts{list-style:none;display:flex;flex-direction:column;gap:9px;margin:18px 0 0}
.pts li{position:relative;padding-left:24px;font-size:16.5px;color:var(--ink-2)}
.pts li::before{
  content:"";position:absolute;left:6px;top:11px;
  width:6px;height:6px;border-radius:50%;background:var(--endfield);opacity:.55;
}
.vids{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-top:22px}
.vid{
  display:block;border:1px solid var(--line);border-radius:var(--r-sm);
  padding:18px 18px 16px;transition:.2s;background:#fff;
}
.vid:hover{border-color:var(--ink-4);box-shadow:var(--sh-1);transform:translateY(-2px)}
.vid .up{font-size:13.5px;color:var(--endfield);font-weight:600;margin-bottom:8px}
.vid .vt{font-size:16px;color:var(--ink);line-height:1.5;margin-bottom:10px}
.vid .bvid{font-size:12.5px;color:var(--ink-4);font-family:var(--mono)}

/* ================= 选项卡 ================= */
.tabs{display:inline-flex;gap:4px;background:var(--bg-tint);border-radius:999px;padding:5px;margin-bottom:26px}
.tabs button{
  font-family:inherit;border:0;background:none;cursor:pointer;
  font-size:15.5px;color:var(--ink-3);padding:9px 22px;border-radius:999px;transition:.18s;
}
.tabs button:hover{color:var(--ink)}
.tabs button.on{background:#fff;color:var(--ink);font-weight:600;box-shadow:var(--sh-1)}

/* ================= 精锻面板 ================= */
.forge-note{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px 30px;margin-bottom:20px}
.forge-note h3{font-size:19px;margin-bottom:12px}
.forge-note p{font-size:16px;color:var(--ink-2)}
.forge-list{list-style:none;counter-reset:fg;display:flex;flex-direction:column;gap:11px;margin-top:18px}
.forge-list li{counter-increment:fg;position:relative;padding-left:36px;font-size:15.5px;color:var(--ink-2);line-height:1.75}
.forge-list li::before{
  content:counter(fg);position:absolute;left:0;top:4px;
  width:23px;height:23px;border-radius:50%;background:var(--bg-tint);
  display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--ink-2);
}
.forge-attr{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 30px;margin-bottom:18px}
.forge-attr-h{display:flex;align-items:baseline;gap:14px;margin-bottom:14px;flex-wrap:wrap}
.forge-attr-h h3{font-size:21px}
.forge-attr-h .fl{font-size:14px;color:var(--ink-4)}
.forge-attr .sum{font-size:15.5px;color:var(--ink-3);margin-bottom:8px}
.forge-pick{border-top:1px solid var(--line-soft);padding:15px 0;display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.forge-pick .fp-slot{
  flex:none;height:fit-content;font-size:13px;font-weight:600;color:var(--ink-3);
  background:var(--bg-tint);border-radius:6px;padding:3px 11px;
}
.forge-pick .fp-body{flex:1;min-width:260px}
.forge-pick .fp-gear{font-size:16.5px;font-weight:600;color:var(--ink);margin-bottom:5px}
.forge-pick .fp-refine{font-size:15.5px;color:var(--ink-2)}
.forge-pick .fp-reason{font-size:14.5px;color:var(--ink-3);margin-top:7px}

/* ================= 基建分组 ================= */
.basegroup{margin-bottom:46px}
.basegroup-h{display:flex;align-items:baseline;gap:14px;margin-bottom:10px;flex-wrap:wrap}
.basegroup-h h3{font-size:25px;letter-spacing:-.025em}
.basegroup-h .gtag{
  font-size:13px;font-weight:600;color:var(--endfield);
  background:var(--endfield-soft);border-radius:999px;padding:4px 14px;
}
.basegroup > p{font-size:16px;color:var(--ink-3);margin-bottom:24px;max-width:840px}
.seq{
  flex:none;font-size:13.5px;font-weight:600;color:var(--endfield);
  background:var(--endfield-soft);border-radius:6px;padding:3px 11px;
}

/* ================= 空状态 / 页脚 ================= */
.empty{padding:70px 0;text-align:center;color:var(--ink-3);font-size:17px}
.empty b{color:var(--ink);font-weight:600}

.foot{border-top:1px solid var(--line-soft);background:rgba(249,249,251,.7);padding:56px 0 64px}
.foot-in{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap}
.foot p{font-size:15px;color:var(--ink-4);line-height:2}
.foot b{color:var(--ink-2);font-weight:600;display:block;font-size:16px;margin-bottom:10px}

/* ================= 卡片出现动效 =================
   用 IntersectionObserver 反复触发：进入视口时淡入上浮，
   离开视口后复位，因此上下滚动都能重复看到动效。 */
.rise{
  opacity:0;
  transform:translateY(20px);
  transition:opacity .62s cubic-bezier(.22,.68,.3,1),
             transform .62s cubic-bezier(.22,.68,.3,1);
}
.rise.in{opacity:1;transform:translateY(0)}
/* 已经滚过去的区块不再复位，避免向上滚动时内容突然消失 */
.rise.in{will-change:auto}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .rise{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ================= 武器 & 装备：属性分行 ================= */
.statrows{display:flex;flex-direction:column;gap:8px;margin:6px 0 14px}
.srow{display:flex;gap:12px;align-items:baseline;background:var(--bg-soft);border-radius:var(--r-sm);padding:10px 14px}
.srow .sk{flex:none;width:72px;font-size:13.5px;font-weight:600;color:var(--ink-4)}
.srow .sv{flex:1;min-width:0;font-size:15.5px;color:var(--ink-2);line-height:1.6}
.srow .sv b{color:var(--ink);font-weight:600}
.srow .sv em{font-style:normal;color:var(--ink-4);font-size:14px}
.skillbox{margin:0 0 14px;padding:14px 16px;border:1px solid var(--line-soft);border-radius:var(--r-sm)}
.skillbox .skh{font-size:15px;font-weight:600;color:var(--ink);margin-bottom:8px}
.skillbox .ske{font-size:14.5px;color:var(--ink-2);line-height:1.75;white-space:pre-line}
.skillbox .skm{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line-soft);font-size:13.5px;color:var(--ink-4);line-height:1.7;white-space:pre-line}
.skillbox .skm b{color:var(--ink-3);font-weight:600}
.skillbox details{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line-soft)}
.skillbox summary{font-size:13.5px;font-weight:600;color:var(--ink-4);cursor:pointer}
.skillbox summary:hover{color:var(--ink-3)}
.skillbox details .skm{margin-top:0;padding-top:8px;border-top:0}

/* ================= 精锻查询工具 ================= */
.ft{display:grid;grid-template-columns:288px minmax(0,1fr);gap:26px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px 28px}
.ft-picks{display:flex;flex-direction:column;gap:12px;min-width:0}
.ft-picks .fl{font-size:13.5px;font-weight:600;color:var(--ink-4)}
.ft-picks select{width:100%;font-size:15.5px;font-family:inherit;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);padding:11px 12px}
.ft-picks select:focus{outline:0;border-color:var(--ink-3)}
.ft-hint{font-size:13.5px;color:var(--ink-4);line-height:1.7}
.ft-out{min-width:0}
.ft-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--line)}
.ft-head h3{font-size:21px}
.ft-head .meta{font-size:14px;color:var(--ink-4)}
.ft-set{margin-top:12px;font-size:14.5px;color:var(--ink-3);line-height:1.7}
.ft-match{padding:16px 0;border-bottom:1px solid var(--line-soft)}
.ft-match:last-child{border-bottom:0;padding-bottom:0}
.ft-mh{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.ft-mh .k{font-size:13.5px;font-weight:600;color:var(--ink-4)}
.ft-mh .t{font-size:16px;font-weight:600;color:var(--ink)}
.ft-mh .tv{font-size:15px;color:var(--ink-3)}
.ft-best{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;background:#f2f6f2;border:1px solid #dbe7db;border-radius:var(--r-sm);padding:12px 14px}
.ft-best .nm{font-size:16px;font-weight:600;color:var(--ink)}
.ft-best .vv{font-size:15px;color:var(--ink-2)}
.ft-best .up{font-size:13.5px;color:#3f7a4a}
.ft-best .st{font-size:13.5px;color:var(--ink-4)}
.ft-none{background:var(--bg-soft);border-radius:var(--r-sm);padding:12px 14px;font-size:14.5px;color:var(--ink-3);line-height:1.7}
.ft-cands{margin-top:10px;display:flex;flex-direction:column;gap:7px}
.ft-cand{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-size:14.5px}
.ft-cand .nm{color:var(--ink-2)}
.ft-cand .vv{color:var(--ink-3);font-size:14px}
.ft-cand .st{color:var(--ink-4);font-size:13.5px}
.ft-more{margin-top:11px;background:none;border:0;font-family:inherit;font-size:14px;color:var(--ink-4);cursor:pointer;text-decoration:underline;padding:0}
.ft-more:hover{color:var(--ink-2)}
.ft-legend{margin-top:18px;padding-top:14px;border-top:1px solid var(--line-soft);font-size:14px;color:var(--ink-4);line-height:1.85}
.ft .ft-legend{grid-column:1/-1;margin-top:4px}

/* ================= 响应式 ================= */
@media (max-width:1000px){
  .pick-card,.pick-body{min-height:340px}
  .ft{grid-template-columns:1fr;gap:20px;padding:22px 20px}
}
@media (max-width:760px){
  :root{--nav-h:60px;--subnav-h:58px}
  body{font-size:16px}
  .wrap{width:92vw}
  .hero{padding:64px 0 40px}
  .sec{padding:64px 0}
  .top-nav a{padding:8px 11px;font-size:15px}
  .logo .sub{display:none}
  .pick-body{padding:26px}
  .dgrid{grid-template-columns:1fr}
  .g4{grid-template-columns:1fr 1fr}
  .g-hero-in{padding:60px 0 52px}
  .g-hero-stats{gap:28px}
}