/* bx35.com by.shenbaoxin
   废土机械 HUD · 全 DOM overlay（不占 canvas 性能）
   布局：左下玩家状态(血条缩小组件) ｜ 顶部精英条 ｜ 右上小地图 ｜ 左上战报 ｜ 底部技能栏(抬高避开血条) */
#ws-hud{ position:fixed; inset:0; pointer-events:none; z-index:10; user-select:none;
  transform:translateZ(0); /* 独立合成层：避免 HUD/canvas 重合成时整屏白闪一帧 */
  font-family:"Bahnschrift","Segoe UI","Microsoft YaHei",Arial,sans-serif; }
/* 需要鼠标交互的 HUD 元素显式开启（升级选卡/结算按钮等） */
#ws-hud .upwrap, #ws-hud .overlay{ pointer-events:auto; }
#ws-hud #u-boosts{ pointer-events:auto; }   /* 技能栏可点（手机端专属技/冲刺格）：容器默认 none 需单独放开 */

/* ---------- 左下角：玩家状态 ---------- */
#ws-hud .pstat{ position:absolute; left:20px; bottom:24px; display:flex; align-items:center; gap:10px; }
#ws-hud .lvbadge{ flex:0 0 auto; width:46px; height:46px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:linear-gradient(180deg,#4a3b22 0%,#2c2214 60%,#241b0f 100%);
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  border:1px solid #c98f2a; box-shadow:inset 0 2px 0 rgba(255,255,255,.08), inset 0 -8px 14px rgba(0,0,0,.55), 0 6px 14px rgba(0,0,0,.5); }
#ws-hud .lvbadge b{ font-size:18px; line-height:1; font-weight:800; color:#ffd75e; text-shadow:0 2px 4px #000; }
#ws-hud .lvbadge small{ font-size:9px; letter-spacing:2px; color:#a98d55; font-weight:700; margin-top:2px; }
#ws-hud .statbar{ width:clamp(150px, 17vw, 260px); }
#ws-hud .statbar .tag{ font-size:11px; font-weight:700; letter-spacing:3px; color:#b98a4f; margin-bottom:4px; display:flex; justify-content:space-between; }
#ws-hud .statbar .tag em{ font-style:normal; color:#ffe9b0; letter-spacing:1px; font-weight:800; }
#ws-hud .hptrack{ position:relative; height:17px; background:linear-gradient(180deg,#120b07,#1d140d); border:1px solid #4a463c;
  box-shadow:inset 0 3px 6px rgba(0,0,0,.75), 0 2px 0 rgba(255,255,255,.04), 0 6px 12px rgba(0,0,0,.45); overflow:hidden; }
#ws-hud .hpfill{ position:absolute; top:0; left:0; bottom:0; width:100%; background:
  linear-gradient(90deg,#c9781f 0%,#e8a33d 55%,#ffd75e 100%);
  box-shadow:0 0 12px rgba(232,163,61,.55); transition:width .12s ease-out; }
#ws-hud .hpfill::after{ content:""; position:absolute; top:0; left:0; right:0; height:5px; background:rgba(255,255,255,.32); }
#ws-hud .hpfill.low{ background:linear-gradient(90deg,#8e1f14,#c0392b 55%,#ff5d5d); box-shadow:0 0 14px rgba(255,93,93,.6); animation:hudblink 1s steps(2) infinite; }
@keyframes hudblink{ 50%{ opacity:.6; } }
/* 受击血条跳抖：hp 下降瞬间抖一下 */
#ws-hud .hpfill.hit{ animation:hpjump .32s ease-out; }
@keyframes hpjump{ 0%{ transform:scale(1); } 25%{ transform:scale(1.08,1.35); transform-origin:left center; filter:brightness(1.35); } 60%{ transform:scale(.98,1); } 100%{ transform:scale(1); } }
#ws-hud .hpseg{ position:absolute; inset:0; margin:0; display:flex; }
#ws-hud .hpseg i{ flex:1; border-right:1px solid rgba(0,0,0,.28); }
#ws-hud .hpseg i:last-child{ border-right:none; }
#ws-hud .hpval{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:800; color:#fff3d6; text-shadow:0 1px 3px #000, 0 0 6px rgba(0,0,0,.6); letter-spacing:1px; }
#ws-hud .xptrack{ margin-top:7px; height:5px; background:#151007; border:1px solid #37342c; overflow:hidden;
  box-shadow:inset 0 2px 4px rgba(0,0,0,.7); position:relative; }
#ws-hud .xpfill{ position:absolute; top:0; left:0; bottom:0; width:35%; background:linear-gradient(90deg,#18979c,#39c2c8);
  box-shadow:0 0 8px rgba(57,194,200,.7); transition:width .15s ease-out; }
#ws-hud .xptext{ position:absolute; inset:0; font-size:9px; line-height:5px; text-align:right; color:#9fe6e8; padding-right:4px; font-weight:700; }

/* ---------- 顶部中央：精英怪血条（无精英时隐藏） ---------- */
#ws-hud .eboss{ position:absolute; top:22px; left:50%; transform:translateX(-50%); width:500px; display:none; }
#ws-hud .eboss.show{ display:block; animation:huddrop .25s ease-out; }
@keyframes huddrop{ from{ transform:translateX(-50%) translateY(-14px); opacity:0; } to{ transform:translateX(-50%) translateY(0); opacity:1; } }
#ws-hud .eboss .ename{ font-size:13px; font-weight:800; letter-spacing:4px; color:#ffb45e; text-shadow:0 2px 6px rgba(0,0,0,.8); margin-left:6px; }
#ws-hud .eboss .etrack{ margin-top:6px; position:relative; height:14px; background:#160c07; border:1px solid #6b4630;
  box-shadow:inset 0 2px 5px rgba(0,0,0,.8), 0 4px 12px rgba(0,0,0,.4); overflow:hidden; }
#ws-hud .eboss .efill{ position:absolute; top:0; left:0; bottom:0; width:100%; background:
  linear-gradient(90deg,#8d2d16 0%,#c6492a 55%,#ff8a5e 100%); box-shadow:0 0 12px rgba(198,73,42,.55); transition:width .12s ease-out; }
/* Boss 阶段变色：P2 橙紫 / P3 狂暴紫红 */
#ws-hud .eboss .efill.p2{ background:linear-gradient(90deg,#7a3d10 0%,#c67a2a 55%,#ffbe5e 100%); box-shadow:0 0 12px rgba(198,122,42,.6); }
#ws-hud .eboss .efill.p3{ background:linear-gradient(90deg,#5c1058 0%,#a1268a 55%,#ff5ee0 100%); box-shadow:0 0 14px rgba(161,38,138,.7); animation:bossrage .5s ease-in-out infinite alternate; }
@keyframes bossrage{ from{ filter:brightness(.92); } to{ filter:brightness(1.18); } }
#ws-hud .eboss .efill::after{ content:""; position:absolute; top:0; left:0; right:0; height:4px; background:rgba(255,255,255,.25); }
#ws-hud .eboss .eval{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:800; color:#ffead6; text-shadow:0 1px 3px #000; }

/* ---------- 右上角：小地图 ---------- */
#ws-hud .minimap{ position:absolute; top:18px; right:18px; width:clamp(96px, 15vw, 132px); height:clamp(96px, 15vw, 132px);
  background:rgba(10,11,12,.72); border:1px solid #55503c; padding:3px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04), inset 0 0 18px rgba(0,0,0,.5), 0 6px 16px rgba(0,0,0,.45); }
#ws-hud .minimap canvas{ width:100%; height:100%; display:block; }
#ws-hud .minimap::after{ content:""; position:absolute; inset:3px; pointer-events:none;
  background:repeating-linear-gradient(0deg, transparent 0 4px, rgba(255,255,255,.03) 4px 5px); }

