/* 敌人技能库 2.0 的静态标记（mechanic-fx2.mjs）。全部 mx2- 前缀；复用 mechanic-fx.css 的 .mx-layer / .mx-sym / .mx-ghost。
   每个效果都有不依赖图的后备画法；有图（dist/assets/mechanics2/）时只是把图叠上去。符号 + 纹理双保险，不只靠颜色。 */
.mx2-cell{position:absolute;box-sizing:border-box;border-radius:16%;pointer-events:none}
.mx2-cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
/* 符石皮：伪装 / 蚀符 / 印记的样子换在格子自己的 .orb 里（真色的图隐藏），所以和普通符石一样大、跟着拖动 / 消除动画走，
   冻结等原有状态层仍盖在上面，迷雾藏起 .orb 时一起藏起；运行时美术已按珠体对齐，图框 = .orb × 1.25。 */
.orb-cell[data-mx2-skin] .gem-image{opacity:0}
.mx2-skin{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.mx2-skin.mx2-fit{inset:-12.5%;width:125%;height:125%;max-width:none;max-height:none}
#drag-gem.mx2-fit{scale:1.25}
/* 地砖在符石之下：幻界（6 色水晶格）、瘴气（无缝雾纹，按棋盘坐标连续铺）；没图时用同位置的 CSS 纹理 */
#board .orb-cell[data-mx2-tile]{background:var(--mx2-tile,none) var(--mx2-tile-pos,center)/var(--mx2-tile-size,cover) repeat,var(--mx2-tile-fb,#03090d33)}
#board .orb-cell[data-mx2-tile^="realm"]{--mx2-tile-fb:repeating-linear-gradient(45deg,#ffffff24 0 2px,#0000 2px 9px),repeating-linear-gradient(-45deg,#ffffff24 0 2px,#0000 2px 9px),radial-gradient(circle,color-mix(in srgb,var(--mx2-c,#fff) 45%,#0000),#0b0f18 75%)}
#board .orb-cell[data-mx2-tile^="miasma"]{--mx2-tile-fb:repeating-linear-gradient(160deg,#9cf2d633 0 2px,#0000 2px 7px),radial-gradient(circle at 50% 60%,#4fb89a99,#3a2a6a 70%)}
.mx2-cell .mx-sym{z-index:2}
/* 蚀符：弱化 ▼ = 灰膜 + 三道裂纹；邪能 ✷ = 锯齿状紫黑火苗光晕 */
.mx2-film{position:absolute;inset:12%;border-radius:50%}
.mx2-weak .mx2-film{background:linear-gradient(118deg,#0000 46%,#f4f4f4cc 47% 49%,#0000 50%),linear-gradient(32deg,#0000 47%,#e6e6e6aa 48% 49.5%,#0000 51%),linear-gradient(-70deg,#0000 47%,#dcdcdcaa 48% 49.5%,#0000 51%),radial-gradient(circle,#8a8a8a66,#5d5d5d88);mix-blend-mode:normal;filter:saturate(.4)}
.mx2-evil .mx2-film{inset:2%;background:conic-gradient(from 0deg,#0000 0 6%,#8d3dff88 8%,#0000 12% 18%,#3b0a5c99 20%,#0000 24% 31%,#8d3dff88 33%,#0000 37% 43%,#3b0a5c99 45%,#0000 49% 56%,#8d3dff88 58%,#0000 62% 68%,#3b0a5c99 70%,#0000 74% 81%,#8d3dff88 83%,#0000 87% 93%,#3b0a5c99 95%,#0000 99%);-webkit-mask:radial-gradient(circle,#0000 52%,#000 56%);mask:radial-gradient(circle,#0000 52%,#000 56%);animation:mx2-flicker 1.6s steps(3) infinite}
.mx2-weak .mx-sym{color:#e8e8e8}.mx2-evil .mx-sym{color:#d7b0ff}
/* 印记：力 ◆ 实心金菱形；虚 ◇ 空心虚线紫菱形 */
.mx2-power .mx2-film{inset:30%;border-radius:2px;transform:rotate(45deg);background:linear-gradient(135deg,#fff3b0,#e0a92b);box-shadow:0 0 8px #ffd76acc;opacity:.9}
.mx2-void .mx2-film{inset:28%;border-radius:2px;transform:rotate(45deg);border:2px dashed #c58bff;box-shadow:0 0 8px #9b4dff99,inset 0 0 6px #9b4dff66}
.mx2-power .mx-sym{color:#ffe17a}.mx2-void .mx-sym{color:#d7b0ff}
/* 移形换影：覆盖一张「看起来的颜色」符石；困难档带「≈」+ 双重轮廓 */
.mx2-guise.mx2-tell-mark{box-shadow:inset 0 0 0 2px #ffffffaa,inset 0 0 0 4px #00000066,3px 0 0 -1px #ffffff55}
.mx2-guise .mx2-tell{left:auto;right:2px;top:auto;bottom:1px}
/* 幻界：菱形格纹地砖 + 目标色内发光，左上角目标色字 */
/* 覆盖层上只有框和字：不在符石上面铺颜色（地砖在符石之下） */
.mx2-realm{box-shadow:inset 0 0 0 2px var(--mx2-c),0 0 6px var(--mx2-c)}
.mx2-realm.mx2-ghost{box-shadow:none;border:2px dashed var(--mx2-c)}
.mx2-tag{position:absolute;left:2px;top:1px;font:700 12px/1 Arial,'PingFang SC','Microsoft YaHei',sans-serif;color:#fff;background:#000a;border:1px solid var(--mx2-c);border-radius:4px;padding:0 2px;text-shadow:0 0 2px #000}
/* 瘴气：青紫雾 + 波浪斜纹（≈≈） */
.mx2-miasma{box-shadow:inset 0 0 0 2px #8be0c9cc,0 0 6px #4fb89a88}
.mx2-miasma.mx2-ghost{box-shadow:none;border:2px dashed #8be0c9aa}
.mx2-miasma .mx-sym{color:#c9fff0;font-size:11px;background:#0b0f18cc;border-radius:4px;padding:0 2px;left:auto;right:2px;top:1px}
/* 预告条下面第二行的小 HUD：瘴气瓶、本回合攻击倍率、法印实时、衰咒（不压住棋盘上方的状态文字） */
.mx2-hud{position:absolute;left:50%;transform:translateX(-50%);top:100%;margin-top:27px;display:flex;gap:4px;align-items:center;pointer-events:none;font:600 11px/1.5 Arial,'PingFang SC','Microsoft YaHei',sans-serif;color:#f3ead2;white-space:nowrap;z-index:3}
.mx2-hud>span{display:inline-flex;align-items:center;gap:4px;padding:1px 7px;border-radius:10px;background:#0b0f18e6;border:1px solid #c9b47a88}
.mx2-hud .mx2-danger{border-color:#ff5c7a;color:#ffd6dd;box-shadow:0 0 8px #ff5c7a88}
.mx2-hud .mx2-warn{border-color:#b9b9b9;color:#e6e6e6}
.mx2-hud .mx2-ok{border-color:#ffd76a;color:#ffe9a0}
.mx2-bottle{position:relative}
.mx2-bottle i{position:absolute;left:0;bottom:0;width:6px;background:linear-gradient(#9cf2d6,#3a8f77);border-radius:3px;transition:height .15s}
.mx2-bottle b{padding-left:6px}
.mx2-bottle em{font-style:normal;color:#ff9aaa}
.mx2-bottle.mx2-off{opacity:.55;text-decoration:line-through}
/* 敌人身上：徽章（文字 + 数字，读屏另有敌人说明）与盾的后备光环 */
.mx2-host{position:relative}
.mx2-badges{position:absolute;left:50%;top:2px;transform:translateX(-50%);display:flex;flex-wrap:wrap;justify-content:center;gap:2px;pointer-events:none;z-index:4;max-width:120%}
.mx2-badge{display:inline-flex;align-items:center;gap:2px;font:700 11px/1.35 Arial,'PingFang SC','Microsoft YaHei',sans-serif;font-style:normal;color:#fff;background:#0b0f18e6;border:1px solid #ffd76a99;border-radius:8px;padding:0 5px;white-space:nowrap;text-shadow:0 0 2px #000}
.mx2-badge.mx2-danger{border-color:#ff5c7a;color:#ffd6dd;animation:mx2-blink 1s steps(2) infinite}
.mx2-b-uncontrollable{border-style:dashed}
.mx2-sockets{display:inline-flex;gap:1px;margin-left:3px}
.mx2-sockets u{text-decoration:none;font-size:9px;width:12px;height:12px;line-height:12px;text-align:center;border-radius:50%;border:1px solid var(--mx2-c);color:#ffffff88}
.mx2-sockets u.on{background:var(--mx2-c);color:#000}
.mx2-icon{width:14px;height:14px;flex:none;object-fit:contain;vertical-align:-3px}
.mx-chip .mx2-icon{width:14px;height:14px;margin-right:2px;vertical-align:-3px}
.mx2-weary-badge .mx2-icon,.mx2-invert-badge .mx2-icon{width:12px;height:12px;margin-right:2px;vertical-align:-2px}
/* 盾：铺在整只敌人上，正方形、水平居中贴底（容器查询取宽高较小者），不拦点击；受击盾按「本回合已挨几下」点亮一段弧 */
.mx2-auras{position:absolute;inset:0;pointer-events:none;z-index:3;container-type:size}
/* 立绘是底部对齐（object-position:center bottom），盾也贴底放，才会罩在身体上而不是飘在头顶 */
.mx2-aura{position:absolute;left:50%;bottom:0;width:min(96cqw,96cqh);height:min(96cqw,96cqh);transform:translateX(-50%);border-radius:50%;pointer-events:none}
/* 敌人立绘的 img 规则（body.desktop-game .enemy-figure img）会套到徽章和盾上：用更高的特指度复位 */
.mx2-host .mx2-auras img.mx2-shield{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;filter:none;border-radius:0;opacity:.8}
.mx2-host .mx2-badges img.mx2-icon{position:static;width:14px;height:14px;object-fit:contain;object-position:center;filter:none;border-radius:0;opacity:1}
.mx2-host .mx2-aura-hitShield img.mx2-shield:not(.mx2-lit){filter:grayscale(.8) brightness(.7);opacity:.55}
.mx2-host .mx2-aura-hitShield img.mx2-lit{opacity:1;-webkit-mask:conic-gradient(#000 calc(var(--p,0) * 1turn),#0000 0);mask:conic-gradient(#000 calc(var(--p,0) * 1turn),#0000 0)}
.mx2-host .mx2-aura-firstStrikeShield img.mx2-shield{opacity:.7}
.mx2-socket{position:absolute;width:9%;height:9%;transform:translate(-50%,-50%);border-radius:50%;border:2px solid var(--mx2-c,#e9dcae);background:#0b0f18cc;color:#fff;font:700 10px/1 Arial,'PingFang SC','Microsoft YaHei',sans-serif;display:grid;place-items:center;text-decoration:none;box-sizing:border-box}
.mx2-socket.on{background:var(--mx2-c,#e9dcae);color:#000;box-shadow:0 0 8px var(--mx2-c,#e9dcae)}
.mx2-aura-hitShield:not(.mx2-has-art){background:repeating-conic-gradient(#ffd76acc 0 40deg,#0000 40deg 60deg);-webkit-mask:radial-gradient(circle,#0000 64%,#000 66% 70%,#0000 72%);mask:radial-gradient(circle,#0000 64%,#000 66% 70%,#0000 72%)}
.mx2-aura-damageShield:not(.mx2-has-art){clip-path:polygon(25% 3%,75% 3%,100% 50%,75% 97%,25% 97%,0 50%);background:linear-gradient(#7fb4ff33,#3d6dbf44);box-shadow:inset 0 0 0 3px #9cc4ff}
.mx2-aura-multiShield:not(.mx2-has-art),.mx2-aura-fiveShield:not(.mx2-has-art){border:2px solid #e9dcae99;box-shadow:0 0 10px #e9dcae55}
.mx2-aura-firstStrikeShield:not(.mx2-has-art){border-radius:45% 45% 12% 12%;background:linear-gradient(#ffe9a033,#ffe9a011);box-shadow:inset 0 0 0 2px #ffe9a0cc,0 0 14px #ffe9a066}
/* 成员卡：疲惫 = 灰度 60% + ↓剩余回合；生命条：回复颠倒 = 倒置的心 */
.hero-card.mx2-weary{filter:grayscale(.6)}
.mx2-weary-badge{position:absolute;right:3px;bottom:3px;display:inline-flex;align-items:center;font:700 11px/1 Arial;color:#fff;background:#4a4a4ad9;border-radius:6px;padding:2px 4px;pointer-events:none}
.mx2-invert-badge{display:inline-flex;align-items:center;margin-left:6px;font:700 11px/1.4 Arial;color:#ffd6dd;background:repeating-linear-gradient(135deg,#7a1028 0 4px,#a0183a 4px 8px);border-radius:6px;padding:0 5px}
/* 试炼场选关面板（只在 ?lab=mechlib2 出现） */
.mx2-lab{position:fixed;left:12px;bottom:12px;z-index:200;width:260px;padding:8px 10px;background:#0b0f18f2;border:1px solid #c9b47a;border-radius:12px;color:#f3ead2;font:13px/1.45 Arial,'PingFang SC','Microsoft YaHei',sans-serif;box-shadow:0 8px 24px #0009}
.mx2-lab header{display:flex;align-items:center;gap:6px}.mx2-lab header small{opacity:.7;font-size:11px}.mx2-lab header button{margin-left:auto;background:none;border:1px solid #c9b47a88;color:inherit;border-radius:6px;width:22px}
.mx2-lab label{display:flex;flex-direction:column;gap:2px;margin-top:6px;font-size:12px}
.mx2-lab select{background:#141a28;color:inherit;border:1px solid #c9b47a88;border-radius:6px;padding:3px}
.mx2-lab p{margin:6px 0;font-size:12px;opacity:.85}
.mx2-lab-tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.mx2-lab-tiers button{background:#20283a;color:inherit;border:1px solid #c9b47a;border-radius:6px;padding:4px 0;cursor:pointer}
.mx2-lab-tiers button.off{opacity:.45;border-style:dashed}
.mx2-lab.collapsed{width:auto}
.mx2-lab.collapsed label,.mx2-lab.collapsed p,.mx2-lab.collapsed .mx2-lab-tiers{display:none}
@keyframes mx2-flicker{0%,100%{opacity:.9}50%{opacity:.6}}
@keyframes mx2-blink{50%{opacity:.55}}
/* 减少动态：没有闪烁、没有火苗跳动，静态标记照常 */
@media (prefers-reduced-motion: reduce){
  .mx2-evil .mx2-film,.mx2-badge.mx2-danger{animation:none}
  .mx2-bottle i{transition:none}
}
/* 预告条超过 2 枚时只留文字符号（窄屏下图标会把文字挤成省略号） */
.mx-telegraph:has(.mx-chip:nth-child(3)) .mx2-icon{display:none}
@media (max-width:999px){.mx2-hud{font-size:10px;left:0;transform:none}.mx2-badge{font-size:10px}.mx2-lab{width:220px;font-size:12px}}