/* ---------- 顶部左上：战报 ---------- */
@media (max-width:820px){
  #ws-hud .pstat{ transform:scale(.78); transform-origin:bottom left; }
  #ws-hud .report{ top:14px; left:14px; padding:7px 10px; font-size:12px; }
  #ws-hud .minimap{ top:12px; right:12px; }
}
@media (max-width:680px){
  #ws-hud .pstat{ transform:scale(.72); transform-origin:bottom left; }
  #ws-hud .skills{ bottom:10px; }
  #ws-hud .report{ top:10px; left:10px; min-width:0; font-size:11px; }
  #ws-hud .minimap{ width:clamp(84px, 19vw, 108px); height:clamp(84px, 19vw, 108px); top:10px; right:10px; }
}
/* 极窄（手机竖屏）：战报隐藏，血条挪左上，技能栏只留图标，杜绝冲突 */
@media (max-width:560px){
  #ws-hud .report{ display:none; }
  #ws-hud .pstat{ left:6px; top:6px; bottom:auto; gap:6px; }
  #ws-hud .lvbadge{ width:34px; height:34px; }
  #ws-hud .lvbadge b{ font-size:14px; }
  #ws-hud .statbar{ width:min(54vw, 220px); }
  #ws-hud .statbar .tag{ display:none; }
  #ws-hud .hpval{ font-size:9px; }
  #ws-hud .skills{ bottom:6px; gap:4px; transform:none; }
  #ws-hud .boost{ min-width:36px; height:46px; font-size:14px; }
  #ws-hud .boost small{ display:none; }
  #ws-hud .minimap{ top:6px; right:6px; width:clamp(72px,19vw,94px); height:clamp(72px,19vw,94px); }
  #ws-hud .eboss{ top:130px; width:min(90vw,380px); }
  #ws-hud .overlay .go-title{ font-size:40px; letter-spacing:8px; }
}
#ws-hud .report{ position:absolute; top:20px; left:24px; min-width:150px;
  background:linear-gradient(180deg, rgba(16,17,19,.82), rgba(10,11,12,.82));
  border:1px solid #3a3f46; border-left:3px solid #c98f2a; padding:9px 13px;
  box-shadow:0 4px 14px rgba(0,0,0,.4); }
#ws-hud .report .row{ display:flex; justify-content:space-between; font-size:13px; line-height:1.85; color:#aeb4bc; font-weight:700; }
#ws-hud .report .row b{ color:#ffd75e; font-weight:800; }

/* ---------- 底部中央：当前加成槽（三选一强化汇总，单行不换行） ---------- */
/* v73g：max-width 给左右各留 ≥360px——78vw 居中时左缘仅 11vw≈200px，会压住左下 pstat 状态栏 */
#ws-hud .skills{ position:absolute; left:50%; bottom:20px; transform:translateX(-50%);
  display:flex; gap:6px; justify-content:center; flex-wrap:nowrap; max-width:min(70vw, calc(100vw - 720px)); overflow:hidden; }
@media (max-width:900px){
  /* 小屏：pstat 移到左上，底部整行可用 */
  #ws-hud .skills{ max-width:96vw; bottom:12px; }
}
/* v73g：格子等宽收缩（长文字撑宽格子导致整排过宽压状态栏）——固定 56px，文字超长截断 */
#ws-hud .skills .boost{ flex:0 1 56px; min-width:0; width:56px; padding-left:4px; padding-right:4px; overflow:hidden; box-sizing:border-box; }
#ws-hud .skills .boost small{ max-width:48px; overflow:hidden; white-space:nowrap; }
#ws-hud .boost{ min-width:46px; height:46px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-size:17px; color:#ffd75e; text-shadow:0 1px 3px #000, 0 0 10px rgba(255,215,94,.5);
  background:linear-gradient(160deg, #33281a 0%, #221a0f 55%, #16110a 100%);
  border:1px solid #5d5238; border-top:2px solid #b98d3a;
  box-shadow:inset 0 -8px 12px rgba(0,0,0,.5), inset 0 0 12px rgba(232,184,78,.07), 0 5px 12px rgba(0,0,0,.45);
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
#ws-hud .boost:hover{ transform:translateY(-4px); border-color:#e8b84e;
  box-shadow:inset 0 -10px 16px rgba(0,0,0,.5), inset 0 0 20px rgba(232,184,78,.16), 0 0 22px rgba(240,201,104,.4), 0 8px 16px rgba(0,0,0,.5); }
#ws-hud .boost small{ margin-top:3px; font-size:10px; letter-spacing:1px; color:#ffe9b0; font-weight:700; text-shadow:0 1px 2px #000; }
/* 冲刺格（内容2.6）：冷却中灰蓝、就绪青绿 */
#ws-hud .boost.dashcd{ color:#8fa3b8; text-shadow:0 1px 3px #000; filter:saturate(.3) brightness(.75); }
#ws-hud .boost.dashcd small{ color:#a8bccf; }
#ws-hud .boost.dashrdy{ color:#9fe6d8; border-color:#3a7a6e; border-top-color:#5ecfb8;
  text-shadow:0 1px 3px #000, 0 0 10px rgba(94,207,184,.55); }
#ws-hud .boost.dashrdy small{ color:#c2f5e8; }

/* ---------- 暂停指示层 ---------- */
#ws-hud .pauselab{ position:absolute; inset:0; display:none; place-items:center; z-index:15; pointer-events:none; }
#ws-hud .pauselab.show{ display:grid; }
#ws-hud .pa-box{ text-align:center; padding:22px 44px;
  background:rgba(10,11,12,.78); border:1px solid #6b5a33; box-shadow:0 24px 60px rgba(0,0,0,.6); }
#ws-hud .pa-title{ font-size:36px; font-weight:900; letter-spacing:12px; color:#ffd75e;
  text-shadow:0 2px 10px rgba(0,0,0,.7); }
#ws-hud .pa-hint{ margin-top:12px; font-size:12px; color:#b9a98a; letter-spacing:3px; }
/* v72 撤离结算按钮（暂停菜单内） */
#ws-hud .pa-evac{ display:block; margin:18px auto 0; padding:9px 22px; cursor:pointer;
  font:600 13px/1 var(--f,system-ui); letter-spacing:2px; color:#ffe9b0;
  background:rgba(38,30,12,.9); border:1px solid #d69e2e; border-radius:4px;
  pointer-events:auto; transition:background .15s, transform .1s; }
#ws-hud .pa-evac:hover{ background:rgba(214,158,46,.28); transform:translateY(-1px); }
/* ---------- v73 爬塔模式 ---------- */
/* 主菜单模式选择（选存档卡+职业后出现） */
#ws-hud .wm-modes{ display:none; gap:12px; justify-content:center; margin:14px 0 4px; }
#ws-hud .wm-modes.show{ display:flex; }
#ws-hud .wm-mode{ flex:1; max-width:190px; padding:12px 10px; cursor:pointer; display:flex; flex-direction:column; gap:5px; align-items:center;
  font:900 16px/1.2 var(--f,system-ui); color:#ffe9b0; background:rgba(24,20,10,.9); border:1px solid #6b5a33; border-radius:6px;
  transition:border-color .15s, background .15s, transform .1s; }
#ws-hud .wm-mode small{ font:600 12px/1.3 var(--f,system-ui); color:#d6c49e; letter-spacing:1px; }
#ws-hud .wm-mode:hover{ border-color:#d69e2e; background:rgba(56,42,16,.9); transform:translateY(-2px); }
#ws-hud .wm-mode.mode-tower{ border-color:#3e6b7a; }
#ws-hud .wm-mode.mode-tower:hover{ border-color:#5ee7ff; background:rgba(16,38,44,.9); }
/* 战报休整区撤离按钮 */
#ws-hud .rest-evac{ display:none; margin-top:8px; padding:6px 12px; cursor:pointer; width:100%;
  font:700 12px/1 var(--f,system-ui); letter-spacing:1px; color:#7dffa0;
  background:rgba(10,26,14,.9); border:1px solid rgba(125,255,160,.55); border-radius:4px;
  pointer-events:auto; transition:background .15s; }
#ws-hud .rest-evac:hover{ background:rgba(125,255,160,.18); }
/* 路径三选一卡（紫金边框，区别于普通/觉醒卡） */
#ws-hud .upcard.pathcard{ border-color:#b06ee0; box-shadow:0 0 18px rgba(176,110,224,.4), inset 0 0 24px rgba(176,110,224,.12); }
/* v73e L1 质变词条卡（青紫色，区别路径紫金/觉醒金） */
#ws-hud .upcard.mutcard{ border-color:#5ee7d0; box-shadow:0 0 18px rgba(94,231,208,.4), inset 0 0 24px rgba(94,231,208,.12); }
#ws-hud .upcard.mutcard .nm{ color:#9ff5e6; }
#ws-hud .upcard.mutcard .rk{ color:#5ee7d0; }

/* ---------- 连击 Combo 花字（右侧中部）档位：绿→蓝→紫→金 ---------- */
#ws-hud .combolab{ position:absolute; right:34px; top:42%; display:none; text-align:center; pointer-events:none; }
#ws-hud .combolab.show{ display:block; }
/* 默认档（×3~9）：翠绿 */
#ws-hud .combolab b{ display:block; font-size:84px; line-height:.95; font-weight:900; font-style:italic;
  letter-spacing:-2px; transform:skewX(-6deg); padding-right:.14em;   /* 右侧渐变缓冲：斜体字形不出背景盒（修"6被切平"） */
  background:linear-gradient(178deg,#eafff0 6%,#8affa0 36%,#2ecc5e 66%,#0f8a38 96%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 0 24px rgba(70,230,120,.6));   /* 只留柔光，去硬投影（避免描边框感） */
  transition:filter .25s; }
#ws-hud .combolab small{ display:block; margin-top:4px; font-size:13px; font-weight:900; font-style:italic;
  letter-spacing:7px; color:#8affa0; text-shadow:0 0 12px rgba(90,240,140,.8); }
/* 档位进阶：10+ 蓝 / 30+ 紫 / 60+ 金（small 只换字色，绝不设 background——否则文字糊成色块） */
#ws-hud .combolab.t1 b{ background:linear-gradient(178deg,#f4fbff 8%,#a8e4ff 40%,#3fa9ff 74%,#1160b8 98%);
  -webkit-background-clip:text; background-clip:text;
  filter:drop-shadow(0 0 24px rgba(80,190,255,.65)); }
#ws-hud .combolab.t1 small{ color:#a8e4ff; text-shadow:0 0 12px rgba(120,210,255,.9); }
#ws-hud .combolab.t2 b{ background:linear-gradient(178deg,#fbf3ff 6%,#e2a8ff 38%,#a44dff 70%,#5c1ea8 98%);
  -webkit-background-clip:text; background-clip:text;
  filter:drop-shadow(0 0 28px rgba(190,90,255,.75)); }
#ws-hud .combolab.t2 small{ color:#e2a8ff; text-shadow:0 0 14px rgba(200,120,255,.95); }
#ws-hud .combolab.t3 b{ background:linear-gradient(178deg,#fff8dc 6%,#ffd75e 34%,#ff9d2e 62%,#c96a12 96%);
  -webkit-background-clip:text; background-clip:text;
  filter:drop-shadow(0 0 32px rgba(255,180,50,.85)); }
#ws-hud .combolab.t3 small{ color:#ffd75e; text-shadow:0 0 14px rgba(255,190,70,.95); }
/* 击杀跳动 punch */
@keyframes comboPunch{ 0%{transform:skewX(-6deg) scale(1.32) rotate(-3deg);} 60%{transform:skewX(-6deg) scale(.94);} 100%{transform:skewX(-6deg) scale(1);} }
#ws-hud .combolab b.punch{ animation:comboPunch .18s ease-out; }

/* ---------- v71 战意条（移动积攒，站桩衰减） ---------- */
#ws-hud .moraltrack{ position:relative; height:8px; margin-top:5px; background:rgba(0,0,0,.55); border:1px solid rgba(255,215,94,.35); border-radius:4px; overflow:hidden; }
#ws-hud .moraltrack .moralfill{ height:100%; width:0%; background:linear-gradient(90deg,#8a6ad0,#f2c53d,#ff8a5e); transition:width .12s linear; }
#ws-hud .moraltrack .mlab{ position:absolute; left:6px; top:-1px; font-size:9px; font-weight:800; letter-spacing:1px; color:rgba(255,233,176,.75); line-height:8px; }
#ws-hud .moraltrack.full{ border-color:#f2ea88; box-shadow:0 0 12px rgba(242,234,136,.5); }
#ws-hud .moraltrack.full .moralfill{ background:linear-gradient(90deg,#f2c53d,#ff5d5e); }

/* ---------- 公告队列 v3（v72 用户反馈"稍微再大一点点醒目一点点，位置别动"）：维持左上战报下方 ---------- */
#ws-hud .syntoast{ position:absolute; top:206px; left:12px; transform:none; display:none;
  flex-direction:column; gap:5px; align-items:flex-start; z-index:5; pointer-events:none; }
#ws-hud .syntoast.show{ display:flex; }
#ws-hud .syntoast .notice{ position:relative; padding:7px 14px 7px 16px; background:rgba(16,14,8,.92);
  color:#ffe9b0; font-size:14px; letter-spacing:.5px; font-weight:700; white-space:nowrap;
  border:1.5px solid var(--nc,#d69e2e); border-radius:3px;
  box-shadow:0 0 12px rgba(214,158,46,.35), 0 3px 10px rgba(0,0,0,.5);
  text-shadow:0 1px 3px rgba(0,0,0,.8);
  animation:noticeIn .2s ease-out; }
/* 左侧黄黑斜纹竖条（低调标识，不再上下横贯） */
#ws-hud .syntoast .notice::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:4px;
  background:repeating-linear-gradient(-45deg,#f2c53d 0 6px,#17140a 6px 12px);
  animation:hazard 1.1s linear infinite; opacity:.85; }
@keyframes hazard{ from{ background-position:0 0; } to{ background-position:17px 0; } }
@keyframes noticeIn{ from{ opacity:0; transform:translateX(-8px); } to{ opacity:1; transform:none; } }
#ws-hud .syntoast .notice b{ color:#ffd75e; margin:0 3px; }

/* ---------- 死亡结算：解锁横幅 / 进度提示 ---------- */
#ws-hud .go-unlock{ margin-top:10px; padding:6px 18px; display:inline-block;
  background:rgba(60,44,8,.85); border:1px solid #ffd75e; border-radius:3px;
  color:#ffe9b0; font-size:14px; letter-spacing:1px; }
#ws-hud .go-unlock b{ color:#ffd75e; }
#ws-hud .go-progress{ margin-top:8px; font-size:12px; color:#9c8a68; letter-spacing:2px; }
#ws-hud .go-best b{ color:#ffd75e; }

/* ---------- 首载进度条 / 虚拟摇杆 / 新手引导 ---------- */
#ws-hud .loading{ position:absolute; inset:0; display:none; place-items:center; z-index:40;
  background:radial-gradient(ellipse at 50% 40%, #12141c, #05070f 75%); }
#ws-hud .loading.show{ display:grid; }
#ws-hud .ld-box{ text-align:center; width:min(420px, 80vw); }
#ws-hud .ld-title{ font-size:26px; font-weight:900; letter-spacing:8px; color:#e8c882;
  text-shadow:0 0 24px rgba(232,184,78,.4); margin-bottom:22px; }
#ws-hud .ld-bar{ height:14px; background:rgba(255,255,255,.08); border:1px solid #5d5238; overflow:hidden;
  clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%); }
#ws-hud .ld-fill{ height:100%; width:0%;
  background:linear-gradient(90deg, #8a6a30, #e8b84e 60%, #ffe9b0);
  box-shadow:0 0 14px rgba(232,184,78,.6); transition:width .25s ease; }
#ws-hud .ld-pct{ margin-top:10px; font-size:14px; color:#ffd75e; font-weight:800; letter-spacing:2px; }
#ws-hud .ld-hint{ margin-top:6px; font-size:11px; color:#7a705c; letter-spacing:1px; }

#ws-hud .joybase{ position:fixed; display:none; width:112px; height:112px; border-radius:50%;
  border:2px solid rgba(255,215,94,.4); background:rgba(0,0,0,.25); z-index:30; pointer-events:none;
  transform:translate(-0px,-0px); }
#ws-hud .joybase.show{ display:block; }
#ws-hud .joyknob{ position:absolute; left:50%; top:50%; width:48px; height:48px; border-radius:50%;
  margin:-24px 0 0 -24px; background:radial-gradient(circle at 35% 30%, rgba(255,231,176,.95), rgba(232,184,78,.6));
  box-shadow:0 0 18px rgba(232,184,78,.5); }

#ws-hud .guide{ position:absolute; inset:0; display:none; place-items:center; z-index:35;
  background:rgba(5,7,15,.72); pointer-events:auto; }
#ws-hud .guide.show{ display:grid; }
#ws-hud .gd-box{ text-align:center; padding:26px 34px 24px; background:linear-gradient(180deg, rgba(28,25,17,.97), rgba(12,11,9,.97));
  border:1px solid #8a6a30; box-shadow:0 0 0 1px rgba(0,0,0,.9) inset, 0 20px 50px rgba(0,0,0,.7), 0 0 40px rgba(201,143,42,.18);
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%); width:min(430px, 88vw); }
#ws-hud .gd-title{ font-size:19px; font-weight:900; letter-spacing:5px; color:#e8c882; margin-bottom:16px; }
#ws-hud .gd-row{ display:flex; align-items:center; gap:12px; text-align:left; padding:7px 4px; border-bottom:1px dashed rgba(138,106,48,.25); }
#ws-hud .gd-row:last-child{ border-bottom:none; }
#ws-hud .gd-row .gi{ width:30px; text-align:center; font-size:17px; }
#ws-hud .gd-row b{ color:#ffd75e; font-size:13px; min-width:86px; letter-spacing:1px; }
#ws-hud .gd-row small{ color:#a89a7c; font-size:12px; }
#ws-hud .gd-btn{ margin-top:16px; padding:10px 46px; font-size:15px; font-weight:900; letter-spacing:6px;
  color:#1a1408; background:linear-gradient(180deg, #ffe9b0, #e8b84e); border:1px solid #b98d3a;
  cursor:pointer; clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%); }
#ws-hud .gd-btn:hover{ filter:brightness(1.1); }

/* ---------- 升级三选一 · 废土镀金 ---------- */
#ws-hud .upwrap{ position:absolute; inset:0; display:none; place-items:center; z-index:20;
  background:radial-gradient(ellipse at 50% 45%, rgba(201,143,42,.10), rgba(6,6,8,.62) 62%), rgba(6,6,8,.60); }
#ws-hud .upwrap.show{ display:grid; }
#ws-hud .uppanel{ position:relative; text-align:center; padding:28px 40px 34px; overflow:hidden;
  background:linear-gradient(180deg, rgba(28,25,17,.97), rgba(12,11,9,.97));
  border:1px solid #8a6a30; box-shadow:0 0 0 1px rgba(0,0,0,.9) inset, 0 30px 70px rgba(0,0,0,.7), 0 0 60px rgba(201,143,42,.22);
  clip-path:polygon(18px 0,100% 0,calc(100% - 18px) 100%,0 100%);
  animation:upPanelIn .3s ease-out both; }
/* 面板顶部流光金线 + 底缘衬光（全被 clip 保留在内） */
#ws-hud .uppanel::before{ content:""; position:absolute; left:0; right:0; top:0; height:2px;
  background:linear-gradient(90deg, transparent, #e8b84e 20%, #fff3c8 50%, #e8b84e 80%, transparent); }
#ws-hud .uppanel::after{ content:""; position:absolute; left:10%; right:10%; bottom:-1px; height:1px;
  background:linear-gradient(90deg, transparent, rgba(232,184,78,.7), transparent); }
@keyframes upPanelIn{ from{ opacity:0; transform:translateY(14px) scale(.96); } to{ opacity:1; transform:none; } }
#ws-hud .up-title{ font-size:24px; font-weight:900; letter-spacing:8px; color:#ffd75e; margin-bottom:4px;
  text-shadow:0 2px 4px rgba(0,0,0,.8), 0 0 18px rgba(255,215,94,.45); }
#ws-hud .up-sub{ font-size:12px; color:#c9a25e; letter-spacing:4px; margin-bottom:22px; text-shadow:0 1px 3px #000; }
#ws-hud .up-cards{ display:flex; gap:20px; align-items:flex-start; }

/* 抽卡风描边流光角变量（Chromium 支持；不支持则呈现静态环） */
@property --ang{ syntax:'<angle>'; initial-value:0deg; inherits:false; }

#ws-hud .upcard{ --ang:0deg; width:182px; height:256px; cursor:pointer; position:relative; text-align:center;
  display:flex; flex-direction:column; align-items:center; padding:0 0 18px;
  transition:transform .18s ease, filter .18s ease;
  background:
    radial-gradient(130% 80% at 50% 0%, rgba(96,82,44,.55), rgba(34,26,14,0) 64%),
    linear-gradient(180deg, #2b2415 0%, #1c150b 55%, #110d06 100%);
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);
  animation:upCardIn .34s cubic-bezier(.22,1.2,.36,1) both; }
#ws-hud .up-cards .upcard:nth-child(2){ animation-delay:.07s; }
#ws-hud .up-cards .upcard:nth-child(3){ animation-delay:.14s; }
@keyframes upCardIn{ from{ opacity:0; transform:translateY(24px) scale(.9); } to{ opacity:1; transform:none; } }
/* 描边流光环：conic 渐变以 mask 挖出 2px 环，颜色沿边框流动 */
#ws-hud .upcard::before{ content:""; position:absolute; inset:0; padding:2px; pointer-events:none;
  background:conic-gradient(from var(--ang), #3d3a2e 0%, #6b6140 30%, #3d3a2e 55%, #2c2820 75%, #3d3a2e 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite:exclude;
  animation:borderSpin 8s linear infinite; }
@keyframes borderSpin{ to{ --ang:360deg; } }
/* 悬停：上浮 + 流光斜扫（盖在内容上） */
#ws-hud .upcard:hover{ transform:translateY(-8px); }
#ws-hud .upcard::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(115deg, transparent 30%, rgba(255,228,150,.15) 44%, rgba(255,255,255,.34) 50%, rgba(255,228,150,.15) 56%, transparent 70%);
  transform:translateX(-135%); transition:transform .5s ease; }
#ws-hud .upcard:hover::after{ transform:translateX(135%); }
/* 图标：中央大号 + drop-shadow 发光（text-shadow 对 emoji 无效，必须用 filter） */
#ws-hud .upcard .ic{ flex:1 1 auto; display:flex; align-items:center; justify-content:center;
  font-size:56px; line-height:1; margin:18px 0 8px;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.8)) drop-shadow(0 0 10px rgba(255,215,94,.45)) drop-shadow(0 0 26px rgba(255,215,94,.18));
  animation:icFloat 2.8s ease-in-out infinite; }
@keyframes icFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-5px); } }
/* 名字铭牌：金属渐变字 + 底部金线 */
#ws-hud .upcard .nm{ font-size:17px; font-weight:900; letter-spacing:3px; padding:10px 6px 0; position:relative;
  background:linear-gradient(180deg,#fff6d2 0%, #ffdf8a 45%, #e0a83c 70%, #9a6f1f 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.95)); }
#ws-hud .upcard .nm::after{ content:""; display:block; height:2px; width:70%; margin:9px auto 0;
  background:linear-gradient(90deg, transparent, rgba(232,184,78,.6), transparent); }
#ws-hud .upcard .ds{ font-size:11px; color:#b9a378; margin-top:9px; line-height:1.55; padding:0 12px; }
/* 稀有度角标：左上角 */
#ws-hud .upcard .rk{ position:absolute; top:10px; left:12px; font-size:9px; font-weight:800; letter-spacing:2px;
  padding:2px 8px; border-radius:2px; text-shadow:0 1px 2px rgba(0,0,0,.9); }
/* 稀有度：翠（普通）/ 蓝（稀有）/ 金（史诗，流光加速+全卡金辉） */
#ws-hud .upcard.r1::before{ background:conic-gradient(from var(--ang), #3d4a3a 0%, #6a8f5a 30%, #3d4a3a 55%, #2c3026 75%, #3d4a3a 100%); animation-duration:10s; }
#ws-hud .upcard.r1 .rk{ color:#9ce3b0; background:linear-gradient(180deg, rgba(74,138,94,.35), rgba(74,138,94,.12)); border:1px solid rgba(122,199,140,.45); }
#ws-hud .upcard.r1 .ic{ filter:drop-shadow(0 2px 3px rgba(0,0,0,.8)) drop-shadow(0 0 10px rgba(95,190,120,.5)); }
#ws-hud .upcard.r2::before{ background:conic-gradient(from var(--ang), #3a4254 0%, #5a7fbd 30%, #3a4254 55%, #262a34 75%, #3a4254 100%); animation-duration:5.5s; }
#ws-hud .upcard.r2 .rk{ color:#8fc0ff; background:linear-gradient(180deg, rgba(74,124,187,.35), rgba(74,124,187,.12)); border:1px solid rgba(120,170,235,.45); }
#ws-hud .upcard.r2 .ic{ filter:drop-shadow(0 2px 3px rgba(0,0,0,.8)) drop-shadow(0 0 12px rgba(110,170,255,.6)); }
#ws-hud .upcard.r3{ background:
    radial-gradient(140% 90% at 50% 0%, rgba(216,168,64,.42), rgba(34,24,8,.05) 64%),
    linear-gradient(180deg, #3a2c12 0%, #241a09 55%, #161006 100%);
  filter:drop-shadow(0 0 12px rgba(240,201,104,.38)) drop-shadow(0 4px 14px rgba(0,0,0,.6)); }
#ws-hud .upcard.r3::before{ background:conic-gradient(from var(--ang), #3a2e14 0%, #8a6520 26%, #ffd75e 36%, #fff8dc 40%, #ffd75e 44%, #8a6520 54%, #3a2e14 74%); animation-duration:2.6s; }
#ws-hud .upcard.r3 .ic{ filter:drop-shadow(0 2px 3px rgba(0,0,0,.85)) drop-shadow(0 0 12px rgba(255,223,122,.9)) drop-shadow(0 0 32px rgba(255,223,122,.48));
  animation:iceGold 1.9s ease-in-out infinite; }
@keyframes iceGold{ 0%,100%{ transform:translateY(0) scale(1); } 50%{ transform:translateY(-4px) scale(1.1); } }
#ws-hud .upcard.r3 .rk{ color:#fff0bf; background:linear-gradient(180deg, rgba(201,143,42,.5), rgba(201,143,42,.16)); border:1px solid rgba(250,205,100,.6);
  animation:rkGold 1.4s ease-in-out infinite; }
@keyframes rkGold{ 0%,100%{ box-shadow:0 0 6px rgba(255,215,94,.4); } 50%{ box-shadow:0 0 18px rgba(255,215,94,.9); } }
#ws-hud .upcard.r3:hover{ filter:drop-shadow(0 0 22px rgba(240,201,104,.65)) brightness(1.08); }
/* v73f 金卡特效升级：金粉上升粒子 + 周期性扫光（无需悬停常驻） */
#ws-hud .upcard.r3::after{
  background:
    linear-gradient(115deg, transparent 36%, rgba(255,240,180,.24) 48%, rgba(255,255,240,.42) 52%, rgba(255,240,180,.24) 56%, transparent 68%),
    radial-gradient(2px 3px at 18% 84%, rgba(255,228,150,.95), transparent 60%),
    radial-gradient(1.6px 2.4px at 42% 92%, rgba(255,240,190,.85), transparent 60%),
    radial-gradient(2.2px 3px at 66% 80%, rgba(255,215,120,.9), transparent 60%),
    radial-gradient(1.4px 2px at 84% 94%, rgba(255,245,210,.8), transparent 60%),
    radial-gradient(1.8px 2.6px at 30% 76%, rgba(255,220,130,.75), transparent 60%),
    radial-gradient(1.5px 2.2px at 55% 96%, rgba(255,232,160,.7), transparent 60%);
  background-size:240% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%;
  transform:none;
  animation:goldFlow 3s linear infinite; }
@keyframes goldFlow{
  0%{ background-position:-140% 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0; }
  55%,100%{ background-position:140% 0, 0 -16px, 0 -26px, 0 -12px, 0 -20px, 0 -22px, 0 -18px; } }
@supports not (-webkit-background-clip:text){
  #ws-hud .upcard .nm{ color:#ffe9b0; background:none; filter:none; }
}
@media (max-width:680px){
  #ws-hud .uppanel{ padding:18px 18px 20px; }
  #ws-hud .up-cards{ gap:10px; }
  #ws-hud .upcard{ width:26vw; height:196px; padding:0 0 12px; }
  #ws-hud .upcard .ic{ font-size:36px; margin:12px 0 6px; }
  #ws-hud .upcard .nm{ font-size:13px; letter-spacing:1px; }
  #ws-hud .upcard .ds{ font-size:9px; padding:0 8px; }
  #ws-hud .upcard .rk{ top:8px; left:8px; font-size:8px; padding:1px 6px; }
}/* ---------- 死亡幕布 ---------- */
#ws-hud .overlay{ position:absolute; inset:0; display:none; place-items:center; background:rgba(24,6,4,.45); z-index:30; }
#ws-hud .overlay.show{ display:grid; }
#ws-hud .overlay .go-box{ text-align:center; }
#ws-hud .overlay .go-title{ font-size:64px; font-weight:900; color:#ff5d5d; letter-spacing:14px;
  text-shadow:0 4px 24px rgba(255,93,93,.6), 0 2px 6px rgba(0,0,0,.8); }
/* v72 撤离成功标题（绿色系）+ 榜单撤离小标 */
#ws-hud .overlay .go-title.evac{ color:#7dffa0; letter-spacing:6px; font-size:52px;
  text-shadow:0 4px 24px rgba(125,255,160,.55), 0 2px 6px rgba(0,0,0,.8); }
#ws-hud .rk-evac{ display:inline-block; margin-left:6px; padding:1px 5px; font-size:10px; font-weight:700;
  color:#7dffa0; border:1px solid rgba(125,255,160,.55); border-radius:3px; vertical-align:1px; }
#ws-hud .overlay .go-stats{ margin-top:14px; font-size:17px; color:#ffe9b0; letter-spacing:2px; font-weight:700; line-height:1.9; }
#ws-hud .overlay .go-new{ margin-top:12px; font-size:13px; font-weight:900; letter-spacing:2px; color:#ffd75e;
  text-shadow:0 0 14px rgba(255,215,94,.7); animation:rkGold 1.4s ease-in-out infinite; }
#ws-hud .overlay .go-best{ margin-top:12px; font-size:12px; color:#b9a378; letter-spacing:1px; }
#ws-hud .overlay .go-hint{ margin-top:26px; font-size:13px; color:#cbb69a; letter-spacing:3px; }
#ws-hud .overlay .go-hint b{ color:#ffd75e; }
/* ---------- 主菜单 v73f 美术重设计：废土黄昏场景 + 视线动线布局 ---------- */
#ws-hud .wsmenu{ position:absolute; inset:0; display:none; z-index:40; pointer-events:auto; overflow:hidden;
  background:
    radial-gradient(120% 55% at 50% 108%, rgba(196,98,40,.30) 0%, rgba(120,56,26,.16) 42%, rgba(20,12,8,0) 72%),
    linear-gradient(180deg, #0a0910 0%, #171018 30%, #3a1f16 62%, #6b3318 88%, #8a4520 100%); }
#ws-hud .wsmenu.show{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; padding:24px; }
/* 场景装饰层：残月 + 废墟天际线 + 尘埃（纯 CSS，零素材） */
#ws-hud .wm-scene{ position:absolute; inset:0; pointer-events:none; }
#ws-hud .wm-moon{ position:absolute; top:9%; right:14%; width:74px; height:74px; border-radius:50%;
  background:radial-gradient(circle at 38% 36%, #ffe9c4 0%, #f0c070 55%, #c98a3e 100%);
  box-shadow:0 0 34px rgba(255,200,120,.5), 0 0 90px rgba(255,180,94,.22);
  animation:moonBreath 5.5s ease-in-out infinite; }
#ws-hud .wm-moon::after{ content:""; position:absolute; inset:0; border-radius:50%;
  background:radial-gradient(circle at 62% 30%, rgba(160,110,50,.35) 4px, transparent 5px),
    radial-gradient(circle at 30% 62%, rgba(160,110,50,.3) 3px, transparent 4px),
    radial-gradient(circle at 72% 66%, rgba(160,110,50,.28) 2.5px, transparent 3.5px); }
@keyframes moonBreath{ 0%,100%{ box-shadow:0 0 34px rgba(255,200,120,.5), 0 0 90px rgba(255,180,94,.22); } 50%{ box-shadow:0 0 44px rgba(255,200,120,.65), 0 0 110px rgba(255,180,94,.3); } }
/* 废墟天际线：14 个楼块剪影（断楼/烟囱/斜塔，底部贴边） */
#ws-hud .wm-skyline{ position:absolute; left:0; right:0; bottom:0; height:150px; }
#ws-hud .wm-skyline i{ position:absolute; bottom:0; background:linear-gradient(180deg, #17100a 0%, #0d0906 100%); }
#ws-hud .wm-skyline i:nth-child(1){ left:2%;  width:7%;  height:52%; }
#ws-hud .wm-skyline i:nth-child(2){ left:8%;  width:4%;  height:78%; clip-path:polygon(0 0,100% 18%,100% 100%,0 100%); }
#ws-hud .wm-skyline i:nth-child(3){ left:13%; width:9%;  height:40%; }
#ws-hud .wm-skyline i:nth-child(4){ left:21%; width:5%;  height:66%; clip-path:polygon(20% 0,100% 10%,100% 100%,0 100%,0 26%); }
#ws-hud .wm-skyline i:nth-child(5){ left:27%; width:10%; height:34%; }
#ws-hud .wm-skyline i:nth-child(6){ left:38%; width:6%;  height:58%; clip-path:polygon(0 12%,78% 0,100% 100%,0 100%); }
#ws-hud .wm-skyline i:nth-child(7){ left:45%; width:11%; height:44%; }
#ws-hud .wm-skyline i:nth-child(8){ left:57%; width:4%;  height:82%; }
#ws-hud .wm-skyline i:nth-child(9){ left:62%; width:9%;  height:38%; }
#ws-hud .wm-skyline i:nth-child(10){ left:72%; width:6%; height:70%; clip-path:polygon(0 0,100% 22%,100% 100%,0 100%); }
#ws-hud .wm-skyline i:nth-child(11){ left:79%; width:8%; height:48%; }
#ws-hud .wm-skyline i:nth-child(12){ left:88%; width:5%; height:62%; }
#ws-hud .wm-skyline i:nth-child(13){ left:93%; width:5%; height:36%; }
#ws-hud .wm-skyline i:nth-child(14){ left:0; right:0; width:100%; height:14%; }
/* 浮尘：12 颗微粒缓慢上旋飘落（近景氛围，呼应游戏内尘埃层） */
#ws-hud .wm-dust i{ position:absolute; bottom:-6px; border-radius:50%; background:rgba(232,186,120,.65);
  animation:dustFloat linear infinite; }
#ws-hud .wm-dust i:nth-child(1){ left:6%;  width:3px; height:3px; animation-duration:13s; }
#ws-hud .wm-dust i:nth-child(2){ left:16%; width:2px; height:2px; animation-duration:17s; animation-delay:-6s; }
#ws-hud .wm-dust i:nth-child(3){ left:26%; width:4px; height:4px; animation-duration:11s; animation-delay:-3s; }
#ws-hud .wm-dust i:nth-child(4){ left:37%; width:2px; height:2px; animation-duration:19s; animation-delay:-10s; }
#ws-hud .wm-dust i:nth-child(5){ left:47%; width:3px; height:3px; animation-duration:14s; animation-delay:-8s; }
#ws-hud .wm-dust i:nth-child(6){ left:57%; width:2px; height:2px; animation-duration:21s; animation-delay:-2s; }
#ws-hud .wm-dust i:nth-child(7){ left:66%; width:3px; height:3px; animation-duration:12s; animation-delay:-5s; }
#ws-hud .wm-dust i:nth-child(8){ left:75%; width:2px; height:2px; animation-duration:18s; animation-delay:-12s; }
#ws-hud .wm-dust i:nth-child(9){ left:84%; width:4px; height:4px; animation-duration:15s; animation-delay:-7s; }
#ws-hud .wm-dust i:nth-child(10){ left:91%; width:2px; height:2px; animation-duration:16s; animation-delay:-1s; }
#ws-hud .wm-dust i:nth-child(11){ left:11%; width:2px; height:2px; animation-duration:20s; animation-delay:-14s; }
#ws-hud .wm-dust i:nth-child(12){ left:52%; width:2px; height:2px; animation-duration:22s; animation-delay:-16s; }
@keyframes dustFloat{ 0%{ transform:translateY(0) translateX(0); opacity:0; } 12%{ opacity:.85; } 88%{ opacity:.5; } 100%{ transform:translateY(-46vh) translateX(40px); opacity:0; } }
/* 账号胶囊：右上角（视线动线：先账号后主流程） */
#ws-hud .wsmenu .wm-account{ position:absolute; top:18px; right:20px; width:auto; min-width:230px; margin:0; padding:9px 16px;
  background:rgba(16,12,8,.62); border:1px solid #5c4028; border-radius:999px; color:#c9a86a;
  font:700 12px/1.4 inherit; letter-spacing:1px; cursor:pointer; text-align:center; backdrop-filter:blur(2px); }
#ws-hud .wsmenu .wm-account:hover{ border-color:#8a6a30; color:#ffd75e; }
#ws-hud .wsmenu .wm-account.on{ border-color:#c98a4e; color:#ffd75e; }
/* 标题金属铭牌：上下铆钉饰线 + 金属渐变字 */
#ws-hud .wm-head{ text-align:center; animation:wmIn .5s cubic-bezier(.22,1.2,.36,1) both; position:relative; z-index:1; }
#ws-hud .wm-head::before, #ws-hud .wm-head::after{ content:""; display:block; height:2px; width:min(560px,70vw); margin:0 auto;
  background:linear-gradient(90deg, transparent, rgba(232,184,78,.55) 20%, rgba(255,215,94,.75) 50%, rgba(232,184,78,.55) 80%, transparent); }
#ws-hud .wm-head::before{ margin-bottom:16px; }
#ws-hud .wm-head::after{ margin-top:16px; }
#ws-hud .wm-title{ font-size:clamp(36px,6.4vw,62px); font-weight:900; letter-spacing:16px; padding-left:16px; line-height:1.15;
  background:linear-gradient(180deg,#fff6d2 0%,#ffd75e 34%,#e0963c 62%,#8a5218 100%); -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 3px 10px rgba(0,0,0,.85)) drop-shadow(0 0 26px rgba(255,170,80,.35)); }
#ws-hud .wm-sub{ font-size:12px; letter-spacing:12px; padding-left:12px; color:rgba(255,190,110,.62); font-weight:700; margin-top:6px; }
/* 中央主舞台：存档卡+职业+模式（视觉主体） */
#ws-hud .wm-stage{ display:flex; flex-direction:column; align-items:center; gap:16px; position:relative; z-index:1;
  animation:wmIn .5s cubic-bezier(.22,1.2,.36,1) .08s both; }
/* 存档卡三连横排（桌面 3 列一行，小屏自动换行） */
#ws-hud .wm-slots{ display:flex; gap:14px; justify-content:center; align-items:stretch; flex-wrap:wrap; width:min(780px,94vw); }
/* 存档卡立体化 */
#ws-hud .wm-card{ position:relative; flex:1 1 236px; max-width:248px; min-height:174px; padding:16px 16px 14px; cursor:pointer; box-sizing:border-box;
  background:linear-gradient(180deg,rgba(52,37,24,.94),rgba(30,20,13,.96));
  border:1px solid #6b4630; border-top-color:#8a5f40; border-radius:10px;
  box-shadow:inset 0 1px 0 rgba(255,220,150,.1), inset 0 -10px 22px rgba(0,0,0,.4), 0 10px 28px rgba(0,0,0,.6);
  transition:transform .16s ease-out, border-color .16s, box-shadow .16s; }
#ws-hud .wm-card:hover{ transform:translateY(-6px); border-color:#c98a4e; box-shadow:inset 0 1px 0 rgba(255,220,150,.14), inset 0 -10px 22px rgba(0,0,0,.4), 0 16px 36px rgba(0,0,0,.7), 0 0 22px rgba(255,180,94,.22); }
#ws-hud .wm-card.empty{ border-style:dashed; opacity:.75; }
#ws-hud .wm-card.pending{ border-color:#ffd75e; background:linear-gradient(180deg,rgba(96,68,20,.94),rgba(54,37,17,.96)); box-shadow:inset 0 1px 0 rgba(255,220,150,.14), 0 14px 32px rgba(0,0,0,.68), 0 0 18px rgba(255,215,94,.38); opacity:1; }
#ws-hud .wm-card.pending .wm-new{ color:#ffd75e; }
/* 存档卡内部排版（v73g 可读性修复：此前无任何定义，浏览器默认样式导致文字/图标看不清） */
#ws-hud .wm-no{ font-size:12px; font-weight:900; letter-spacing:3px; color:#e8c882; }
#ws-hud .wm-new{ margin-top:34px; text-align:center; font-size:20px; font-weight:900; letter-spacing:4px; color:#d8b878; }
#ws-hud .wm-char{ margin-top:12px; display:flex; align-items:center; gap:8px; font-size:17px; font-weight:900; letter-spacing:2px; color:#ffe9b0; }
#ws-hud .wm-ic{ font-size:22px; }
#ws-hud .wm-stat{ margin-top:10px; font-size:13px; line-height:1.7; letter-spacing:1px; color:#d8c8a4; }
#ws-hud .wm-del{ position:absolute; right:10px; top:10px; width:26px; height:26px; padding:0; cursor:pointer;
  font-size:13px; font-weight:900; line-height:24px; text-align:center; color:#c9a86a;
  background:rgba(20,14,8,.6); border:1px solid #6b4630; border-radius:6px; box-sizing:border-box; }
#ws-hud .wm-del:hover{ color:#ff8a6e; border-color:#a04a34; background:rgba(90,30,18,.5); }
#ws-hud .wm-dailybest{ font-size:13px; font-weight:700; letter-spacing:1px; color:#e8c882; }
/* 左侧功能竖栏：铁牌导航（主流程与功能区分离） */
#ws-hud .wm-actions{ position:absolute; left:22px; top:50%; transform:translateY(-50%); z-index:1;
  display:flex; flex-direction:column; gap:10px; animation:wmIn .5s cubic-bezier(.22,1.2,.36,1) .16s both; }
#ws-hud .wm-btn{ position:relative; display:flex; align-items:center; gap:9px; padding:11px 18px 11px 14px; cursor:pointer;
  font-size:13px; font-weight:800; letter-spacing:2px; color:#e8cfa0;
  background:linear-gradient(180deg,rgba(64,45,28,.92),rgba(38,26,16,.94));
  border:1px solid #6b4a30; border-left:3px solid #b9834a;
  clip-path:polygon(0 0,100% 0,calc(100% - 9px) 100%,0 100%);
  transition:transform .14s ease-out, border-color .14s, color .14s, box-shadow .14s; overflow:hidden; }
#ws-hud .wm-btn span{ font-size:16px; transition:transform .14s; }
#ws-hud .wm-btn::after{ content:""; position:absolute; inset:0; background:linear-gradient(115deg, transparent 40%, rgba(255,228,150,.2) 50%, transparent 60%);
  transform:translateX(-130%); transition:transform .45s ease; }
#ws-hud .wm-btn:hover{ transform:translateX(5px); border-color:#c98a4e; color:#ffd75e; box-shadow:0 6px 18px rgba(0,0,0,.5), 0 0 14px rgba(255,180,94,.18); }
#ws-hud .wm-btn:hover::after{ transform:translateX(130%); }
#ws-hud .wm-btn:hover span{ transform:scale(1.18); }
/* 底部黄黑斜纹提示条（呼应游戏内公告条语言） */
#ws-hud .wm-foot{ position:absolute; left:0; right:0; bottom:0; z-index:1; padding:9px 20px 9px 26px;
  font-size:12.5px; letter-spacing:2px; color:rgba(255,230,185,.92); font-weight:700; text-align:center;
  background:rgba(12,8,5,.72); border-top:1px solid rgba(201,138,78,.4);
  box-shadow:inset 0 6px 14px rgba(0,0,0,.45); }
#ws-hud .wm-foot::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:8px;
  background:repeating-linear-gradient(-45deg, #d6a028 0 8px, #14100a 8px 16px); }
/* 全区块入场动效 */
@keyframes wmIn{ from{ opacity:0; transform:translateY(22px); } to{ opacity:1; transform:none; } }
#ws-hud .wsmenu .wm-account{ animation:wmIn .45s cubic-bezier(.22,1.2,.36,1) both; }
#ws-hud .wsmenu .wm-foot{ animation:wmIn .45s ease .24s both; }
/* ---------- 图鉴面板（第四步） ---------- */
#ws-hud .wshb{ position:absolute; inset:0; display:none; z-index:45; pointer-events:auto; place-items:center;
  background:rgba(10,7,5,.88); }
#ws-hud .wshb.show{ display:grid; }
#ws-hud .hb-box{ width:min(860px,92vw); max-height:86vh; display:flex; flex-direction:column;
  background:linear-gradient(180deg,rgba(46,32,20,.97),rgba(24,16,10,.98));
  border:1px solid #6b4630; border-radius:12px; box-shadow:0 16px 48px rgba(0,0,0,.7); padding:16px; }
#ws-hud .hb-head{ display:flex; justify-content:space-between; align-items:center;
  font-size:17px; font-weight:900; letter-spacing:4px; color:#ffb45e; padding:2px 6px 12px; }
#ws-hud .hb-close{ border:none; background:transparent; color:#b99a72; font-size:18px; cursor:pointer; padding:4px 10px; border-radius:6px; }
#ws-hud .hb-close:hover{ color:#ff8a6e; background:rgba(200,60,40,.2); }
#ws-hud .hb-grid{ overflow-y:auto; display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:10px; padding:4px; }
#ws-hud .hb-cell{ padding:12px 10px; text-align:center; border:1px solid #5c4028; border-radius:8px;
  background:rgba(30,20,12,.7); }
#ws-hud .hb-cell .hb-name{ font-size:15px; font-weight:900; color:#ffe9b0; letter-spacing:1px; }
#ws-hud .hb-cell .hb-type{ font-size:10px; letter-spacing:3px; color:#9c7a52; font-weight:800; margin-top:4px; }
#ws-hud .hb-cell .hb-kills{ font-size:13px; font-weight:800; color:#ffcf8e; margin-top:8px; }
#ws-hud .hb-cell .hb-first{ font-size:10px; color:#8a6a48; margin-top:4px; }
#ws-hud .hb-cell.unknown{ opacity:.45; border-style:dashed; }
#ws-hud .hb-cell.unknown .hb-name{ color:#8a6a48; }

/* ---------- 账号二期：角色选择 / 登录面板 / 排行榜（v73f 账号胶囊已移至右上角） ---------- */
#ws-hud .wm-account.on{ color:#ffe9b0; border-color:#b98d3a; }
/* v73f 小屏适配：功能竖栏转底部横排，账号胶囊收紧 */
@media (max-width:900px){
  #ws-hud .wm-actions{ position:static; transform:none; flex-direction:row; flex-wrap:wrap; justify-content:center; margin-top:4px; }
  #ws-hud .wm-btn{ clip-path:none; border-left-width:1px; padding:9px 14px; font-size:12px; }
  #ws-hud .wsmenu .wm-account{ min-width:0; top:12px; right:12px; padding:7px 12px; }
  #ws-hud .wm-skyline{ height:96px; }
}
#ws-hud .wm-chars{ display:flex; gap:8px; justify-content:center; width:min(560px,92vw); margin:0 auto 12px; }
#ws-hud .wm-ch{ flex:1; padding:8px 4px; background:rgba(20,16,10,.55); border:1px solid #5c4028; border-radius:8px;
  color:#a89a7c; cursor:pointer; text-align:center; }
#ws-hud .wm-ch b{ display:block; font-size:13px; letter-spacing:2px; color:#e8c882; margin:2px 0; }
#ws-hud .wm-ch small{ display:block; font-size:10px; line-height:1.5; color:#c8b48c; opacity:1; }
#ws-hud .wm-ch .wm-ch-ic{ font-size:18px; }
#ws-hud .wm-ch:hover{ border-color:#8a6a30; }
#ws-hud .wm-ch.on{ border-color:#ffd75e; background:rgba(90,64,18,.45); box-shadow:0 0 12px rgba(255,215,94,.25); }
#ws-hud .wm-ch.on b{ color:#ffd75e; }
#ws-hud .wsmodal{ position:absolute; inset:0; display:none; place-items:center; z-index:46;
  background:rgba(5,7,15,.7); pointer-events:auto; }
#ws-hud .wsmodal.show{ display:grid; }
#ws-hud .md-box{ width:min(430px,90vw); max-height:82vh; display:flex; flex-direction:column; text-align:center;
  padding:22px 26px 18px; background:linear-gradient(180deg, rgba(28,25,17,.97), rgba(12,11,9,.97));
  border:1px solid #8a6a30; box-shadow:0 20px 50px rgba(0,0,0,.7); }
#ws-hud .md-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:14px;
  font-size:16px; font-weight:900; letter-spacing:3px; color:#e8c882; }
#ws-hud .md-btn{ margin-top:12px; padding:10px 30px; font-size:14px; font-weight:900; letter-spacing:4px;
  color:#1a1408; background:linear-gradient(180deg,#ffe9b0,#e8b84e); border:1px solid #b98d3a; cursor:pointer; }
#ws-hud .md-btn:hover{ filter:brightness(1.1); }
#ws-hud .auth-tabs{ display:flex; gap:6px; margin-bottom:12px; }
#ws-hud .auth-tab{ flex:1; padding:7px 0; font-size:12px; font-weight:800; letter-spacing:2px; color:#9c7a52;
  background:transparent; border:1px solid #5c4028; border-radius:6px; cursor:pointer; }
#ws-hud .auth-tab.on{ color:#ffd75e; border-color:#b98d3a; background:rgba(90,64,18,.35); }
#ws-hud .auth-in{ width:100%; padding:9px 10px; margin-bottom:10px; background:rgba(0,0,0,.35);
  border:1px solid #5c4028; border-radius:6px; color:#ffe9b0; font-size:13px; box-sizing:border-box; }
#ws-hud .auth-in:focus{ outline:none; border-color:#b98d3a; }
#ws-hud .auth-err{ min-height:16px; font-size:11px; color:#ff8a6e; margin-bottom:4px; }
#ws-hud .auth-note{ margin-top:10px; font-size:10px; color:#8a6a48; letter-spacing:1px; }
/* ---------- 游戏说明弹窗（v73g：通俗玩法指南，大字号高对比） ---------- */
#ws-hud .md-help{ width:min(600px,92vw); text-align:left; }
#ws-hud .help-body{ overflow-y:auto; padding:2px 8px 2px 2px; }
#ws-hud .help-sec{ padding:11px 14px; margin-bottom:8px; text-align:left;
  border:1px solid #5c4028; border-left:3px solid #b9834a; border-radius:6px; background:rgba(26,20,12,.55); }
#ws-hud .help-sec b{ display:block; font-size:15px; font-weight:900; letter-spacing:1px; color:#ffd75e; margin-bottom:6px; }
#ws-hud .help-sec p{ margin:0; font-size:13.5px; line-height:1.8; letter-spacing:.5px; color:#ecdfc0; }
#ws-hud .help-sec p b{ display:inline; color:#ffcf7a; margin:0 1px; }
#ws-hud .rank-list{ overflow-y:auto; min-height:200px; padding:2px; }
#ws-hud .rank-group{ font-size:12px; font-weight:800; letter-spacing:2px; color:#e8c882; padding:2px 4px 7px; border-bottom:1px solid #5c4028; margin-bottom:7px; }
#ws-hud .rank-row{ display:flex; align-items:center; gap:8px; padding:7px 8px; margin-bottom:5px;
  border:1px solid #5c4028; border-radius:6px; background:rgba(20,16,10,.4); }
#ws-hud .rank-row.me{ border-color:#ffd75e; background:rgba(90,64,18,.45); }
#ws-hud .rk-no{ width:30px; text-align:center; font-weight:900; color:#e8c882; }
#ws-hud .rk-name{ flex:1; text-align:left; font-size:13px; color:#ffe9b0; letter-spacing:1px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#ws-hud .rk-k{ font-size:12px; font-weight:800; color:#ffcf8e; }
#ws-hud .rk-t{ font-size:11px; color:#9c7a52; }
#ws-hud .rk-w{ font-size:11px; color:#9c7a52; width:38px; text-align:right; }
#ws-hud .rank-empty{ padding:40px 0; text-align:center; color:#8a6a48; font-size:12px; letter-spacing:2px; }
/* 天赋面板（内容4.0） */
#ws-hud .tal-coins{ text-align:center; font-size:14px; font-weight:900; letter-spacing:2px; color:#ffd75e; margin-bottom:10px; }
#ws-hud .tal-list{ overflow-y:auto; max-height:52vh; padding:2px; }
#ws-hud .tal-row{ display:flex; align-items:center; gap:10px; padding:8px 10px; margin-bottom:6px;
  border:1px solid #5c4028; border-radius:8px; background:rgba(20,16,10,.45); }
#ws-hud .tal-ic{ font-size:20px; width:28px; text-align:center; }
#ws-hud .tal-info{ flex:1; text-align:left; }
#ws-hud .tal-info b{ font-size:13px; color:#ffe9b0; letter-spacing:1px; }
#ws-hud .tal-info b small{ color:#9c7a52; font-weight:800; margin-left:4px; }
#ws-hud .tal-info small{ display:block; font-size:10px; color:#a89a7c; margin-top:2px; }
#ws-hud .tal-buy{ min-width:76px; padding:7px 10px; font-size:12px; font-weight:900; letter-spacing:1px;
  color:#1a1408; background:linear-gradient(180deg,#ffe9b0,#e8b84e); border:1px solid #b98d3a; border-radius:6px; cursor:pointer; }
#ws-hud .tal-buy:hover{ filter:brightness(1.1); }
#ws-hud .tal-buy:disabled{ background:rgba(90,70,40,.5); color:#9c7a52; cursor:default; filter:none; }
#ws-hud .report .row b.coin{ color:#ffcf8e; }
/* 角色专属技能格（内容5.0） */
#ws-hud .boost.skillrdy{ border-color:#ffd75e; color:#ffd75e; box-shadow:0 0 10px rgba(255,215,94,.35); cursor:pointer; }
#ws-hud .boost.skillon{ border-color:#7bf59e; color:#7bf59e; box-shadow:0 0 12px rgba(123,245,158,.45); }
/* 红色风险卡（内容5.0）：红边红纹警示 */
/* v73f 红卡全面重做（血月专属档）：血色纹理底 + 心跳脉冲 + 红色流光边 + 血光扫过 */
#ws-hud .upcard.riskcard{
  background:
    radial-gradient(140% 90% at 50% 0%, rgba(158,22,26,.5), rgba(22,6,8,.06) 64%),
    linear-gradient(180deg, #36100e 0%, #230a0a 55%, #140505 100%);
  animation:upCardIn .34s cubic-bezier(.22,1.2,.36,1) both, riskHeart 1.15s ease-in-out .34s infinite;
  filter:drop-shadow(0 0 14px rgba(255,59,46,.35)) drop-shadow(0 4px 14px rgba(0,0,0,.6)); }
@keyframes riskHeart{
  0%,100%{ transform:scale(1); filter:drop-shadow(0 0 10px rgba(255,59,46,.28)) drop-shadow(0 4px 14px rgba(0,0,0,.6)); }
  12%{ transform:scale(1.022); filter:drop-shadow(0 0 26px rgba(255,59,46,.62)) drop-shadow(0 4px 14px rgba(0,0,0,.6)); }
  36%{ transform:scale(1); filter:drop-shadow(0 0 12px rgba(255,59,46,.32)) drop-shadow(0 4px 14px rgba(0,0,0,.6)); } }
#ws-hud .upcard.riskcard::before{ background:conic-gradient(from var(--ang), #2e0d0c 0%, #7e1a16 26%, #ff4b3e 36%, #ffd9c4 40%, #ff4b3e 44%, #7e1a16 54%, #2e0d0c 74%); animation-duration:2.2s; }
#ws-hud .upcard.riskcard::after{ background:linear-gradient(115deg, transparent 34%, rgba(255,80,60,.24) 47%, rgba(255,214,196,.5) 52%, rgba(255,80,60,.24) 57%, transparent 70%);
  transform:translateX(-135%); animation:riskSweep 2.4s ease-in-out infinite; }
@keyframes riskSweep{ 0%,38%{ transform:translateX(-135%); } 76%,100%{ transform:translateX(135%); } }
#ws-hud .upcard.riskcard .nm{ color:#ffb09e; background:linear-gradient(180deg,#ffd9c4 0%, #ff9a7e 48%, #e05a3e 72%, #8e2a18 100%); -webkit-background-clip:text; background-clip:text; color:transparent; filter:drop-shadow(0 1px 2px rgba(0,0,0,.95)); }
#ws-hud .upcard.riskcard .nm::after{ background:linear-gradient(90deg, transparent, rgba(255,90,70,.7), transparent); }
#ws-hud .upcard.riskcard .rk{ color:#ff6e5a; background:linear-gradient(180deg, rgba(180,40,30,.5), rgba(120,20,14,.18)); border:1px solid rgba(255,90,70,.6);
  animation:rkRisk 1.15s ease-in-out infinite; }
@keyframes rkRisk{ 0%,100%{ box-shadow:0 0 6px rgba(255,75,62,.4); } 50%{ box-shadow:0 0 20px rgba(255,75,62,.95); } }
#ws-hud .upcard.riskcard:hover{ filter:drop-shadow(0 0 24px rgba(255,75,62,.7)) brightness(1.1); }
/* 觉醒卡（v68 流派）：金边金辉脉动 */
#ws-hud .upcard.awakecard{ border-color:#f2ea88; box-shadow:0 0 0 1px rgba(0,0,0,.9) inset, 0 20px 50px rgba(0,0,0,.7), 0 0 46px rgba(242,234,136,.45); animation:awakepulse 1.2s ease-in-out infinite; }
#ws-hud .upcard.awakecard .nm{ color:#f2ea88; }
#ws-hud .upcard.awakecard .rk{ color:#f2ea88; }
@keyframes awakepulse{ 0%,100%{ box-shadow:0 0 0 1px rgba(0,0,0,.9) inset, 0 20px 50px rgba(0,0,0,.7), 0 0 30px rgba(242,234,136,.30); } 50%{ box-shadow:0 0 0 1px rgba(0,0,0,.9) inset, 0 20px 50px rgba(0,0,0,.7), 0 0 56px rgba(242,234,136,.60); } }
/* 结算页每日挑战行 */
#ws-hud .go-daily{ margin-top:10px; font-size:13px; font-weight:800; letter-spacing:2px; color:#ffcf8e; }