/* ====== FF / 艾欧泽亚风格设计令牌（蓝黑·以太蓝） ====== */
:root {
  --acc:#4fc1ff; --acc-light:#b8e4ff; --acc-dark:#2e8fd8; --acc-glow:rgba(79,193,255,.30);
  --bg-deep:#03070e; --bg-panel:#08121f; --bg-card:#0b1a2b;
  --parchment:#e9f2fb; --pm:#a9c4de; --td:#7b9dbd; --line:rgba(90,180,255,.30);
  /* 小字号次要文字（<=12px）专用更强令牌：深色主题与 --td 同值（深色本已达标，观感不变） */
  --td-strong:#7b9dbd;
  --danger:#ff7a6e; --ok:#7fe0a8; --radius-sm:4px; --radius-md:8px;
  --font: "Noto Sans SC","Source Han Sans SC","Microsoft YaHei","PingFang SC",sans-serif;
  --font-serif: "Noto Serif SC","Source Han Serif SC","SimSun",serif;
  --safe-t:env(safe-area-inset-top,0px); --safe-b:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;overflow:hidden;background:var(--bg-deep);color:var(--parchment);
  font-family:var(--font);display:flex;flex-direction:column;align-items:center}
body{max-width:560px;width:100%;}
body.dm{max-width:none}
img{user-select:none;-webkit-user-drag:none}
button{font-family:inherit;cursor:pointer;color:inherit;background:none;border:none}
[hidden]{display:none!important}

/* ====== 顶部：深蓝黑渐隐 + 细线 ====== */
.topbar{flex:0 0 auto;width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:calc(10px + var(--safe-t)) 12px 10px;
  background:linear-gradient(180deg,#0b1c2f,#050a14 72%);
  border-bottom:1px solid var(--line)}
.topbar-left{display:flex;align-items:center;gap:10px;min-width:0}
.avatar-wrap{position:relative;flex:0 0 auto}
.char-avatar{width:50px;height:50px;border-radius:10px;display:grid;place-items:center;font-size:22px;
  background:linear-gradient(135deg,#12314f,#0a2238);border:1px solid var(--acc-dark);color:var(--acc-light);
  overflow:hidden;position:relative;box-shadow:inset 0 0 14px rgba(79,193,255,.16)}
.char-avatar img,.ov-hero .ava img,.ac-ava img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ov-hero .ava,.ac-ava{position:relative;overflow:hidden}
.level-badge{position:absolute;left:-9px;bottom:-8px;background:linear-gradient(145deg,var(--acc-light),var(--acc-dark));
  color:#02111f;font-weight:800;font-size:10px;padding:1px 6px;border-radius:8px;border:1px solid #01050b;
  box-shadow:0 0 8px var(--acc-glow)}
.char-identity{min-width:0}
.char-name{font-size:17px;font-weight:700;color:var(--acc-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.char-sub{font-size:12px;color:var(--td-strong);margin-top:2px}
.char-meta{font-size:11px;color:var(--pm);margin-top:1px}
.topbar-icons{display:flex;gap:6px;flex:0 0 auto}
.icon-btn{width:40px;height:40px;border:1px solid var(--line);border-radius:9px;display:grid;place-items:center;
  font-size:17px;background:rgba(79,193,255,.07);color:var(--acc-light)}
.icon-btn:active{background:rgba(79,193,255,.2)}

/* ====== 内容 ====== */
.content{flex:1 1 auto;width:100%;overflow-y:auto;padding:14px 14px calc(90px + var(--safe-b))}
.page-title{font-size:15px;color:var(--acc);margin-bottom:12px;display:flex;justify-content:space-between;align-items:baseline;
  letter-spacing:.5px;text-transform:uppercase}
.page-title small{font-size:11px;color:var(--td-strong);font-weight:400;text-transform:none;letter-spacing:0}
.placeholder-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.ph-card{min-height:96px;border:1px dashed var(--line);border-radius:var(--radius-md);
  background:linear-gradient(180deg,rgba(79,193,255,.04),rgba(79,193,255,.01));color:var(--td);
  display:flex;align-items:center;justify-content:center;text-align:center;padding:12px;font-size:13px}
.ph-card.tall{grid-column:1/-1;min-height:200px}

/* 参考站式分层模块（FF 化） */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px;margin-bottom:12px}
.mini-stat{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-sm);
  text-align:center;padding:8px 4px;font-size:11px;color:var(--td-strong)}
.mini-stat b{display:block;font-size:16px;color:var(--acc-light);margin-top:2px}
.group-card{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);margin-bottom:12px;overflow:hidden;
  box-shadow:0 2px 10px rgba(0,0,0,.35)}
.group-head{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;font-size:13px;font-weight:700;
  color:var(--acc-light);background:linear-gradient(90deg,rgba(79,193,255,.16),rgba(79,193,255,.02));
  border-bottom:1px solid rgba(90,180,255,.14)}
.group-head span{font-size:11px;color:var(--td-strong);font-weight:400}
.res-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:10px 12px}
.res-slot{border:1px dashed var(--line);border-radius:7px;text-align:center;padding:8px 2px;font-size:13px;color:var(--parchment)}
.chip-row{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px}
.chip{border:1px solid var(--line);border-radius:20px;padding:3px 10px;font-size:12px;color:var(--pm);background:rgba(79,193,255,.07)}
.list-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-top:1px solid rgba(90,180,255,.10);
  font-size:13px;color:var(--parchment)}
.list-ico{width:24px;text-align:center;font-size:15px}

/* 分段控件 */
.seg{display:flex;gap:6px;overflow-x:auto;margin-bottom:12px}
.seg-btn{flex:1 0 auto;min-height:40px;display:flex;align-items:center;justify-content:center;padding:8px 12px;border:1px solid var(--line);border-radius:var(--radius-sm);
  font-size:13px;color:var(--pm);background:rgba(79,193,255,.05)}
.seg-btn.is-active{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));font-weight:700}

/* 更多菜单 */
.menu-list{display:flex;flex-direction:column;gap:8px}
.menu-item{padding:13px 14px;border:1px solid var(--line);border-radius:var(--radius-sm);
  background:var(--bg-card);color:var(--parchment);text-align:left;font-size:14px}
.menu-item:active{background:#0e2842}

/* ====== 环境装饰（水晶/法阵/陆行鸟伙伴） ======
 * 用户 2026-09-13：换成从用户提供的图片里抠出的形象（img/dec/*.png）。
 * · 背景法阵用 **白色线条版**（magic-circle-mono.png）：深色底上黑线稿几乎看不见；
 * · 莫古力/仙人刺源图分辨率低（200×187 / 249×180），显示尺寸按抠图报告的建议封顶，避免糊。 */
body{position:relative}
body::before{content:'';position:fixed;left:50%;bottom:-60px;transform:translateX(-50%);
  width:min(620px,120vw);height:520px;pointer-events:none;z-index:0;
  background:url('../img/dec/magic-circle-mono.png') center/contain no-repeat;opacity:.12}
body::after{content:'';position:fixed;right:-26px;top:96px;width:110px;height:110px;pointer-events:none;z-index:0;
  background:url('../img/dec/crystal.png') center/contain no-repeat;opacity:.22;transform:rotate(8deg)}
.topbar,.content,.bottomnav{position:relative;z-index:1}
.party-deco{display:flex;align-items:center;justify-content:center;gap:16px;margin:20px 0 6px;opacity:.95}
.party-deco img{height:46px;width:auto;object-fit:contain;filter:drop-shadow(0 0 8px rgba(79,193,255,.35))}
.party-deco img[src*="moogle"],.party-deco img[src*="cactuar"]{height:44px}
.party-deco img[src*="magic-circle"]{height:40px;opacity:.85}

/* ====== 底部导航（FF 蓝光） ====== */
.bottomnav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:560px;
  display:flex;background:rgba(4,10,18,.97);border-top:1px solid var(--line);
  padding:6px 4px calc(6px + var(--safe-b));z-index:20}
body.dm .bottomnav{display:none}
.nav-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;
  color:var(--td);font-size:10px;border-radius:7px}
.nav-btn .nav-ico{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;
  font-size:19px;line-height:1;filter:drop-shadow(0 0 6px rgba(79,193,255,.25))}
/* 手绘 SVG 图标：填满 22×22、随 currentColor 取色。
 * 用户 2026-09-15「那几个图标用来装饰下方主选项卡」⇒ 五个形象图也做同级图标（img，等比缩放 + 投影）。 */
.nav-btn .nav-ico svg{width:22px;height:22px;display:block}
.nav-btn .nav-ico img{width:22px;height:22px;object-fit:contain;display:block;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}
.nav-btn.is-active{color:var(--acc-light);background:rgba(79,193,255,.12);font-weight:700}
/* 底部导航「文字」是小字号次要文字 → 用 --td-strong；图标 .nav-ico 仍继承 --td（保持既有观感，图标不参与本次改动） */
.nav-btn:not(.is-active) .nav-ico{color:var(--td)}
.nav-btn:not(.is-active) .nav-txt{color:var(--td-strong)}

/* 悬浮骰子（用户 2026-09-13 换图：按钮面改用 js/dice3d.js 现画的立体 d20，img/icons/dice-d20.png） */
.fab{position:fixed;right:14px;bottom:calc(90px + var(--safe-b));width:52px;height:52px;border-radius:50%;
  background:linear-gradient(145deg,var(--acc-light),var(--acc-dark));color:#02111f;font-weight:800;
  font-size:13px;box-shadow:0 4px 16px var(--acc-glow);z-index:21;
  background-image:url('../img/icons/dice-d20.png'),linear-gradient(145deg,var(--acc-light),var(--acc-dark));
  background-size:82% 82%,cover;background-position:center,center;background-repeat:no-repeat}
.fab .fab-txt{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
body.dm .fab{display:none}

/* DM 横屏（详细样式见文末 “DM 端 FR-9” 区块） */
body.dm .content{max-width:none}
.dm-view{padding:0}

/* ====== 阶段 3：角色创建向导（FF 蓝黑） ====== */
.wz-overlay{position:fixed;inset:0;z-index:100;background:rgba(1,4,9,.74);display:flex;justify-content:center}
.wz-card{width:100%;max-width:560px;height:100%;display:flex;flex-direction:column;position:relative;
  background:linear-gradient(180deg,#081624,#04090f 90%);
  border-left:1px solid var(--line);border-right:1px solid var(--line);animation:wzUp .22s ease}
@keyframes wzUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.wz-head{display:flex;align-items:center;gap:8px;padding:calc(12px + var(--safe-t)) 14px 8px;border-bottom:1px solid rgba(90,180,255,.16);
  background:linear-gradient(90deg,rgba(79,193,255,.14),rgba(79,193,255,.02))}
.wz-title{flex:1;font-size:15px;font-weight:800;color:var(--acc-light);letter-spacing:.5px}
.wz-close{width:40px;height:40px;border:1px solid var(--line);border-radius:9px;background:rgba(79,193,255,.07);
  color:var(--td);font-size:15px;line-height:1}
.wz-close:active{background:rgba(79,193,255,.22);color:var(--acc-light)}
.wz-steps{display:flex;align-items:center;padding:10px 16px 6px;gap:0}
.wz-dot{flex:1;text-align:center;font-size:10px;color:var(--td-strong);position:relative;padding-top:22px}
.wz-dot::before{content:attr(data-i);position:absolute;top:2px;left:50%;transform:translateX(-50%);
  width:18px;height:18px;line-height:18px;border-radius:50%;font-size:11px;font-weight:700;color:var(--pm);
  border:1px solid var(--line);background:var(--bg-card)}
.wz-dot.is-cur{color:var(--acc-light);font-weight:700}
.wz-dot.is-cur::before{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b;
  box-shadow:0 0 10px var(--acc-glow)}
.wz-dot.is-done::before{content:'✓';color:#02111f;background:rgba(79,193,255,.55);border-color:#01050b}
.wz-body{flex:1;overflow-y:auto;padding:12px 16px calc(16px + var(--safe-b))}
.wz-err{display:none;margin:0 0 10px;padding:8px 10px;border:1px solid rgba(255,122,110,.5);border-radius:var(--radius-sm);
  color:var(--danger);background:rgba(255,122,110,.08);font-size:12px}
.wz-err.show{display:block}
.wz-hint{font-size:11px;color:var(--td-strong);margin:2px 0 10px}
.wz-foot{display:flex;gap:10px;padding:10px 14px calc(12px + var(--safe-b));border-top:1px solid rgba(90,180,255,.14);
  background:rgba(4,10,18,.9)}
.wz-btn{flex:1;padding:12px 10px;border:1px solid var(--line);border-radius:9px;background:var(--bg-card);
  color:var(--pm);font-size:14px}
.wz-btn:active{background:#0e2842}
.wz-btn:disabled{opacity:.4}
.wz-btn.primary{flex:2;background:linear-gradient(180deg,var(--acc-light),var(--acc));color:#02111f;font-weight:800;border-color:#01050b}
.wz-btn.ghost{border-color:rgba(255,122,110,.35);color:var(--danger);background:rgba(255,122,110,.06)}
.wz-loading{text-align:center;color:var(--td);padding:40px 10px;font-size:13px}
.wz-field{display:block;margin-bottom:12px}
.wz-field>span{display:block;font-size:12px;color:var(--pm);margin-bottom:4px}
.wz-input,.wz-select{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:var(--radius-sm);
  background:rgba(3,10,20,.8);color:var(--parchment);font-family:inherit;font-size:14px}
.wz-input:focus,.wz-select:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.wz-note{font-size:11px;color:var(--td-strong);line-height:1.6}

/* 种族 / 职业 选择卡 */
.pick-grid{display:flex;flex-direction:column;gap:8px}
.pick-card{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);padding:11px 12px;
  text-align:left;font-size:14px;color:var(--parchment)}
.pick-card small{display:block;font-size:11px;color:var(--td-strong);margin-top:2px}
.pick-card.is-sel{border-color:var(--acc);background:linear-gradient(90deg,rgba(79,193,255,.16),rgba(79,193,255,.04));
  box-shadow:inset 0 0 0 1px var(--acc);color:var(--acc-light);font-weight:700}
.pick-card:active{background:#0e2842}
.pick-detail{border:1px solid var(--line);border-radius:var(--radius-md);background:linear-gradient(180deg,rgba(79,193,255,.05),rgba(79,193,255,.01));
  margin-top:10px;padding:12px;font-size:13px;color:var(--parchment)}
.pick-detail h4{color:var(--acc);font-size:14px;margin-bottom:6px}
.pick-detail .wz-note{margin-bottom:8px}
.dt-feat{border-top:1px dashed rgba(90,180,255,.18);padding:8px 0 0;margin-top:8px}
.dt-feat b{display:block;font-size:12px;color:var(--acc-light);margin-bottom:2px}
.dt-feat p{font-size:12px;color:var(--pm);line-height:1.6}
.radio-row{display:flex;gap:10px;margin:8px 0}
.radio-row label{flex:1;border:1px solid var(--line);border-radius:var(--radius-sm);text-align:center;padding:9px 4px;
  font-size:13px;color:var(--pm);background:rgba(79,193,255,.04)}
.radio-row label.is-sel{color:#02111f;font-weight:800;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}
.radio-row input{position:absolute;opacity:0;pointer-events:none}

/* 属性区 */
.abil-tabs{display:flex;gap:6px;margin:4px 0 10px;flex-wrap:wrap}
.abil-tab{border:1px solid var(--line);border-radius:20px;display:inline-flex;align-items:center;min-height:40px;padding:6px 12px;font-size:12px;color:var(--pm);background:rgba(79,193,255,.05)}
.abil-tab.is-sel{color:#02111f;font-weight:700;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}
.abil-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.abil-row{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg-card);padding:8px}
.abil-row .lab{font-size:11px;color:var(--td-strong)}
.abil-row .val{display:flex;align-items:center;gap:4px;margin:6px 0 2px}
.abil-row .val b{flex:1;font-size:22px;color:var(--acc-light);text-align:center;font-variant-numeric:tabular-nums}
.abil-row .mod{font-size:12px;color:var(--pm);text-align:center}
.step{width:40px;height:40px;border-radius:7px;border:1px solid var(--line);background:rgba(79,193,255,.08);color:var(--acc-light);
  font-size:15px;line-height:1}
.step:disabled{opacity:.3}
.abil-sel{width:100%;margin:4px 0;padding:5px;background:#061120;color:var(--parchment);border:1px solid var(--line);border-radius:5px;font-size:13px}
.abil-dice{font-size:11px;color:var(--td-strong);text-align:center;margin-top:2px}
.point-left{border:1px solid rgba(79,193,255,.35);background:rgba(79,193,255,.07);border-radius:var(--radius-sm);
  padding:8px 10px;font-size:12px;color:var(--acc-light);margin-bottom:10px;text-align:center}
.point-left.over{color:var(--danger);border-color:rgba(255,122,110,.55);background:rgba(255,122,110,.08)}
.hist-box{border:1px dashed var(--line);border-radius:var(--radius-sm);padding:8px 10px;margin-top:4px}
.hist-box .hb-t{font-size:11px;color:var(--td-strong);margin-bottom:4px}
.hist-item{font-size:11px;color:var(--pm);padding:1px 0;font-variant-numeric:tabular-nums}
.hist-item b{color:var(--acc-light)}
.hist-item .dropped{color:#ff9c8f;text-decoration:line-through}

/* 出身搜索 */
.bg-search{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius-sm);background:rgba(3,10,20,.8);
  color:var(--parchment);font-family:inherit;font-size:13px;margin-bottom:8px}
.bg-search:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.bg-list{display:flex;flex-direction:column;gap:6px;max-height:190px;overflow-y:auto;border:1px solid rgba(90,180,255,.16);
  border-radius:var(--radius-sm);padding:6px;margin-bottom:8px}
.bg-opt{text-align:left;font-size:13px;color:var(--pm);padding:7px 9px;border-radius:5px;background:rgba(79,193,255,.03)}
.bg-opt small{display:block;color:var(--td-strong);font-size:11px}
.bg-opt.is-sel{background:linear-gradient(90deg,rgba(79,193,255,.2),rgba(79,193,255,.05));color:var(--acc-light);font-weight:700}

/* 步骤 5 汇总 */
.sum-card{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);margin-bottom:10px;overflow:hidden}
.sum-head{padding:8px 12px;font-size:12px;font-weight:800;color:var(--acc-light);background:linear-gradient(90deg,rgba(79,193,255,.16),rgba(79,193,255,.02));
  border-bottom:1px solid rgba(90,180,255,.14)}
.sum-row{display:flex;justify-content:space-between;gap:8px;padding:7px 12px;font-size:13px;color:var(--parchment);border-top:1px solid rgba(90,180,255,.08)}
.sum-row:first-of-type{border-top:none}
.sum-row .k{color:var(--td);flex:0 0 88px}
.sum-row .v{flex:1;text-align:right;color:var(--acc-light)}
.sum-feat{padding:6px 12px 10px;border-top:1px solid rgba(90,180,255,.08);font-size:12px;color:var(--pm);line-height:1.6}
.sum-feat b{color:var(--acc-light)}

/* 菜单「继续冒险」当前角色卡 */
.active-card{border:1px solid var(--line);border-radius:var(--radius-md);background:linear-gradient(135deg,#0c2036,#081624);
  padding:12px;margin-bottom:12px;display:flex;gap:10px;align-items:center}
.ac-ava{width:42px;height:42px;flex:0 0 auto;border-radius:9px;display:grid;place-items:center;font-size:19px;
  background:linear-gradient(135deg,#12314f,#0a2238);border:1px solid var(--acc-dark);color:var(--acc-light)}
.ac-main{flex:1;min-width:0}
.ac-name{font-size:15px;font-weight:800;color:var(--acc-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ac-sub{font-size:11px;color:var(--td-strong);margin-top:1px}
.ac-meta{font-size:11px;color:var(--pm);margin-top:1px}
.ac-empty{font-size:12px;color:var(--td-strong);line-height:1.5}

/* ====== FR-4 存档管理（更多页 · 存档 group-card，位于 #activeCard 之后） ====== */
.save-card{margin-top:0}
.save-list{display:flex;flex-direction:column}
.save-row{display:flex;align-items:center;gap:10px;width:100%;padding:11px 12px;text-align:left;
  border:none;border-top:1px solid rgba(90,180,255,.10);background:transparent;color:var(--parchment);cursor:pointer}
.save-row:first-child{border-top:none}
.save-row:active,.save-row:focus-visible{background:rgba(79,193,255,.10);outline:none}
.save-row.is-cur{background:linear-gradient(90deg,rgba(79,193,255,.12),rgba(79,193,255,.02));box-shadow:inset 2px 0 0 var(--acc)}
.sv-ava{position:relative;width:42px;height:42px;flex:0 0 auto;border-radius:9px;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(135deg,#12314f,#0a2238);border:1px solid var(--acc-dark)}
.sv-ava img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.sv-ava .sv-ph{font-size:19px;font-weight:700;color:var(--acc-light);text-shadow:0 0 8px var(--acc-glow)}
.sv-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sv-name{font-size:14px;font-weight:800;color:var(--acc-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.sv-sub{font-size:11px;color:var(--td-strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sv-meta{font-size:11px;color:var(--pm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sv-side{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:6px}
.sv-lv{font-size:10px;font-weight:800;color:#02111f;background:linear-gradient(145deg,var(--acc-light),var(--acc-dark));
  padding:1px 7px;border-radius:9px;border:1px solid #01050b;box-shadow:0 0 6px var(--acc-glow);line-height:1.5}
.sv-del{width:40px;height:40px;border:1px solid rgba(255,122,110,.4);border-radius:8px;background:rgba(255,122,110,.06);
  color:var(--danger);font-size:14px;line-height:1;display:grid;place-items:center;flex:0 0 auto}
.sv-del:active{background:rgba(255,122,110,.25)}
.save-empty{padding:16px 12px;font-size:12px;color:var(--td-strong);line-height:1.6;text-align:center}
.save-import{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:11px 12px;
  border:none;border-top:1px dashed rgba(90,180,255,.22);background:rgba(79,193,255,.03);color:var(--acc-light);
  font-size:13px;text-align:center}
.save-import:active{background:rgba(79,193,255,.14)}

/* 轻提示（toast） */
.toast{position:fixed;left:50%;bottom:calc(86px + var(--safe-b));transform:translateX(-50%) translateY(8px);z-index:80;
  max-width:min(92vw,440px);padding:9px 18px;border:1px solid var(--acc-dark);border-radius:20px;
  background:linear-gradient(180deg,#0d2a44,#081625);color:var(--acc-light);font-size:13px;text-align:center;
  box-shadow:0 6px 20px rgba(0,0,0,.55),0 0 14px var(--acc-glow);opacity:0;pointer-events:none;
  transition:opacity .18s ease,transform .18s ease}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ====== 阶段 3：角色总览 ====== */
.ov-hero{border:1px solid var(--line);border-radius:var(--radius-md);background:linear-gradient(135deg,#0c2036,#081624);
  padding:12px;margin-bottom:12px;display:flex;gap:12px;align-items:center}
.ov-hero .ava{width:58px;height:58px;border-radius:12px;flex:0 0 auto;display:grid;place-items:center;font-size:26px;
  background:linear-gradient(135deg,#12314f,#0a2238);border:1px solid var(--acc-dark);color:var(--acc-light);
  box-shadow:inset 0 0 14px rgba(79,193,255,.18)}
.ov-hero .who{flex:1;min-width:0}
.ov-hero .who .n{font-size:18px;font-weight:800;color:var(--acc-light)}
.ov-hero .who .s{font-size:12px;color:var(--td-strong);margin-top:2px}
.ov-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.ov-stat{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius-sm);text-align:center;padding:9px 4px}
.ov-stat .b{font-size:19px;color:var(--acc-light);font-weight:800;font-variant-numeric:tabular-nums}
.ov-stat .m{font-size:11px;color:var(--td-strong);margin-top:1px}
.ov-abils{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.ov-ab .lab{font-size:11px;color:var(--td-strong);text-align:center}
.ov-ab .v{font-size:22px;color:var(--acc-light);text-align:center;font-weight:800;font-variant-numeric:tabular-nums}
.ov-ab .m{font-size:12px;color:var(--pm);text-align:center}
.ov-rows{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);overflow:hidden;margin-bottom:12px}
.ov-row{display:flex;gap:8px;padding:9px 12px;border-top:1px solid rgba(90,180,255,.08);font-size:13px;color:var(--parchment)}
.ov-row:first-child{border-top:none}
.ov-row .k{color:var(--td-strong);flex:0 0 86px}
.ov-row .v{flex:1;color:var(--acc-light);text-align:right;white-space:pre-wrap}
.ov-card-title{font-size:13px;color:var(--acc-light);font-weight:800;margin:4px 0 8px;display:flex;align-items:center;gap:6px}
.res-slot.dim{color:var(--td);border-style:dashed}
.chip.dim{color:var(--td-strong)}

/* ================================================================
   阶段3：向导 · 种族/职业 带图卡片网格（附加样式，覆盖 .pick-grid/.pick-card）
   FF 蓝黑视觉；430px 下 2 列，宽屏自动多列。
   ================================================================ */
.pick-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:10px;
  margin-bottom:10px;
}
.pick-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:0;
  padding:0 0 10px;
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:linear-gradient(180deg,rgba(79,193,255,.05),rgba(79,193,255,.01));
  overflow:hidden;
  text-align:left;
}
.pick-card:active{background:#0e2842}
.pick-card.is-sel{
  border-color:var(--acc);
  background:linear-gradient(180deg,rgba(79,193,255,.20),rgba(79,193,255,.05));
  box-shadow:0 0 0 1px var(--acc),0 0 14px var(--acc-glow);
}
/* 图片区 */
.pc-art{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:3/2;
  overflow:hidden;
  background:
    radial-gradient(120% 100% at 50% 0%,rgba(79,193,255,.16),rgba(79,193,255,.02) 60%),
    linear-gradient(180deg,#0a1f35,#050d18);
  border-bottom:1px solid rgba(90,180,255,.16);
}
.pc-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:top center;
  opacity:0;
  transition:opacity .25s ease;
}
.pc-img.is-ok{opacity:1}
.pc-img.is-err{display:none}
/* 占位：水晶图标 + 首字 */
.pc-ph{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  color:var(--acc-light);
  text-shadow:0 0 10px var(--acc-glow);
}
.pc-ph-icon{width:34px;height:34px;opacity:.55;filter:drop-shadow(0 0 8px rgba(79,193,255,.45))}
.pc-ph b{font-family:var(--font-serif);font-size:34px;line-height:1;font-weight:800;opacity:.85}
/* 文字区 */
.pc-txt{display:block;padding:0 10px;min-width:0}
.pc-txt b{display:block;font-size:14px;font-weight:800;color:var(--acc-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-txt em{
  display:block;
  font-style:normal;
  font-size:10px;
  font-weight:600;
  letter-spacing:.4px;
  color:var(--td-strong);
  margin-top:1px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pc-txt small{
  display:block;
  font-size:11px;
  color:var(--acc);
  margin-top:5px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pc-txt p{
  font-size:11px;
  line-height:1.55;
  color:var(--pm);
  margin-top:4px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
/* 选中卡片：图片区也点亮 */
.pick-card.is-sel .pc-art{box-shadow:inset 0 0 0 1px rgba(79,193,255,.35)}
.pick-card.is-sel .pc-ph-icon{opacity:.9}
/* 430px 及以下手机：2 列小卡 */
@media (max-width:430px){
  .pick-grid{grid-template-columns:repeat(2,1fr);gap:8px}
  .pc-art{aspect-ratio:3/2}
}
/* 更宽时最高 3-4 列，避免大屏一行太长 */
@media (min-width:560px){
  .pick-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
}

/* ================================================================
   阶段3：向导 v7（参考式 7 步）附加样式
   第 N/7 步标题 · 5 种属性手法 · 起始装备方案 · 商店 · 立绘选择器
   ================================================================ */
/* 顶部：标题 + “第 N/7 步”徽标 */
.wz-title{display:flex;align-items:center;gap:8px;min-width:0}
.wz-title>span:first-child{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wz-stepnum{flex:0 0 auto;font-size:10px;font-weight:800;color:#02111f;
  background:linear-gradient(145deg,var(--acc-light),var(--acc-dark));
  padding:2px 8px;border-radius:10px;box-shadow:0 0 8px var(--acc-glow)}
/* 步骤内容大标题 */
.wz-h2{font-size:17px;font-weight:800;color:var(--acc-light);margin:0 0 4px;letter-spacing:.4px}
.wz-h2 small{font-size:11px;color:var(--td-strong);font-weight:400;margin-left:8px;letter-spacing:0}

/* 自由输入（六维 1–30） */
.abil-inp{width:100%;text-align:center;background:#061120;color:var(--acc-light);
  border:1px solid var(--acc-dark);border-radius:6px;padding:6px 2px;
  font-size:19px;font-weight:800;font-family:inherit;font-variant-numeric:tabular-nums}
.abil-inp:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}

/* 起始装备方案（职业 A/B/C + 逐行单选 + 必含行） */
.eq-chips{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 8px}
.eq-chip{border:1px solid var(--line);border-radius:16px;display:inline-flex;align-items:center;min-height:40px;padding:6px 10px;font-size:12px;
  color:var(--pm);background:rgba(79,193,255,.05)}
.eq-chip.is-sel{color:#02111f;font-weight:800;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}
.eq-chip:active{background:rgba(79,193,255,.2)}
.eq-row{border:1px dashed rgba(90,180,255,.32);background:rgba(79,193,255,.03);
  border-radius:8px;padding:8px 10px;margin:8px 0}
.eq-row.req{border-style:solid;border-color:rgba(127,224,168,.32);background:rgba(127,224,168,.04)}
.eq-q{font-size:11px;font-weight:800;color:var(--acc);letter-spacing:.5px}
.eq-row.req .eq-q{color:var(--ok)}
.eq-opts{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.eq-opts label{display:block;border:1px solid var(--line);border-radius:6px;padding:7px 9px;
  font-size:12px;line-height:1.55;color:var(--pm);background:rgba(79,193,255,.04)}
.eq-opts label.is-sel{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));
  border-color:#01050b;font-weight:700}
.eq-opts label:active{background:rgba(79,193,255,.16)}
.eq-opts input{position:absolute;opacity:0;pointer-events:none}
.eq-txt{font-size:13px;color:var(--parchment);line-height:1.6;margin-top:4px}

/* 商店 */
.shop-bal{color:var(--ok);font-weight:800;font-size:15px;margin:0 2px}
.sum-head #shopBal{color:var(--ok);font-weight:800;font-size:15px;font-style:normal}
.shop-cat{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);
  margin-bottom:10px;overflow:hidden}
.shop-cat-t{display:flex;justify-content:space-between;align-items:baseline;padding:8px 12px;
  font-size:13px;font-weight:800;color:var(--acc-light);
  background:linear-gradient(90deg,rgba(79,193,255,.14),rgba(79,193,255,.02));
  border-bottom:1px solid rgba(90,180,255,.14)}
.shop-cat-t span{font-size:11px;color:var(--td-strong);font-weight:400}
.shop-row{display:flex;align-items:center;gap:8px;padding:8px 12px;border-top:1px solid rgba(90,180,255,.08)}
.shop-row:first-child{border-top:none}
.shop-info{flex:1;min-width:0}
.shop-info b{display:block;font-size:13px;color:var(--parchment);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shop-info em{font-style:normal;font-size:10px;color:var(--td-strong);margin-left:6px}
.shop-info small{display:block;font-size:10px;color:var(--td-strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shop-price{flex:0 0 auto;font-size:12px;font-weight:800;color:var(--acc-light);font-variant-numeric:tabular-nums}
.shop-btn{flex:0 0 auto;width:40px;height:40px;border:1px solid var(--line);border-radius:8px;
  background:rgba(79,193,255,.08);color:var(--acc-light);font-size:17px;line-height:1}
.shop-btn:active{background:rgba(79,193,255,.24)}
.shop-btn.off{opacity:.3}
.shop-btn:disabled{opacity:.3}
.shop-btn.rm{width:auto;padding:0 10px;font-size:12px;border-color:rgba(255,122,110,.4);color:var(--danger);background:rgba(255,122,110,.06)}
.shop-row.bought .shop-info b{color:var(--ok)}

/* 立绘（第 7 步）与选择器 */
.portrait-row{display:flex;gap:14px;padding:10px 12px;align-items:center}
.portrait-box{position:relative;flex:0 0 92px;width:92px;height:122px;border:1px dashed var(--line);
  border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(120% 100% at 50% 0%,rgba(79,193,255,.16),rgba(79,193,255,.02) 60%),#081624}
.portrait-box.has{border-style:solid;border-color:var(--acc-dark)}
.portrait-box img{width:100%;height:100%;object-fit:cover;display:block}
.portrait-ph{font-family:var(--font-serif);font-size:38px;font-weight:800;color:var(--acc-light);
  text-shadow:0 0 12px var(--acc-glow)}
.portrait-side{flex:1;min-width:0}
.wz-pop{position:absolute;inset:0;z-index:60;background:rgba(1,4,9,.94);
  display:flex;align-items:center;justify-content:center;padding:12px}
.wz-pop-card{width:100%;max-height:100%;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#0a1c30,#060e18);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.wz-pop-head{display:flex;align-items:center;gap:10px;padding:11px 14px;
  border-bottom:1px solid rgba(90,180,255,.16);background:linear-gradient(90deg,rgba(79,193,255,.14),rgba(79,193,255,.02))}
.wz-pop-head b{font-size:14px;color:var(--acc-light)}
.wz-pop-head .wz-note{flex:1;min-width:0;margin:0}
.wz-pop-head .wz-close{margin-left:auto}
.pot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:9px;
  padding:12px;overflow-y:auto;max-height:66vh}
.pot-item{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:9px;
  background:var(--bg-card);overflow:hidden;padding:0 0 8px;text-align:left}
.pot-item.is-sel{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc),0 0 12px var(--acc-glow)}
.pot-img{aspect-ratio:3/2;background:#0a1f35;overflow:hidden;display:flex;border-bottom:1px solid rgba(90,180,255,.14)}
.pot-img img{width:100%;height:100%;object-fit:cover}
.pot-item.up{justify-content:center;align-items:center;gap:5px;border-style:dashed;min-height:112px;cursor:pointer}
.pot-item.up:active{background:#0e2842}
.pot-up-ico{font-size:26px;filter:drop-shadow(0 0 8px rgba(79,193,255,.5))}
.pot-t{display:block;font-size:11px;color:var(--pm);text-align:center;padding:6px 4px 0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 向导头/底小屏字号微调（7 步标签更密） */
@media (max-width:430px){
  .wz-dot{font-size:9px;padding-top:20px}
  .wz-dot::before{width:16px;height:16px;line-height:16px;font-size:10px}
  .wz-h2{font-size:16px}
}

/* ================================================================
   阶段 v2：选择器视觉与交互精修 + 特性可点看详情
   (1) 种族/职业选卡：大图完整显示（object-fit:contain）、无叠加装饰
   (2) 第 1 步种族大预览 + ◀/▶ 目录轮换
   (3) 第 2 步职业：横滑卡片 + 详情弹层（图轮播/创建/1 级特性）
   (4) 特性详情弹层（js/feat-pop.js）
   ================================================================ */
/* —— 选卡图框：统一 contain、深色面板、占位只出现在无图时 —— */
.pick-card{display:flex;flex-direction:column;gap:6px;padding:0 0 10px;overflow:hidden}
.art-fill{
  position:relative;display:block;width:100%;aspect-ratio:3/4;overflow:hidden;
  background:
    radial-gradient(120% 100% at 50% 0%,rgba(79,193,255,.16),rgba(79,193,255,.02) 62%),
    linear-gradient(180deg,#0a1f35,#040b14);
  border-bottom:1px solid rgba(90,180,255,.16);
}
.art-fill .art-img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:contain;object-position:center;opacity:0;transition:opacity .25s ease;
}
.art-fill .art-img.is-ok{opacity:1}
.art-fill .pc-ph{position:absolute;inset:0;display:flex;flex-direction:column;gap:6px;
  align-items:center;justify-content:center;color:var(--acc-light);text-shadow:0 0 10px var(--acc-glow)}
.ph-cry{width:14px;height:14px;border:1px solid var(--acc);background:rgba(79,193,255,.22);
  transform:rotate(45deg);opacity:.75;box-shadow:0 0 8px var(--acc-glow)}
.art-fill .pc-ph b{font-family:var(--font-serif);font-size:30px;line-height:1;font-weight:800;opacity:.9}
.pick-card.is-sel .art-fill{box-shadow:inset 0 0 0 1px rgba(79,193,255,.4)}
.pc-txt{padding:0 10px}
.pc-txt p{-webkit-line-clamp:1}

/* —— 第 1 步：种族大预览（含分支/性别联动 + 目录轮换） —— */
.rz-prev{display:flex;gap:12px;align-items:stretch;margin:10px 0 4px;
  border:1px solid var(--line);border-radius:10px;padding:10px;
  background:linear-gradient(180deg,rgba(79,193,255,.05),rgba(79,193,255,.01))}
.rz-frame{position:relative;flex:0 0 148px;width:148px;aspect-ratio:3/4;overflow:hidden;
  border:1px solid rgba(90,180,255,.25);border-radius:8px;
  background:
    radial-gradient(120% 100% at 50% 0%,rgba(79,193,255,.18),rgba(79,193,255,.02) 60%),
    linear-gradient(180deg,#0b2240,#060f1c);
  display:flex;align-items:center;justify-content:center}
.rz-img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.rz-ph{font-family:var(--font-serif);font-size:44px;font-weight:800;color:var(--acc-light);
  text-shadow:0 0 14px var(--acc-glow)}
.rz-side{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px;justify-content:center}
.rz-caprow{display:flex;align-items:center;gap:8px}
.rz-arr{flex:0 0 36px;width:36px;height:36px;border:1px solid var(--acc-dark);border-radius:9px;
  background:rgba(79,193,255,.10);color:var(--acc-light);font-size:15px;line-height:1}
.rz-arr:active{background:rgba(79,193,255,.3)}
.rz-arr.off{opacity:.35;pointer-events:none}
.rz-cap{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rz-fname{display:block;font-size:11px;color:var(--acc);word-break:break-all;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rz-cnt{display:block;font-size:11px;color:var(--td-strong)}
.rz-tiprow .rz-tip{display:block;font-size:10px;color:var(--td-strong);line-height:1.5}
.rz-fields{margin-top:8px}
.ft-label{font-size:12px;font-weight:800;color:var(--acc-light);margin:10px 0 4px}
.ft-list{display:flex;flex-direction:column;gap:6px}

/* —— 第 2 步：职业横滑大卡 —— */
.cls-track{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 10px;margin:2px -2px 4px;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  touch-action:pan-x;scrollbar-width:none;overscroll-behavior-x:contain}
.cls-track::-webkit-scrollbar{display:none;height:0}
.cls-track::-webkit-scrollbar-thumb{display:none}
.cls-card{position:relative;flex:0 0 74%;max-width:340px;scroll-snap-align:center;
  border:1px solid var(--line);border-radius:12px;overflow:hidden;
  background:linear-gradient(180deg,rgba(79,193,255,.05),rgba(79,193,255,.01));
  display:flex;flex-direction:column;cursor:pointer}
.cls-card:active{background:#0e2842}
.cls-card.is-sel{border-color:var(--acc);
  box-shadow:0 0 0 1px var(--acc),0 0 16px var(--acc-glow)}
.cc-art{position:relative;aspect-ratio:3/4;width:100%;overflow:hidden;
  background:
    radial-gradient(120% 100% at 50% 0%,rgba(79,193,255,.18),rgba(79,193,255,.02) 62%),
    linear-gradient(180deg,#0b2240,#060f1c);
  border-bottom:1px solid rgba(90,180,255,.16);
  display:flex;align-items:center;justify-content:center}
.cc-art .cc-img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.cc-art .pc-ph b{font-family:var(--font-serif);font-size:38px;font-weight:800;color:var(--acc-light)}
.cc-txt{padding:8px 10px 4px}
.cc-txt b{display:block;font-size:16px;font-weight:800;color:var(--acc-light)}
.cc-txt em{display:block;font-style:normal;font-size:10px;color:var(--td-strong);margin-top:1px}
.cc-txt small{display:block;font-size:11px;color:var(--acc);margin-top:4px}
.cc-btn{margin:8px 10px 10px;display:flex;align-items:center;justify-content:center;min-height:40px;padding:8px 6px;border:1px solid var(--acc-dark);border-radius:8px;
  background:rgba(79,193,255,.08);color:var(--acc-light);font-size:12px;font-weight:700}
.cc-btn:active{background:rgba(79,193,255,.28)}
.cc-ok{position:absolute;top:8px;right:8px;font-size:10px;font-weight:800;color:#02111f;
  background:linear-gradient(145deg,var(--acc-light),var(--acc));
  padding:2px 8px;border-radius:10px;box-shadow:0 0 8px var(--acc-glow)}
.cls-brief h4{margin-bottom:2px}

/* —— drg / monk 卡面放大（第三批 B2 选择①：CSS 侧放大画面，不裁切内容） ——
 * 这两张职业主图是「斜向构图 + 大块留白」的画稿（drg 938×758 横构图，人物只占中段约 1/4 宽；
 * monk 690×690 方构图），放进统一的 3:4 画框时会出现大条信箱留白，人物显得偏小。
 * 处理：① 该职业卡片加宽（画面整体随之变大）；② 画框按原图宽高比（留白消失，画面正好铺满框）。
 * 只改显示比例，不裁切画面内容（object-fit 仍为 contain、无 transform 缩放）；
 * 几何依据：tools/art-bbox.mjs 的 16×16 暗像素密度图 + tools/e2e-batch3.mjs 的卡面几何断言。 */
.cls-card:has(.cc-img[src*="classes/drg"]),
.cls-card:has(.cc-img[src*="classes/monk"]) { flex: 0 0 92%; max-width: 420px; }
.cls-card:has(.cc-img[src*="classes/drg"]) .cc-art { aspect-ratio: 938 / 758; }
.cls-card:has(.cc-img[src*="classes/monk"]) .cc-art { aspect-ratio: 1 / 1; }
.cd-frame:has(.cd-img[src*="classes/drg"]) { aspect-ratio: 938 / 758; }
.cd-frame:has(.cd-img[src*="classes/monk"]) { aspect-ratio: 1 / 1; }

/* —— 职业详情弹层（wzPot 内） —— */
.cd-card{max-height:100%}
.cd-scroll{overflow-y:auto;padding:12px 14px 14px;-webkit-overflow-scrolling:touch}
.cd-imgsec{margin-bottom:12px}
.cd-imgwrap{position:relative;display:flex;align-items:center;gap:8px;
  border:1px solid var(--line);border-radius:10px;overflow:hidden;
  background:
    radial-gradient(120% 100% at 50% 0%,rgba(79,193,255,.16),rgba(79,193,255,.02) 60%),
    linear-gradient(180deg,#0a1f35,#050d18)}
.cd-frame{position:relative;flex:1;aspect-ratio:4/3;display:flex;align-items:center;justify-content:center}
.cd-frame .cd-img,.cd-imgwrap .cd-img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}
.cd-frame.cd-none{color:var(--td)}
.cd-arrow{position:absolute;z-index:2;top:50%;transform:translateY(-50%);
  width:34px;height:34px;border:1px solid var(--acc-dark);border-radius:9px;
  background:rgba(2,10,20,.78);color:var(--acc-light);font-size:14px}
.cd-arrow[data-dir="-1"]{left:8px}
.cd-arrow[data-dir="1"]{right:8px}
.cd-arrow:active{background:rgba(79,193,255,.4)}
.cd-imginfo{font-size:10px;color:var(--td-strong);margin-top:5px;text-align:center;word-break:break-all}
.cd-sec{border:1px solid rgba(90,180,255,.14);border-radius:10px;margin:10px 0 0;
  padding:10px 12px;background:rgba(79,193,255,.03)}
.cd-h{font-size:12px;font-weight:800;color:var(--acc);margin-bottom:6px}
.cd-txt{font-size:12px;color:var(--pm);line-height:1.7}
.cd-row{display:flex;gap:8px;padding:5px 0;border-top:1px dashed rgba(90,180,255,.14);
  font-size:12px;color:var(--parchment)}
.cd-row:first-of-type{border-top:none}
.cd-row .k{flex:0 0 70px;color:var(--td-strong)}
.cd-row.wide .k{flex:0 0 70px}
.cd-row .v{flex:1;color:var(--pm);line-height:1.6;white-space:pre-wrap}
.cd-row.wide .v b{color:var(--acc-light);font-weight:700}
.cd-feats{display:flex;flex-wrap:wrap;gap:6px}
.cd-featwrap{display:inline-flex}
.cd-pickrow{display:flex;gap:10px;margin-top:14px}
.cd-pickrow .wz-btn{flex:1}

/* —— 特性可点卡 + 详情弹层 —— */
.ft-holder{display:block}
.ft-open{display:block;width:100%;text-align:left;
  border:1px solid rgba(90,180,255,.25);border-radius:8px;padding:7px 10px;
  background:rgba(79,193,255,.04);color:var(--parchment);font-size:12px;line-height:1.55}
.ft-open:active{background:rgba(79,193,255,.16)}
.ft-open .ft-t{display:block;color:var(--acc-light);font-weight:800;font-size:13px}
.ft-open .ft-s{display:block;font-style:normal;font-size:10px;color:var(--td-strong);margin-top:1px}
.ft-open .ft-clip{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;color:var(--pm);margin-top:3px}
.ft-row{margin-bottom:2px}
.sum-ft{display:flex;flex-direction:column;gap:6px;padding:8px 10px}
.ov-ft{display:flex;flex-direction:column;gap:6px}
.ov-ft .ft-open{padding:7px 12px}
/* 总览里沿用旧卡容器时给出适配 */
.sum-card .ov-ft{border:none}
.ft-pop{position:fixed;inset:0;z-index:400;background:rgba(1,4,9,.78);
  display:flex;align-items:center;justify-content:center;padding:18px}
.ft-pop[hidden]{display:none}
.ft-pop-card{width:100%;max-width:430px;max-height:86vh;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#0a1c30,#060e18);border:1px solid var(--line);
  border-radius:12px;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.6),0 0 20px var(--acc-glow)}
.ft-pop-head{display:flex;align-items:center;gap:8px;padding:10px 12px;
  border-bottom:1px solid rgba(90,180,255,.16);
  background:linear-gradient(90deg,rgba(79,193,255,.14),rgba(79,193,255,.02))}
.ft-pop-head b{flex:1;font-size:14px;color:var(--acc-light)}
.ft-pop-head .wz-close{flex:0 0 auto}
.ft-pop-body{overflow-y:auto;padding:14px}
.ft-name{font-size:16px;font-weight:800;color:var(--acc-light);line-height:1.4}
.ft-src{font-size:11px;color:var(--acc);margin-top:4px}
.ft-txt{font-size:13px;color:var(--pm);line-height:1.85;margin-top:12px;white-space:pre-wrap}
.ft-txt.is-empty{color:var(--td);font-style:italic}

/* 立绘：预览大图与选择器小图完整 contain（竖幅不裁切） */
.portrait-box img{object-fit:contain}
.pot-img{aspect-ratio:3/4}
.pot-img img{object-fit:contain}
@media (max-width:430px){
  .cls-card{flex:0 0 82%;max-width:none}
}
@media (min-width:560px){
  .cls-card{flex-basis:58%}
  .rz-frame{flex-basis:172px;width:172px}
}

/* ================================================================
   HScroll 通用横向拖拽（js/hscroll.js）
   ================================================================ */
/* 触屏：交给浏览器横向滑动（pan-x），脚本只做 mouse 拖拽 + 吸附 + 防误点 */
[data-hscroll]{touch-action:pan-x;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;-ms-overflow-style:none}
[data-hscroll]::-webkit-scrollbar{display:none;height:0}
.hs-wrap{position:relative;display:block}
.hs-wrap .cls-track{margin:2px 0 4px}
body.hs-drag{user-select:none;-webkit-user-select:none;cursor:grabbing}
body.hs-drag *{cursor:grabbing!important}
.hs-arrow{position:absolute;top:45%;transform:translateY(-50%);z-index:6;
  width:40px;height:60px;border:1px solid var(--acc-dark);border-radius:9px;
  background:linear-gradient(180deg,rgba(10,28,45,.92),rgba(4,10,18,.92));
  color:var(--acc-light);font-size:22px;line-height:1;padding:0;
  box-shadow:0 2px 10px rgba(0,0,0,.5),0 0 8px var(--acc-glow);
  display:flex;align-items:center;justify-content:center;
  touch-action:manipulation;cursor:pointer}
.hs-arrow.prev{left:0}
.hs-arrow.next{right:0}
.hs-arrow:active{background:rgba(79,193,255,.4)}
.hs-arrow:disabled{opacity:.28;pointer-events:none;box-shadow:none}

/* ================================================================
   第 7 步 · 待完成选择（选择器字典 + 规则解析出的自选条目）
   ================================================================ */
.pc-sec-head{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 12px;font-size:13px;font-weight:800;color:var(--acc-light);
  background:linear-gradient(90deg,rgba(79,193,255,.16),rgba(79,193,255,.02));
  border-bottom:1px solid rgba(90,180,255,.14);cursor:pointer;user-select:none}
.pc-sec-head .pc-sec-state{font-size:11px;font-weight:400;color:var(--td-strong)}
.pc-sec-head .pc-sec-state b{color:var(--acc-light)}
.pc-sec-head .pc-chev{font-size:11px;color:var(--acc);transition:transform .15s ease}
.pc-sec[data-open="0"] .pc-chev{transform:rotate(-90deg)}
.pc-body{display:block;padding:10px 12px}
.pc-sec[data-open="0"] .pc-body{display:none}
.pc-item{border:1px solid rgba(90,180,255,.16);border-radius:9px;background:rgba(79,193,255,.03);
  padding:8px 10px;margin-bottom:8px}
.pc-item:last-child{margin-bottom:0}
.pc-top{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.pc-src{font-size:10px;color:var(--acc);font-weight:700}
.pc-txt{font-size:12px;color:var(--pm);line-height:1.5;flex:1;min-width:120px}
.pc-need{font-size:10px;color:var(--td-strong);white-space:nowrap}
.pc-need.done{color:var(--ok);font-weight:800}
.pc-chosen{margin:6px 0 0;font-size:12px;color:var(--ok)}
.pc-chosen:empty{display:none}
.pc-opts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.pc-opt{display:inline-flex;align-items:center;min-height:40px;border:1px solid rgba(90,180,255,.3);border-radius:20px;
  padding:4px 11px;font-size:12px;color:var(--pm);background:rgba(79,193,255,.06);
  cursor:pointer;user-select:none}
.pc-opt:active{background:rgba(79,193,255,.22)}
.pc-opt.is-on{border-color:var(--acc);color:#02111f;font-weight:800;
  background:linear-gradient(180deg,var(--acc-light),var(--acc));
  box-shadow:0 0 8px var(--acc-glow)}
.pc-opt:disabled{opacity:.35;cursor:not-allowed}
.pc-opt.is-dim{opacity:.4;cursor:not-allowed}
.pc-hint{font-size:10px;color:var(--td-strong);margin-top:7px;line-height:1.5}
.pc-other-row{display:flex;gap:6px;align-items:center;margin-top:8px;flex-wrap:wrap}
.pc-custom-inp{flex:1;min-width:150px;padding:7px 9px;border:1px solid var(--line);
  border-radius:7px;background:rgba(3,10,20,.8);color:var(--parchment);
  font-family:inherit;font-size:12px}
.pc-custom-inp:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.pc-mini-btn{border:1px solid var(--acc-dark);border-radius:7px;padding:6px 10px;font-size:12px;
  color:var(--acc-light);background:rgba(79,193,255,.08)}
.pc-mini-btn:active{background:rgba(79,193,255,.25)}
.pc-skipbox{margin-top:8px;font-size:11px;color:var(--td-strong)}
.pc-skipbox label{display:inline-flex;gap:5px;align-items:center;cursor:pointer}
.pc-empty{font-size:12px;color:var(--ok);padding:6px 2px}
.pc-arrow-btn{display:inline-block;border:1px solid var(--acc-dark);border-radius:7px;padding:4px 10px;
  font-size:12px;color:var(--acc-light);background:rgba(79,193,255,.08);cursor:pointer}

/* ================================================================
   FR-5.3 战斗页签 + FR-7 掷骰与日志（js/battle.js / js/dice.js）
   沿用 FF 蓝黑令牌；移动优先（430px 手机框内优先单列/双列）。
   ================================================================ */
.bt-stack{display:flex;flex-direction:column;gap:10px}
.bt-card{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);
  overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.bt-card-head{display:flex;align-items:center;gap:6px;padding:9px 12px;font-size:13px;font-weight:800;
  color:var(--acc-light);background:linear-gradient(90deg,rgba(79,193,255,.16),rgba(79,193,255,.02));
  border-bottom:1px solid rgba(90,180,255,.14)}
.bt-card-head small{font-size:10px;color:var(--td-strong);font-weight:400}
.bt-note{font-size:10px;color:var(--td-strong);padding:0 12px 9px;line-height:1.5}
.bt-empty-full{padding:26px 18px;text-align:center;font-size:13px;color:var(--td-strong);line-height:1.8;
  border:1px dashed var(--line);border-radius:var(--radius-md);background:rgba(79,193,255,.03)}
.bt-empty-full small{color:var(--pm)}
.bt-empty{padding:9px 12px;font-size:11px;color:var(--td-strong);line-height:1.6}

/* —— 生命 / 临时 HP —— */
.bt-hp-row{display:flex;align-items:center;gap:10px;padding:12px 12px 6px}
.bt-step{flex:0 0 40px;width:40px;height:40px;border:1px solid var(--line);border-radius:10px;
  background:rgba(79,193,255,.08);color:var(--acc-light);font-size:20px;line-height:1}
.bt-step.sm{flex:0 0 40px;width:40px;height:40px;font-size:17px;border-radius:8px}
.bt-step:active{background:rgba(79,193,255,.28)}
.bt-step:disabled{opacity:.35}
.bt-hp-main{flex:1;min-width:0;text-align:center}
.bt-hp-num{font-variant-numeric:tabular-nums;color:var(--acc-light)}
.bt-hp-num b{font-size:30px;font-weight:800}
.bt-hp-num .bt-slash{color:var(--td);margin:0 3px}
.bt-hp-num .bt-hp-max{color:var(--td);font-size:18px}
.bt-hp-bar{height:8px;border-radius:5px;background:rgba(79,193,255,.10);overflow:hidden;margin-top:6px;
  border:1px solid rgba(90,180,255,.18)}
.bt-hp-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc-dark),var(--acc));
  box-shadow:0 0 8px var(--acc-glow);transition:width .2s ease}
.bt-temp-row{display:flex;align-items:center;gap:8px;padding:4px 12px 10px;justify-content:center}
.bt-temp-lab{flex:0 1 auto;font-size:12px;color:var(--pm);min-width:110px;text-align:center}
.bt-temp-lab b{color:var(--acc-light);font-size:16px;margin-left:2px;font-variant-numeric:tabular-nums}

/* —— 职业资源槽 —— */
.bt-res-card .bt-res-rows{display:flex;flex-direction:column}
.bt-res-row{display:flex;align-items:center;gap:7px;padding:7px 12px;border-top:1px solid rgba(90,180,255,.08)}
.bt-res-row:first-child{border-top:none}
.bt-res-name{flex:1;min-width:0;padding:6px 8px;border:1px solid var(--line);border-radius:7px;
  background:rgba(3,10,20,.8);color:var(--acc-light);font-family:inherit;font-size:12px;font-weight:700}
.bt-res-name:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.bt-res-val{flex:0 0 auto;display:inline-flex;align-items:center;gap:3px;font-size:14px;color:var(--td)}
.bt-res-val b{color:var(--acc-light);font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;min-width:14px;text-align:center}
.bt-res-sep{font-style:normal}
.bt-res-max{width:42px;padding:4px 2px;text-align:center;border:1px solid rgba(90,180,255,.3);border-radius:6px;
  background:rgba(3,10,20,.8);color:var(--acc-light);font-size:12px;font-family:inherit;font-variant-numeric:tabular-nums}
.bt-res-max:focus{outline:none;border-color:var(--acc)}

/* —— 豁免 / 技能 检定行 —— */
.bt-check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;padding:10px 12px}
.bt-check-grid.two{grid-template-columns:repeat(2,1fr)}
.bt-check{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:9px;
  padding:9px 10px;background:linear-gradient(180deg,rgba(79,193,255,.05),rgba(79,193,255,.01));
  color:var(--parchment);text-align:left}
.bt-check:active{background:rgba(79,193,255,.16)}
.bt-check-lab{flex:1;min-width:0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-check-val{font-size:16px;font-weight:800;color:var(--acc-light);font-variant-numeric:tabular-nums}
.bt-check-tag{font-size:9px;color:var(--ok);border:1px solid rgba(127,224,168,.4);border-radius:9px;padding:1px 6px}
.bt-skill-groups{display:flex;flex-direction:column;gap:4px;padding:10px 12px}
.bt-sg-t{font-size:11px;font-weight:800;color:var(--acc);margin:6px 0 2px;letter-spacing:.5px}
.bt-sg .bt-check-grid{padding:2px 0 8px}

/* —— 动作分组 —— */
.bt-actions .bt-ag{border-top:1px solid rgba(90,180,255,.10)}
.bt-ag-t{padding:8px 12px;font-size:12px;font-weight:800;color:var(--acc);
  background:linear-gradient(90deg,rgba(79,193,255,.08),rgba(79,193,255,.01))}
.bt-ag-body{padding:8px 12px 12px;display:flex;flex-direction:column;gap:8px}
.bt-atk{border:1px solid rgba(79,193,255,.35);border-radius:10px;background:rgba(79,193,255,.04);padding:9px 10px}
.bt-atk-t{font-size:13px;font-weight:800;color:var(--acc-light);margin-bottom:6px;display:flex;gap:6px;align-items:baseline}
.bt-atk-t small{font-size:9px;color:var(--td-strong);font-weight:400}
.bt-atk-row{display:flex;align-items:center;gap:6px;margin-top:6px}
.bt-atk-row label{flex:0 0 auto;font-size:11px;color:var(--td-strong)}
.bt-atk-inp{flex:1;min-width:0;min-height:40px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;
  background:rgba(3,10,20,.8);color:var(--acc-light);font-family:inherit;font-size:13px}
.bt-atk-inp:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.bt-rollbtn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:40px;border:1px solid var(--acc-dark);border-radius:8px;padding:7px 10px;
  background:linear-gradient(180deg,rgba(79,193,255,.22),rgba(79,193,255,.08));color:var(--acc-light);
  font-size:12px;font-weight:800}
.bt-rollbtn:active{background:rgba(79,193,255,.4)}
.bt-rollbtn.big{width:100%;margin-top:10px;padding:13px 10px;font-size:15px;border-radius:10px}
.bt-ft-sec{display:flex;flex-direction:column;gap:6px}
.bt-sec-t{font-size:11px;font-weight:800;color:var(--td-strong);margin-top:2px}
.bt-sec-t small{font-weight:400;color:var(--td-strong)}
.bt-ft-list{display:flex;flex-direction:column;gap:6px}
.bt-feat{border-radius:8px}
.bt-gen-list{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.bt-gen{display:flex;gap:6px;border:1px dashed rgba(90,180,255,.30);border-radius:8px;padding:7px 8px;
  background:rgba(79,193,255,.03)}
.bt-gen-ico{font-size:15px;flex:0 0 auto}
.bt-gen-main{min-width:0}
.bt-gen-main b{display:block;font-size:11px;color:var(--acc-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-gen-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-size:9.5px;color:var(--td-strong);line-height:1.45;margin-top:1px}
@media (max-width:430px){ .bt-gen-list{grid-template-columns:1fr} .bt-check-grid{grid-template-columns:1fr 1fr} }

/* —— 骰子面板 / 弹层（DiceUI） —— */
.dc-over{position:fixed;inset:0;z-index:300;background:rgba(1,4,9,.82);
  display:flex;align-items:flex-end;justify-content:center}
.dc-over.dc-popwrap{align-items:center;padding:16px;z-index:350}
.dc-card{width:100%;max-width:560px;display:flex;flex-direction:column;max-height:88vh;
  background:linear-gradient(180deg,#0a1c30,#060e18);border:1px solid var(--line);
  border-top-left-radius:16px;border-top-right-radius:16px;overflow:hidden;
  box-shadow:0 -6px 30px rgba(0,0,0,.6),0 0 20px var(--acc-glow)}
.dc-popwrap .dc-card{border-radius:16px;max-width:430px}
.dc-head{display:flex;align-items:center;gap:8px;padding:12px 14px;
  background:linear-gradient(90deg,rgba(79,193,255,.16),rgba(79,193,255,.02));
  border-bottom:1px solid rgba(90,180,255,.16)}
.dc-head b{flex:1;font-size:14px;color:var(--acc-light)}
.dc-x{width:40px;height:40px;border:1px solid var(--line);border-radius:8px;background:rgba(79,193,255,.07);
  color:var(--td);font-size:14px;line-height:1}
.dc-x:active{background:rgba(79,193,255,.25);color:var(--acc-light)}
.dc-body{padding:12px 14px 16px;overflow-y:auto}
.dc-quick-t{font-size:11px;color:var(--td-strong);margin-bottom:6px}
.dc-dies{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:10px}
.dc-die{border:1px solid var(--line);border-radius:9px;padding:10px 2px;font-size:13px;font-weight:800;
  color:var(--acc-light);background:rgba(79,193,255,.06)}
.dc-die:active{background:rgba(79,193,255,.25)}
.dc-advrow{display:flex;align-items:center;gap:8px;margin:8px 0;font-size:12px;color:var(--td-strong)}
.dc-advrow.center{justify-content:center}
.dc-adv{display:inline-flex;gap:6px}
.dc-advbtn{display:inline-flex;align-items:center;min-height:40px;border:1px solid var(--line);border-radius:16px;padding:5px 13px;font-size:12px;color:var(--pm);
  background:rgba(79,193,255,.05)}
.dc-advbtn.is-on{color:#02111f;font-weight:800;background:linear-gradient(180deg,var(--acc-light),var(--acc));
  border-color:#01050b;box-shadow:0 0 8px var(--acc-glow)}
.dc-advbtn:disabled{opacity:.4}
.dc-expr-row{display:flex;gap:8px;margin:10px 0 6px}
.dc-input{flex:1;min-width:0;padding:11px 12px;border:1px solid var(--line);border-radius:10px;
  background:rgba(3,10,20,.85);color:var(--parchment);font-family:inherit;font-size:15px}
.dc-input:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.dc-rollbtn{flex:0 0 auto;border:1px solid var(--acc-dark);border-radius:10px;padding:11px 18px;
  background:linear-gradient(180deg,var(--acc-light),var(--acc));color:#02111f;font-weight:800;font-size:14px}
.dc-rollbtn:active{filter:brightness(1.15)}
.dc-result{margin:8px 0 2px;text-align:center;min-height:52px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:4px;border-radius:12px;border:1px dashed rgba(90,180,255,.28);
  background:rgba(79,193,255,.05);padding:8px}
.dc-result .dc-hint{color:var(--td-strong);font-size:12px}
.dc-big{font-size:44px;font-weight:800;color:var(--acc-light);line-height:1.1;
  text-shadow:0 0 16px var(--acc-glow);font-variant-numeric:tabular-nums}
.dc-note{font-size:13px;color:var(--pm)}
.dc-break{font-size:11px;color:var(--td-strong);word-break:break-all;text-align:center;line-height:1.5}
.dc-formula{text-align:center;font-size:20px;font-weight:800;color:var(--acc-light);
  padding:10px 6px 2px;font-variant-numeric:tabular-nums}
.dc-hist-head{display:flex;justify-content:space-between;align-items:center;margin-top:10px;
  font-size:11px;color:var(--td-strong);border-top:1px solid rgba(90,180,255,.12);padding-top:8px}
.dc-hist-head i{font-style:normal;color:var(--acc)}
.dc-clear{display:inline-flex;align-items:center;min-height:40px;border:1px solid rgba(255,122,110,.4);border-radius:7px;padding:4px 10px;font-size:11px;
  color:var(--danger);background:rgba(255,122,110,.06)}
.dc-clear:active{background:rgba(255,122,110,.2)}
.dice-hist{display:flex;flex-direction:column;margin-top:6px;max-height:150px;overflow-y:auto}
.dice-hist-empty{padding:10px;font-size:11px;color:var(--td-strong);text-align:center}
.dice-hist-row{display:flex;align-items:center;gap:8px;padding:7px 8px;border:1px solid rgba(90,180,255,.12);
  border-radius:8px;margin-bottom:5px;background:rgba(79,193,255,.03)}
.dice-hist-row .dh-expr{font-size:12px;color:var(--acc-light);font-weight:700;flex:0 0 auto}
.dice-hist-row .dh-expr em{font-style:normal;font-size:9px;color:var(--ok);margin-left:4px}
.dice-hist-row .dh-detail{flex:1;min-width:0;font-size:10px;color:var(--td-strong);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.dice-hist-row .dh-total{font-size:15px;font-weight:800;color:var(--parchment);font-variant-numeric:tabular-nums}
.dice-hist-row .dh-time{font-style:normal;font-size:9px;color:var(--td-strong)}

/* —— 更多页 · 最近记录（日志） —— */
.lg-list{display:flex;flex-direction:column}
.lg-row{display:flex;align-items:center;gap:9px;padding:9px 12px;border-top:1px solid rgba(90,180,255,.08)}
.lg-row:first-child{border-top:none}
.lg-ico{flex:0 0 auto;font-size:16px;width:24px;text-align:center}
.lg-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.lg-note{font-size:12px;color:var(--parchment);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lg-note b{color:var(--acc);font-weight:800;margin-right:2px}
.lg-time{font-size:10px;color:var(--td-strong)}
.lg-res{flex:0 0 auto;font-size:13px;font-weight:800;color:var(--acc-light);font-variant-numeric:tabular-nums}
.lg-res.lg-roll{color:var(--acc-light);text-shadow:0 0 8px var(--acc-glow)}
.lg-empty{padding:14px 12px;font-size:11px;color:var(--td-strong);text-align:center;line-height:1.6}


/* ====== 阶段 4（FR-5.6/FR-6.1）法术页签 ====== */
.sp-stack{margin-top:2px}
.sp-stack-in{display:flex;flex-direction:column;gap:10px}
.sp-stack .bt-card{margin:0}

/* 施法信息 */
.sp-cast-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px 12px}
.sp-cg{display:flex;flex-direction:column;gap:4px;min-width:0}
.sp-cg .lab{font-size:11px;color:var(--td-strong)}
.sp-cg .sp-sel,.sp-cg .sp-num{width:100%;min-width:0;min-height:40px;box-sizing:border-box;padding:6px 4px;font-size:13px;color:var(--acc-light);
  background:#0a1c30;border:1px solid var(--line);border-radius:6px}
.sp-cg .sp-dc{font-size:22px;font-weight:800;color:var(--acc-light);text-align:center;line-height:1.3;font-variant-numeric:tabular-nums}
.sp-cg .sp-dc[data-empty]{color:var(--td)}
.sp-castnote{color:var(--td-strong)}

/* 法术位 */
.sp-slot-rows{display:flex;flex-direction:column}
.sp-slot-row{display:flex;align-items:center;gap:8px;padding:6px 12px;border-bottom:1px dashed rgba(90,180,255,.10)}
.sp-slot-row:last-child{border-bottom:none}
.sp-slot-ring{width:44px;flex:0 0 auto;font-size:12px;color:var(--pm)}
.sp-slot-val{flex:1;text-align:center;font-variant-numeric:tabular-nums}
.sp-slot-val b{font-size:20px;font-weight:800;color:var(--acc-light)}
.sp-slot-val i{color:var(--td);font-style:normal;margin:0 4px}
.sp-slot-val em{font-style:normal;color:var(--td);font-size:14px}
.sp-slotnote{padding:8px 12px;font-size:11px;color:var(--ok);background:rgba(127,224,168,.06);line-height:1.6}

/* 双子页签 seg 微调 */
.sp-seg{margin:2px 0 0}
.sp-seg .seg-btn{flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;gap:5px}
.sp-seg-n{font-style:normal;font-size:11px;background:rgba(79,193,255,.2);border-radius:10px;padding:0 6px;color:var(--acc-light)}
.sp-body{margin-top:4px}

/* 我的法术 */
.sp-mine-sum{padding:8px 10px;font-size:12px;color:var(--pm);background:linear-gradient(90deg,rgba(79,193,255,.10),rgba(79,193,255,.02));
  border:1px solid var(--line);border-radius:var(--radius-sm);margin-bottom:6px}
.sp-mine-sum b{color:var(--acc-light)}
.sp-hint{font-size:10px;color:var(--td-strong);padding:2px 2px 6px;line-height:1.5}
.sp-mine-empty{margin:8px 0}

/* 法术卡 */
.sp-list{display:flex;flex-direction:column;gap:8px;padding-bottom:6px}
.sp-card{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);overflow:hidden}
button.sp-card{width:100%;text-align:left;display:flex;flex-direction:column;gap:3px;padding:10px 12px;color:inherit}
button.sp-card:active{background:#0e2842}
.sp-card.mine .sp-main{width:100%;text-align:left;display:flex;flex-direction:column;gap:3px;padding:10px 12px 6px;color:inherit;background:transparent;border:none}
.sp-card .sp-t{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.sp-card .sp-t b{font-size:15px;color:var(--parchment);font-weight:800}
.sp-card .sp-en{font-style:normal;font-size:11px;color:var(--td-strong)}
.sp-card .sp-s{font-size:12px;color:var(--pm)}
.sp-card .sp-bd{display:flex;gap:5px;flex-wrap:wrap;margin-top:1px}
.sp-card .sp-src{align-self:flex-start;margin-top:3px;font-style:normal;font-size:10px;color:var(--acc);
  border:1px solid rgba(79,193,255,.3);border-radius:4px;padding:0 5px}
.sp-tag{font-style:normal;font-size:10px;color:#ffd8a8;border:1px solid rgba(255,190,120,.4);border-radius:4px;padding:0 5px}
.sp-tag.conc{color:var(--acc-light);border-color:rgba(79,193,255,.45)}
.sp-tag.canti{color:var(--ok);border-color:rgba(127,224,168,.5)}
.sp-tag.prep{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:transparent;font-weight:700}

/* 卡内按钮排 */
.sp-acts{display:flex;gap:6px;padding:6px 10px 9px}
.sp-btn{flex:1 1 0;min-width:0;min-height:40px;display:flex;align-items:center;justify-content:center;padding:7px 4px;border:1px solid var(--line);border-radius:6px;
  background:rgba(79,193,255,.08);color:var(--pm);font-size:12px}
.sp-btn.act:active{background:rgba(79,193,255,.3)}
.sp-btn.act.on{color:#02111f;font-weight:700;background:linear-gradient(180deg,var(--acc-light),var(--acc))}
/* 危险动作文字色改用主题令牌：原先硬编码 #ff9c92（仅适配深色），
 * 浅色主题下对比度只有 1.73（< 3.0，自动化 UI 审计 tools/audit-ui.mjs 实测）；
 * var(--danger) 深色 #ff7a6e / 浅色 #c0392b，两种主题均达标。 */
.sp-btn.danger{color:var(--danger);border-color:rgba(255,122,110,.4)}
.sp-btn.danger:active{background:rgba(255,122,110,.18)}
.sp-btn.primary{color:#02111f;font-weight:800;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}

/* 法术库筛选 */
.sp-filters{padding:2px 0 4px}
.sp-search{width:100%;box-sizing:border-box;min-height:40px;padding:9px 10px;font-size:13px;color:var(--parchment);
  background:#0a1c30;border:1px solid var(--line);border-radius:8px;margin-bottom:8px}
.sp-search::placeholder{color:var(--td)}
.sp-frow{display:flex;gap:6px;margin-bottom:6px;align-items:flex-start}
.sp-flab{flex:0 0 auto;font-size:11px;color:var(--td-strong);padding-top:7px;width:52px}
.sp-fchips{flex:1;display:flex;flex-wrap:wrap;gap:5px}
.sp-chip{border:1px solid var(--line);border-radius:20px;display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:4px 9px;font-size:11px;color:var(--pm);
  background:rgba(79,193,255,.05)}
.sp-chip.is-on{color:#02111f;font-weight:700;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}
.sp-chip.is-off{opacity:.45}
.sp-chip:active{background:rgba(79,193,255,.3)}
.sp-libmeta{font-size:11px;color:var(--td-strong);padding:4px 2px 8px}
.sp-libmeta b{color:var(--pm)}
.sp-clear{border:none;background:transparent;color:var(--acc);font-size:11px;text-decoration:underline;padding:0;cursor:pointer}
.sp-loading,.sp-empty{padding:18px 12px;text-align:center;font-size:12px;color:var(--td-strong);line-height:1.7;
  border:1px dashed var(--line);border-radius:var(--radius-md)}
.sp-morewrap{text-align:center;padding-top:4px}
.sp-more{width:100%;display:flex;align-items:center;justify-content:center;min-height:40px;padding:10px;font-size:12px;color:var(--acc-light);border:1px dashed var(--line);
  border-radius:8px;background:rgba(79,193,255,.05)}

/* 法术详情 / 施放摘要 弹层 */
.sp-pop{position:fixed;inset:0;z-index:380;background:rgba(1,4,9,.82);
  display:flex;align-items:center;justify-content:center;padding:16px}
.sp-pop-card{width:100%;max-width:430px;max-height:88vh;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#0a1c30,#060e18);border:1px solid var(--line);border-radius:16px;
  overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.6),0 0 20px var(--acc-glow)}
.sp-pop .dc-body{overflow-y:auto}
.sp-pop-en{font-size:12px;color:var(--td-strong);margin:2px 0 6px}
.sp-pop-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.sp-pchip{font-size:11px;color:var(--acc-light);border:1px solid rgba(79,193,255,.4);border-radius:4px;padding:0 6px}
.sp-pchip.lv{font-weight:800}
.sp-pchip.src{color:var(--pm);border-color:var(--line)}
.sp-fields{display:flex;flex-direction:column;gap:3px;border:1px solid rgba(90,180,255,.14);border-radius:8px;
  background:rgba(79,193,255,.03);padding:8px 10px;margin-bottom:8px}
.sp-field{display:flex;gap:8px;font-size:12px;line-height:1.6}
.sp-field .k{flex:0 0 64px;color:var(--td-strong)}
.sp-field .v{flex:1;color:var(--parchment);word-break:break-all}
.sp-pop-note{font-size:11px;color:var(--td-strong);line-height:1.7;margin-bottom:8px}
.sp-pop-linkrow{display:flex;flex-direction:column;gap:3px;margin-bottom:8px}
.sp-linkbtn{display:flex;align-items:center;justify-content:center;min-height:40px;padding:8px;border:1px solid var(--line);border-radius:8px;background:rgba(79,193,255,.08);
  color:var(--acc-light);font-size:12px}
.sp-linkpath{font-size:10px;color:var(--td-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sp-pop-acts{display:flex;gap:6px}
.sp-pop-acts .sp-btn{flex:1 1 0}

/* ===== FR-6.x 职业法表终稿：可用性徽标/表外置灰 ===== */
.sp-tag.job{color:#9be39b;border-color:rgba(127,224,168,.55);background:rgba(63,155,95,.10)}
.sp-tag.nojob{color:#9aa4ae;border-color:rgba(154,164,174,.4);background:rgba(120,130,140,.08)}
.sp-card.is-nojob{opacity:.78}


/* ====== FR-5.5 背包页签（js/inventory.js，FF 蓝黑 移动优先） ====== */
.iv-stack-in{display:flex;flex-direction:column;gap:10px}
.iv-seg{margin:0}
.iv-seg .seg-btn{display:flex;align-items:center;justify-content:center;gap:5px}
.iv-seg-n{font-style:normal;font-size:10px;background:rgba(2,17,31,.5);border-radius:9px;padding:0 6px;color:#dff1ff}
.iv-body{display:flex;flex-direction:column;gap:10px}
.iv-body .bt-card{margin:0}
.iv-money-row{display:flex;align-items:center;gap:6px;padding:9px 12px}
.iv-money-row .bt-step{flex:0 0 auto}
.iv-gold-val{flex:1;min-width:0;text-align:center;display:flex;align-items:baseline;justify-content:center;gap:4px}
.iv-gold-val b{font-size:22px;color:var(--acc-light);font-variant-numeric:tabular-nums}
.iv-gold-val span{font-size:11px;color:var(--td-strong)}
.iv-load-row{display:flex;align-items:baseline;gap:4px;padding:6px 12px 2px;font-size:12px;color:var(--pm)}
.iv-load-num{font-size:20px;font-weight:800;color:var(--acc-light);font-variant-numeric:tabular-nums}
.iv-load-num.over,.iv-over.on{color:var(--danger)}
.iv-over{font-weight:800;color:var(--ok);font-size:11px}
.iv-over.on{color:var(--danger)}
.iv-load-bar{height:6px;margin:4px 12px 2px;border-radius:4px;background:rgba(79,193,255,.12);overflow:hidden}
.iv-load-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--acc-dark),var(--acc))}
.iv-load-bar i.over{background:linear-gradient(90deg,#c0392b,var(--danger))}
/* 点击目标尺寸：全部交互控件统一抬到 40px（移动端推荐值，tools/audit-ui.mjs 口径）。
 * 历史：曾按 FF 紧凑风格只抬到 28–30px 以消除 <24px 的 error，现按用户决定统一到 40px。 */
.iv-rule-chip{border:1px solid rgba(79,193,255,.4);border-radius:12px;padding:1px 8px;font-size:10px;color:var(--pm);background:rgba(79,193,255,.08);display:inline-flex;align-items:center;min-height:40px}
.iv-rule-chip.is-on{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b;font-weight:700}
.iv-chip-row{display:flex;flex-wrap:wrap;gap:6px;padding:9px 12px 2px}
.iv-chip{border:1px solid var(--line);border-radius:20px;display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:4px 10px;font-size:11px;color:var(--pm);background:rgba(79,193,255,.05)}
.iv-chip.is-on{color:#02111f;font-weight:700;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}
.iv-chip:active{background:rgba(79,193,255,.3)}
.iv-search{display:block;width:calc(100% - 24px);min-height:40px;margin:8px 12px 2px;padding:9px 10px;border:1px solid var(--line);
  border-radius:8px;background:rgba(3,10,20,.85);color:var(--parchment);font-family:inherit;font-size:13px}
.iv-search:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.iv-rows{display:flex;flex-direction:column;padding-bottom:6px}
.iv-row{padding:8px 12px;border-top:1px solid rgba(90,180,255,.10)}
.iv-row:first-child{border-top:none}
.iv-row.is-eq{background:linear-gradient(90deg,rgba(127,224,168,.08),transparent)}
.iv-row-top{display:flex;align-items:flex-start;gap:8px}
.iv-row-name{flex:1;min-width:0}
.iv-row-name b{font-size:14px;color:var(--parchment);margin-right:6px}
.iv-tag{display:inline-block;font-size:9px;color:var(--acc-light);border:1px solid rgba(79,193,255,.4);
  border-radius:8px;padding:0 6px;margin:0 2px 0 0;vertical-align:1px}
.iv-qty{display:inline-block;font-size:10px;color:var(--td-strong);font-variant-numeric:tabular-nums}
.iv-eq-flag{display:inline-block;font-size:9px;color:var(--ok);border:1px solid rgba(127,224,168,.45);
  border-radius:8px;padding:0 6px;margin:0 2px;vertical-align:1px}
.iv-row-meta{font-size:10px;color:var(--td-strong);margin-top:3px;line-height:1.6;font-variant-numeric:tabular-nums}
.iv-sub{color:var(--pm);opacity:.8}
.iv-manage{flex:0 0 auto;display:inline-flex;align-items:center;min-height:40px;font-size:11px;color:var(--pm);border:1px solid var(--line);border-radius:8px;
  padding:3px 10px;background:rgba(79,193,255,.06)}
.iv-manage.on{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));font-weight:700;border-color:#01050b}
.iv-manage:active{background:rgba(79,193,255,.3)}
.iv-acts{display:flex;flex-wrap:wrap;gap:7px;padding:8px 0 2px}
.iv-mini{display:inline-flex;align-items:center;min-height:40px;font-size:11px;color:var(--pm);border:1px solid var(--line);border-radius:8px;padding:5px 10px;background:rgba(79,193,255,.06)}
.iv-mini:active{background:rgba(79,193,255,.3)}
.iv-mini.danger{color:#ff9c92;border-color:rgba(255,122,110,.4);background:rgba(255,122,110,.07)}
.iv-mini.dim{opacity:.5}
.iv-mini:disabled{opacity:.45}
.iv-nohint{font-size:10px;color:var(--td-strong)}
/* ===== 豁免型范围伤害判定行（尽毁 · 用户 A1 裁定）===== */
.bt-pop-save{margin:6px 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--acc);
  border-radius:8px;background:rgba(79,193,255,.05)}
.bt-pop-save-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-pop-save-t small{font-weight:400;color:var(--pm)}
.bt-pop-save-f,.bt-pop-save-s,.bt-pop-save-d{font-size:10px;line-height:1.7;color:var(--pm);margin-top:2px}
.bt-pop-save-d b{color:var(--tx)}
.bt-pop-save-n{font-size:10px;line-height:1.7;color:var(--td-strong);margin-top:3px}
/* ===== 以太坠击（W-5 纯计算层的界面接线 · W-7 落地）===== */
.bt-pop-fall{margin:6px 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--pm);
  border-radius:8px;background:rgba(79,193,255,.04)}
.bt-pop-fall-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-pop-fall-t small{font-weight:400;color:var(--pm)}
.bt-pop-fall-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:5px}
.bt-pop-fall-row label{display:inline-flex;align-items:center;gap:5px;font-size:10px;color:var(--pm)}
.bt-pop-fall-row input{width:6.5em;min-height:36px;font-size:11px;color:var(--tx);background:rgba(79,193,255,.06);
  border:1px solid var(--line);border-radius:8px;padding:3px 6px}
.bt-pop-fall-s{font-size:10px;line-height:1.7;color:var(--td-strong);margin-top:3px}
/* ===== 舞步表演（2026-09-17 用户需求 ② 投骰定序 + ④ 自动累计完成度）===== */
.bt-pop-dance{margin:6px 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--acc);
  border-radius:8px;background:rgba(79,193,255,.05)}
.bt-pop-dance-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-pop-dance-t small{font-weight:400;color:var(--pm)}
.bt-pop-dance-d,.bt-pop-dance-b{font-size:10px;line-height:1.7;color:var(--pm);margin-top:2px}
.bt-pop-dance-b{color:var(--td-strong)}
.bt-pop-dance-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:5px}
/* ===== 舞步绑定（2026-09-17 用户需求 ①：每步型 1 道绑定法术）===== */
.bt-dance-bind{margin-top:6px;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--pm);
  border-radius:8px;background:rgba(79,193,255,.04)}
.bt-dance-bind-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-dance-bind-t small{font-weight:400;color:var(--pm)}
.bt-dance-bind-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:5px}
.bt-dance-bind-n{flex:0 0 8.5em;font-size:10px;color:var(--pm)}
.bt-dance-bind-sel{flex:1 1 9em;min-width:8em;min-height:34px;font-size:10px;color:var(--tx);
  background:rgba(79,193,255,.06);border:1px solid var(--line);border-radius:8px;padding:3px 6px}
.bt-dance-bind-cap{font-size:10px;color:var(--td);font-style:normal}
.bt-dance-bind-cur{font-size:10px;color:var(--ok)}
/* ===== 特性 AC 效果（2026-09-17 用户裁定「AC 自动结算」：盾阵 / 圣光幕帘 / 武装戍卫）===== */
.bt-pop-acfx{margin:6px 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--ok);
  border-radius:8px;background:rgba(79,193,255,.05)}
.bt-pop-acfx-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-pop-acfx-t small{font-weight:400;color:var(--pm)}
.bt-pop-acfx-d,.bt-pop-acfx-s{font-size:10px;line-height:1.7;color:var(--pm);margin-top:2px}
.bt-pop-acfx-d b{color:var(--tx)}
.bt-pop-acfx-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:5px}
.bt-pop-acfx-row .bt-mini.is-on{border-color:var(--ok);color:var(--ok)}
.bt-pop-acfx-on{font-size:10px;color:var(--ok)}
/* 职业资源行里「＋ 获得（…）」按钮组（既有无样式块，2026-09-17 补齐，避免窄屏被挤压） */
.bt-res-gains .bt-res-gain{flex:0 1 auto}
/* ===== 命中型伤害结算行（阴阳斗气斩「7d 武艺骰」· 用户 A1 裁定「阴阳斗气 = 作为武僧资源实装」）===== */
.bt-pop-hit{margin:6px 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--acc);
  border-radius:8px;background:rgba(79,193,255,.05)}
.bt-pop-hit-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-pop-hit-t small{font-weight:400;color:var(--pm)}
.bt-pop-hit-d,.bt-pop-hit-s{font-size:10px;line-height:1.7;color:var(--pm);margin-top:2px}
.bt-pop-hit-d b{color:var(--tx)}
.bt-pop-hit-n{font-size:10px;line-height:1.7;color:var(--td-strong);margin-top:3px}
.bt-pop-hit-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:5px}
.bt-pop-hit-row .bt-mini{min-height:36px}
/* ===== 施放时的召唤选择（蛮神召唤「施放时选择召唤哪一个」· 用户 A1 裁定）===== */
.bt-pop-summon{margin:6px 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--acc);
  border-radius:8px;background:rgba(79,193,255,.05)}
.bt-pop-summon-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-pop-summon-t small{font-weight:400;color:var(--pm)}
.bt-pop-summon-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px}
.bt-summon-btn{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-height:40px;
  padding:5px 9px;font-size:11px;color:var(--tx);background:rgba(79,193,255,.07);
  border:1px solid var(--line);border-radius:9px;cursor:pointer}
.bt-summon-btn b{font-weight:700}
.bt-summon-btn i{font-style:normal;font-size:10px;color:var(--pm)}
.bt-summon-btn em{font-style:normal;font-size:10px;color:var(--acc)}
.bt-summon-btn.is-on{border-color:var(--acc);background:rgba(79,193,255,.16)}
.bt-summon-btn:disabled{opacity:.5;cursor:not-allowed}
.bt-pop-summon-s{font-size:10px;line-height:1.7;color:var(--td-strong);margin-top:3px}
/* ===== 偷袭（攻其不备「玩家可点的一个动作」· 用户 A1 裁定，触发条件由 DM 裁定）===== */
.bt-pop-sneak{margin:6px 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--acc);
  border-radius:8px;background:rgba(79,193,255,.05)}
/* A 类：地毁人亡（裂石飞环的群攻版本）群攻口径块 —— 与偷袭块同一视觉语言，左侧强调色用琥珀以区分 */
.bt-pop-aoe{margin:6px 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid #ffb86b;
  border-radius:8px;background:rgba(255,184,107,.06)}
.bt-pop-aoe-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-pop-aoe-t small{font-weight:400;color:var(--pm)}
.bt-pop-aoe-d{font-size:10px;line-height:1.75;color:var(--pm);margin-top:3px}
.bt-pop-aoe-d b{color:var(--tx)}
.bt-pop-aoe-s{font-size:10px;line-height:1.7;color:var(--td-strong);margin-top:3px}
.bt-pop-aoe-n{font-size:10px;line-height:1.7;color:#ffc46e;margin-top:3px}
.bt-pop-aoe-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.bt-pop-aoe-row .bt-mini{min-height:36px}
.bt-pop-sneak-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-pop-sneak-t small{font-weight:400;color:var(--pm)}
.bt-pop-sneak-t2{font-size:10px;color:var(--td-strong);margin-top:5px;font-weight:700}
.bt-pop-sneak-l{margin:3px 0 0;padding-left:16px;font-size:10px;line-height:1.7;color:var(--pm)}
.bt-pop-sneak-l li{margin-bottom:2px}
.bt-pop-sneak-l b{color:var(--tx);font-weight:600}
.bt-pop-sneak-l i,.bt-pop-sneak-l em{font-style:normal;color:var(--td-strong)}
.bt-pop-sneak-l em{display:block}
.bt-pop-sneak-l li.is-later{opacity:.6}
.bt-pop-sneak-save{font-size:10px;line-height:1.7;color:var(--pm);margin-top:5px}
.bt-pop-sneak-save b{color:var(--tx)}
.bt-pop-sneak-s{font-size:10px;line-height:1.7;color:var(--td-strong);margin-top:3px}
.bt-pop-sneak-dm{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:10px;color:var(--tx);min-height:36px}
.bt-pop-sneak-dm input{width:18px;height:18px;accent-color:var(--acc)}
.bt-pop-sneak-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.bt-pop-sneak-row .bt-mini{min-height:36px}
.bt-pop-sneak-n{font-size:10px;line-height:1.7;color:var(--td-strong);margin-top:3px}
/* ===== 黑魔法师「天语」状态标志（星极火／灵极冰 · 用户裁定 §0.2）===== */
.bt-blm{margin:6px 0 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--acc);
  border-radius:8px;background:rgba(79,193,255,.05)}
.bt-blm-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-blm-t small{font-weight:400;color:var(--pm);margin-left:6px}
.bt-blm-cur{color:var(--acc)}
.bt-blm-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px}
.bt-blm-btn{min-height:36px}
.bt-blm-btn.is-on{border-color:var(--acc);background:rgba(79,193,255,.16)}
.bt-blm-eff{font-size:10px;line-height:1.7;color:var(--pm);margin-top:4px}
.bt-blm-n{font-size:10px;line-height:1.7;color:var(--td-strong);margin-top:3px}
/* ===== 黑魔法师吟唱块 + 可附加法术列表（用户裁定 §0.2）===== */
.bt-pop-chant{margin:6px 0;padding:6px 8px;border:1px solid var(--line);border-left:3px solid var(--acc);
  border-radius:8px;background:rgba(79,193,255,.05)}
.bt-pop-chant-t{font-size:11px;color:var(--tx);font-weight:700}
.bt-pop-chant-t small{font-weight:400;color:var(--pm)}
.bt-pop-chant-s{font-size:10px;line-height:1.7;color:var(--pm);margin-top:2px}
.bt-pop-chant-s b{color:var(--tx)}
.bt-pop-chant-n{font-size:10px;line-height:1.7;color:var(--td-strong);margin-top:3px}
.bt-pop-chant-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px}
.bt-pop-chant-row .bt-mini{min-height:36px}
.bt-pop-chant-list{margin-top:5px;display:flex;flex-wrap:wrap;gap:6px}
.bt-pop-chant-empty{font-size:10px;line-height:1.7;color:var(--td-strong)}
.bt-pop-chant-h{flex:1 1 100%;font-size:10px;color:var(--td-strong)}
.bt-chant-sp{min-height:36px}
.bt-chant-no{flex:1 1 100%;font-size:10px;line-height:1.7;color:var(--pm);opacity:.75}
/* ===== 稀有度档位（A2③/E2 · 物品内稀有度选项）===== */
.iv-rarity{flex:1 1 100%;display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:6px 0 0;border-top:1px dashed var(--line)}
.iv-rarity .k{font-size:10px;color:var(--td-strong)}
.iv-rarity .iv-sub{flex:1 1 100%;font-size:10px;line-height:1.6}
.iv-rarity select,.iv-rarity-cost{min-height:36px;font-size:11px;color:var(--tx);background:rgba(79,193,255,.06);
  border:1px solid var(--line);border-radius:8px;padding:3px 6px}
.iv-rarity-cost{width:8.5em}
.iv-rarity-pick{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:4px 0 6px}
.iv-rarity-pick select{min-height:40px;font-size:11px;color:var(--tx);background:rgba(79,193,255,.06);
  border:1px solid var(--line);border-radius:8px;padding:4px 8px}
.iv-rarity-pick .iv-sub{flex:1 1 100%;font-size:10px;line-height:1.6;color:var(--td-strong)}
.iv-rarity-info{font-size:11px;line-height:1.7;color:var(--pm);border-left:2px solid var(--acc);padding:4px 0 4px 8px;margin:3px 0}
.iv-rarity-info.is-off{display:none}
.iv-bag-empty .sp-btn{max-width:220px}
.iv-cta{width:auto;padding:10px 14px}
/* 装备槽 */
.iv-slot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.iv-slot{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);
  display:flex;flex-direction:column;margin:0;overflow:hidden}
.iv-slot-head{display:flex;align-items:center;gap:6px;padding:8px 10px;font-size:12px;font-weight:800;color:var(--acc-light);
  background:linear-gradient(90deg,rgba(79,193,255,.14),rgba(79,193,255,.02));border-bottom:1px solid rgba(90,180,255,.14)}
.iv-slot-ico{font-size:15px}
.iv-slot-empty{padding:14px 10px;font-size:11px;color:var(--td-strong);text-align:center}
.iv-slot-empty small{display:block;color:var(--td-strong);opacity:.8;margin-top:4px}
.iv-slot-filled{padding:8px 10px;display:flex;flex-direction:column;gap:5px}
.iv-slot-name b{font-size:13px;color:var(--parchment)}
.iv-slot-src{font-size:9px;color:var(--td-strong);line-height:1.5}
.iv-bonus-row{display:flex;align-items:center;gap:5px}
.iv-bonus-lab{flex:1;min-width:0;font-size:10px;color:var(--td-strong)}
.iv-bstep{flex:0 0 40px;width:40px;height:40px;border:1px solid var(--line);border-radius:7px;
  background:rgba(79,193,255,.07);color:var(--acc-light);font-size:15px;line-height:1}
.iv-bstep:active{background:rgba(79,193,255,.3)}
.iv-bnum{flex:0 0 46px;width:46px;min-height:40px;padding:3px 2px;text-align:center;border:1px solid var(--line);border-radius:7px;
  background:rgba(3,10,20,.85);color:var(--acc-light);font-family:inherit;font-size:13px}
.iv-bnum:focus{outline:none;border-color:var(--acc)}
.iv-arm-note{font-size:10px;color:var(--td-strong);padding:0 12px 9px;line-height:1.7}
.iv-arm-note b{color:var(--acc-light)}
.iv-equip-hint{color:var(--td-strong)}
/* AC 明细卡（护甲/盾牌联动，装备子页） */
.iv-ac .bt-card-head small{color:var(--td-strong)}
.iv-ac-mode{display:inline-block;margin-left:4px;padding:1px 7px;border-radius:20px;font-size:9px;font-weight:700;
  color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc))}
.iv-ac-rows{display:flex;flex-direction:column;padding:2px 12px 4px}
.iv-ac-row{display:flex;align-items:baseline;gap:8px;padding:4px 0;font-size:12px;
  border-top:1px solid rgba(90,180,255,.10);font-variant-numeric:tabular-nums}
.iv-ac-row:first-child{border-top:none}
.iv-ac-row .k{flex:0 0 62px;color:var(--td-strong);font-size:11px}
.iv-ac-row .v{flex:1;min-width:0;color:var(--parchment);font-weight:600}
.iv-ac-row.is-off .v{color:var(--td-strong);font-weight:400;text-decoration:line-through;text-decoration-color:rgba(150,170,190,.5)}
.iv-ac-row.total{border-top:1px solid rgba(90,180,255,.28);margin-top:2px;padding-top:6px}
.iv-ac-row.total .k{color:var(--acc-light);font-weight:800}
.iv-ac-row.total .v{color:var(--ok);font-size:20px;font-weight:800}
/* AC 手动覆盖行（flags.override.ac）：输入框 + 应用 / 恢复自动（点击目标 40px 高） */
.iv-ac-ovr{display:flex;align-items:center;gap:6px;padding:6px 12px 2px;border-top:1px solid rgba(90,180,255,.14);margin-top:4px}
.iv-ac-ovr .k{flex:0 0 auto;color:var(--td-strong);font-size:11px}
.iv-ac-ovr input{flex:1 1 auto;min-width:0;min-height:40px;padding:4px 8px;font-size:12px;color:var(--parchment);
  background:#0a1c30;border:1px solid var(--line);border-radius:8px}
.iv-ac-ovr input::placeholder{color:var(--td)}
.iv-ac-ovr .sp-btn{flex:0 0 auto;min-height:40px;padding:4px 10px}
.ov-acmode{font-size:9px;font-style:normal;font-weight:400;color:var(--td-strong);margin-left:3px;vertical-align:top}
/* 商店 */
.iv-bal{padding:8px 12px 0;font-size:12px;color:var(--pm)}
.iv-bal b{color:var(--ok);font-size:15px;margin:0 4px;font-variant-numeric:tabular-nums}
.iv-bal small{display:block;color:var(--td-strong);font-size:10px;margin-top:2px;line-height:1.5}
.iv-lib{display:flex;flex-direction:column}
.iv-shop-row{display:flex;align-items:center;gap:8px;padding:9px 12px;border-top:1px solid rgba(90,180,255,.08)}
.iv-shop-row:first-child{border-top:none}
.iv-shop-main{flex:1;min-width:0}
.iv-shop-info b{font-size:13px;color:var(--parchment)}
.iv-shop-info em{font-style:normal;font-size:10px;color:var(--td-strong);margin-left:5px}
.iv-shop-info small{display:block;font-size:10px;color:var(--td-strong);margin-top:2px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.iv-shop-meta{font-size:10px;color:var(--acc-light);margin-top:2px;font-variant-numeric:tabular-nums}
.iv-add{flex:0 0 auto;display:inline-flex;align-items:center;min-height:40px;border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:11px;
  color:var(--ok);background:rgba(127,224,168,.08);font-weight:700}
.iv-add.free{color:var(--acc-light);background:rgba(79,193,255,.08)}
.iv-add:active{background:rgba(127,224,168,.25)}
@media (max-width:430px){.iv-slot-grid{grid-template-columns:1fr 1fr}}

/* ================================================================
   FR-5.7 休息页签（js/rest.js）—— 营地风格 · FF 蓝黑 · 移动优先
   复用 .bt-card/.bt-card-head/.bt-note/.dc-advbtn 令牌以与战斗页统一。
   ================================================================ */
.rs-stack{display:flex;flex-direction:column;gap:10px}
.rs-hero{background:
  radial-gradient(140% 120% at 50% -20%,rgba(79,193,255,.18),rgba(79,193,255,0) 60%),
  linear-gradient(180deg,#0a1c30,#08121f)}
.rs-camp{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:12px 12px 2px}
.rs-camp-t{font-family:var(--font-serif);font-size:17px;font-weight:800;color:var(--acc-light);
  letter-spacing:2px;text-shadow:0 0 14px var(--acc-glow)}
.rs-camp-s{font-size:10px;color:var(--td-strong)}
.rs-hp{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 12px 2px}
.rs-hp-num{font-variant-numeric:tabular-nums;color:var(--acc-light)}
.rs-hp-num b{font-size:38px;font-weight:800;line-height:1}
.rs-hp-num i{color:var(--td);font-style:normal;margin:0 5px;font-size:18px}
.rs-hp-num em{color:var(--td);font-style:normal;font-size:19px}
.rs-chips{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;padding:8px 12px 10px}
.rs-chip{border:1px solid var(--line);border-radius:16px;padding:4px 11px;font-size:11px;color:var(--pm);
  background:rgba(79,193,255,.07)}
.rs-chip b{color:var(--acc-light);font-variant-numeric:tabular-nums}
.rs-big-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rs-big{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 8px 12px;border-radius:14px;
  border:1px solid var(--line);text-align:center;position:relative;overflow:hidden}
.rs-big::before{content:'';position:absolute;inset:0;opacity:.5;pointer-events:none;
  background:radial-gradient(120% 90% at 50% -10%,rgba(79,193,255,.22),rgba(79,193,255,0) 62%)}
.rs-short{background:linear-gradient(180deg,rgba(79,193,255,.16),rgba(9,26,46,.9));
  box-shadow:0 4px 16px rgba(0,0,0,.35), inset 0 0 18px rgba(79,193,255,.10)}
.rs-long{background:linear-gradient(180deg,rgba(90,120,255,.16),rgba(10,18,40,.9));
  box-shadow:0 4px 16px rgba(0,0,0,.35), inset 0 0 18px rgba(120,150,255,.10)}
.rs-big:active{transform:translateY(1px);filter:brightness(1.25)}
.rs-big:disabled{opacity:.5;filter:grayscale(.4)}
.rs-big-ico{font-size:22px;line-height:1;filter:drop-shadow(0 0 8px rgba(79,193,255,.5))}
.rs-big-t{font-size:19px;font-weight:800;color:var(--acc-light);letter-spacing:3px}
.rs-long .rs-big-t{color:#cdd6ff}
.rs-big small{font-size:10px;color:var(--td-strong);line-height:1.5;max-width:150px}
.rs-big small b{color:var(--acc)}
.rs-hd-box{display:flex;flex-direction:column;gap:9px;padding:10px 12px}
.rs-hd-box .dc-adv{align-self:flex-start}
.rs-spend{flex:0 0 auto;border:1px solid var(--line);border-radius:10px;padding:11px 12px;font-size:13px;font-weight:800;
  color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));text-align:center}
.rs-spend:active{filter:brightness(1.15)}
.rs-spend:disabled{opacity:.4;filter:grayscale(.5)}
.rs-result{min-height:0;padding:0 12px;font-size:12px;color:var(--ok);line-height:1.6}
.rs-lrows{display:flex;flex-direction:column;padding:4px 0 8px}
.rs-lrow{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 12px;
  border-top:1px solid rgba(90,180,255,.07);font-size:12px;color:var(--pm)}
.rs-lrow:first-child{border-top:none}
.rs-sw{flex:0 0 auto;font-size:10px;border-radius:10px;padding:2px 9px;font-weight:800}
.rs-sw.on{color:var(--ok);border:1px solid rgba(127,224,168,.45);background:rgba(127,224,168,.08)}
.rs-sw.off{color:var(--danger);border:1px solid rgba(255,122,110,.4);background:rgba(255,122,110,.08)}
.rs-sw.always{color:var(--acc-light);border:1px solid rgba(79,193,255,.4);background:rgba(79,193,255,.08)}
.rs-res-row{display:flex;align-items:center;gap:8px;padding:8px 12px;border-top:1px solid rgba(90,180,255,.07);font-size:12px}
.rs-res-row:first-child{border-top:none}
.rs-res-name{flex:1;min-width:0;color:var(--pm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rs-res-cur{flex:0 0 auto;color:var(--td);font-variant-numeric:tabular-nums}
.rs-res-cur b{color:var(--acc-light);font-size:15px}
.rs-res-tag{flex:0 0 auto;font-size:9px;font-style:normal;color:var(--acc);border:1px solid rgba(79,193,255,.4);
  border-radius:9px;padding:1px 6px;background:rgba(79,193,255,.06)}
.rs-res-tag.sh{color:var(--ok);border-color:rgba(127,224,168,.4);background:rgba(127,224,168,.06)}
.rs-res-tag.lg{color:var(--acc-light)}
.rs-res-tag.no{color:var(--td-strong);border-color:rgba(90,180,255,.2)}
.rs-undo{margin-top:2px;padding:13px 14px;border:1px solid rgba(79,193,255,.35);border-radius:10px;
  background:linear-gradient(90deg,rgba(79,193,255,.10),rgba(79,193,255,.02));color:var(--acc-light);
  font-size:13px;font-weight:800;text-align:center}
.rs-undo:active{background:rgba(79,193,255,.22)}
.rs-undo:disabled{opacity:.35;filter:grayscale(.6);color:var(--td-strong);border-color:var(--line);background:var(--bg-card)}

/* ====== 更多页补全（FR-5.8/6/8）：菜单分组 + 图鉴/画廊/升级/版本 ====== */
.mg-lab{font-size:11px;color:var(--acc);letter-spacing:.6px;margin:4px 2px -2px;opacity:.9}
.mo-over{position:fixed;inset:0;z-index:340;background:rgba(1,4,9,.78);display:flex;justify-content:center;align-items:flex-start;padding:0;overflow:hidden}
.mo-sheet{width:100%;max-width:560px;height:100%;display:flex;flex-direction:column;background:var(--bg-deep);
  border-left:1px solid var(--line);border-right:1px solid var(--line);box-shadow:0 0 40px rgba(0,0,0,.6)}
.mo-sheet.mo-small{max-width:430px;max-height:92vh;height:auto;margin-top:4vh;border-radius:14px;overflow:hidden;border:1px solid var(--line)}
.mo-head{border-bottom:1px solid rgba(90,180,255,.18);background:linear-gradient(90deg,rgba(79,193,255,.18),rgba(79,193,255,.02))}
.mo-sub{font-weight:400;font-size:10px;color:var(--td-strong);text-transform:none;letter-spacing:0;margin-left:6px}
.mo-body{flex:1 1 auto;overflow-y:auto;padding:12px 14px 20px;-webkit-overflow-scrolling:touch}
.mo-seg{margin:0 0 10px}
.mo-seg .seg-btn{flex:1 1 0}
.mo-cbody{min-height:0}
.mo-tip{font-size:12px;color:var(--pm);line-height:1.7;margin-bottom:10px;padding:8px 10px;border:1px dashed var(--line);border-radius:var(--radius-md);background:rgba(79,193,255,.04)}
.mo-tip b{color:var(--acc-light)}
.mo-search{width:100%;box-sizing:border-box;min-height:40px;padding:9px 10px;font-size:13px;color:var(--parchment);
  background:#0a1c30;border:1px solid var(--line);border-radius:8px;margin-bottom:8px}
.mo-search::placeholder{color:var(--td)}
.mo-search:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.mo-frow{display:flex;gap:6px;margin-bottom:8px;align-items:flex-start}
.mo-wrap{flex-wrap:wrap}
.mo-flab{flex:0 0 auto;font-size:11px;color:var(--td-strong);padding-top:7px;width:52px}
.mo-chips{flex:1;display:flex;flex-wrap:wrap;gap:5px}
.mo-meta{font-size:11px;color:var(--td-strong);padding:0 2px 8px}
.mo-meta b{color:var(--pm)}
.mo-list{display:flex;flex-direction:column;gap:8px;padding-bottom:8px}
.mo-known{font-style:normal;font-size:10px;color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));
  border-radius:4px;padding:0 5px;font-weight:700;margin-left:8px;border:1px solid rgba(79,193,255,.5)}
.sp-pop-bodytxt{font-size:13px;color:var(--parchment);line-height:1.9;white-space:pre-line;
  padding:10px 12px;border:1px dashed rgba(90,180,255,.25);border-radius:var(--radius-md);background:rgba(79,193,255,.05);margin-bottom:8px}

/* 物品图鉴行 */
.mo-irow{width:100%;text-align:left;display:flex;flex-direction:column;gap:3px;padding:10px 12px;color:inherit;
  border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card)}
.mo-irow:active{background:#0e2842}
.mo-irow-main b{font-size:14px;color:var(--parchment)}
.mo-irow-main em{font-style:normal;font-size:11px;color:var(--td-strong);margin-left:6px}
.mo-irow-main small.mo-isub{display:block;font-size:11px;color:var(--acc);margin-top:2px}
.mo-irow-meta{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--td-strong);margin-top:1px}
.mo-irow-meta>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mo-kind{font-style:normal}
.mo-block-lab{font-size:11px;color:var(--acc);letter-spacing:.4px;margin:10px 0 6px;font-weight:700}
.mo-extra{font-size:13px;color:var(--parchment);line-height:1.8;white-space:pre-line;padding:10px 12px;
  border:1px dashed rgba(90,180,255,.28);border-radius:var(--radius-md);background:rgba(79,193,255,.05)}
.mo-extra.empty{color:var(--td-strong);font-size:12px;background:none}
.mo-ipop{position:fixed;inset:0;z-index:365;background:rgba(1,4,9,.72);display:flex;justify-content:center;overflow-y:auto}
.mo-ipop-acts{display:flex;gap:6px;margin-top:12px}
.mo-ipop-acts .sp-btn{flex:1 1 0}

/* 怪物行 */
.mo-mon{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);overflow:hidden}
.mo-mon-head{display:flex;align-items:baseline;gap:8px;padding:9px 12px;border-bottom:1px solid rgba(90,180,255,.12);
  background:linear-gradient(90deg,rgba(79,193,255,.12),rgba(79,193,255,.01))}
.mo-mon-head b{font-size:15px;color:var(--acc-light)}
.mo-mon-head em{font-style:normal;font-size:11px;color:var(--td-strong)}
.mo-mon-cr{margin-left:auto;font-size:11px;color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));
  border-radius:12px;padding:1px 8px;font-weight:700}
.mo-mon-bits{display:flex;flex-wrap:wrap;gap:5px;padding:8px 12px}
.mo-mon-k{font-style:normal;font-size:11px;color:var(--pm);border:1px solid rgba(90,180,255,.22);border-radius:5px;padding:2px 7px}
.mo-mon-k b{color:var(--td-strong);font-weight:600;margin-right:4px}
.mo-mon-stats{display:flex;flex-wrap:wrap;gap:4px;padding:0 12px 8px}
.mo-mon-ab{font-style:normal;font-size:10px;color:var(--td-strong);border:1px dashed rgba(90,180,255,.2);border-radius:4px;padding:1px 5px}
.mo-mon-ab b{color:var(--pm);margin-right:3px}
.mo-mon-acts{display:flex;flex-direction:column;gap:6px;padding:8px 12px 12px}
.mo-mon-act{font-size:12px;color:var(--parchment);line-height:1.75;border-left:3px solid var(--acc-dark);padding-left:9px}
.mo-mon-act b{color:var(--acc-light)}
.mo-mon-import{display:flex;gap:6px;margin:12px auto 0;max-width:280px}
.mo-mon-import .sp-btn{flex:1 1 0}

/* 画廊 */
.mo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px;margin-top:4px}
.mo-tile{position:relative;border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;background:var(--bg-card);
  aspect-ratio:1/1;display:flex;flex-direction:column;padding:0}
.mo-tile img{width:100%;height:calc(100% - 22px);object-fit:cover;display:block;background:#050c16}
.mo-tile .mo-tile-cap{font-size:10px;color:var(--pm);padding:3px 5px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:rgba(79,193,255,.06)}
.mo-tile:active{border-color:var(--acc)}
.mo-lbox{position:fixed;inset:0;z-index:375;background:rgba(1,4,9,.88);display:flex;justify-content:center;align-items:center;padding:12px}
.mo-lbox-card{width:100%;max-width:430px;max-height:92vh;display:flex;flex-direction:column;background:var(--bg-deep);
  border:1px solid var(--line);border-radius:12px;overflow:hidden}
.mo-lbox-img{flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 30%,#0b2136,#040a13 78%);padding:8px}
.mo-lbox-img img{max-width:100%;max-height:62vh;object-fit:contain;display:block}
.mo-lbox-cap{font-size:11px;color:var(--td-strong);padding:8px 12px;border-top:1px solid rgba(90,180,255,.14);word-break:break-all}
.mo-lbox-cap code{color:var(--acc-light);font-family:Consolas,monospace}

/* 角色升级 */
.lv-now{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px;margin-bottom:8px}
.lv-card{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);padding:10px 8px;text-align:center}
.lv-card span{display:block;font-size:11px;color:var(--td-strong);margin-bottom:3px}
.lv-card b{font-size:20px;color:var(--acc-light)}
.lv-bar{height:8px;border-radius:6px;background:#0a1c30;border:1px solid rgba(90,180,255,.2);overflow:hidden;margin:2px 0 10px}
.lv-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc-dark),var(--acc-light));border-radius:6px}
.lv-row{display:flex;align-items:center;gap:8px;margin:10px 0}
.lv-lab{font-size:12px;color:var(--td-strong);flex:0 0 auto}
.mo-lvselect{flex:1;min-width:0;padding:10px 8px;font-size:14px;color:var(--parchment);background:#0a1c30;border:1px solid var(--line);border-radius:8px}
.mo-lvselect:focus{outline:none;border-color:var(--acc)}
.lv-go{width:100%;padding:12px 10px;font-size:14px}
.lv-go:disabled{opacity:.45}
.lv-undo{width:100%;padding:11px 10px;margin-top:8px}
.mo-note-soft{font-size:11px;color:var(--td-strong);line-height:1.7;margin-top:10px;padding:8px 10px;
  border:1px dashed rgba(255,190,120,.35);border-radius:var(--radius-md);background:rgba(255,190,120,.05)}

/* 版本信息 */
.mo-ver{text-align:center;padding:6px 0}
.mo-ver-name{font-size:16px;font-weight:800;color:var(--acc-light);margin-bottom:6px}
.mo-ver-badge{display:inline-block;font-size:24px;font-weight:800;color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));
  border-radius:12px;padding:6px 18px;margin:4px 0 12px;box-shadow:0 0 16px var(--acc-glow)}
.mo-ver-log{font-size:12px;color:var(--pm);line-height:1.9;text-align:left;padding:9px 12px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:var(--bg-card);margin-bottom:6px}
.mo-ver .bt-note{text-align:left}

/* =====================================================================
 * DM 端 FR-9（同站横屏双端 · js/dm.js）：玩家汇总 / 怪物图鉴 / 商店入口
 * ===================================================================== */
body.dm{max-width:none;overflow:auto;align-items:flex-start}
body.dm .topbar{display:none}
.dm-view{position:relative;z-index:1;width:100%;min-width:900px;min-height:100%;padding:12px 16px calc(24px + var(--safe-b));
  display:flex;flex-direction:column;gap:10px;align-items:stretch}
.dm-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:9px 12px;border:1px solid var(--line);border-radius:var(--radius-md);
  background:linear-gradient(90deg,#0d2136,#081624);box-shadow:0 2px 12px rgba(0,0,0,.35)}
.dm-title{min-width:0;margin-right:auto}
.dm-h2{font-size:17px;font-weight:800;color:var(--acc-light);letter-spacing:1px;line-height:1.2}
.dm-sub{font-size:11px;color:var(--td-strong);margin-top:2px;letter-spacing:.3px}
.dm-seg{flex:0 0 auto;margin:0;align-items:center}
.dm-seg .seg-btn{white-space:nowrap}
.dm-tools{flex:0 0 auto;display:flex;gap:8px}
.dm-tbtn{display:inline-flex;align-items:center;min-height:40px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;font-size:12.5px;font-weight:700;
  color:var(--acc-light);background:rgba(79,193,255,.08);white-space:nowrap}
.dm-tbtn:active{background:rgba(79,193,255,.22)}
.dm-backbtn{border-color:rgba(255,122,110,.4);color:#ffb0a8;background:rgba(255,122,110,.08)}
.dm-backbtn:active{background:rgba(255,122,110,.2)}
.dm-btn{display:flex;align-items:center;justify-content:center;min-height:40px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-size:12px;font-weight:700;
  color:var(--acc-light);background:linear-gradient(180deg,#0e2842,#0a1d33);text-align:center;width:100%}
.dm-btn:active{background:#123352}
.dm-btn.primary{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}
.dm-btn:disabled{opacity:.5}

/* —— 双面板切换 —— */
.dm-pane{display:none}
.dm-pane.is-on{display:flex}
.dm-pane-players.is-on{flex-direction:row;align-items:flex-start;gap:12px}
.dm-pane-monsters.is-on{flex-direction:column;gap:10px;min-width:0}

/* —— 左侧 DM 名单 —— */
.dm-side{flex:0 0 264px;min-width:264px;display:flex;flex-direction:column;gap:8px;
  border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);
  padding:10px;box-shadow:0 2px 10px rgba(0,0,0,.3)}
.dm-side-head{font-size:13px;font-weight:800;color:var(--acc-light);
  padding:2px 2px 6px;border-bottom:1px solid rgba(90,180,255,.16);display:flex;justify-content:space-between;align-items:center}
.dm-cnt{font-size:11px;color:var(--td-strong);font-weight:400}
.dm-roster{display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow-y:auto;padding-right:2px}
.dm-row{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:7px 8px;
  border:1px solid rgba(90,180,255,.16);border-radius:8px;background:rgba(79,193,255,.045)}
.dm-row .r-ava{flex:0 0 30px;width:30px;height:30px;border-radius:7px;display:grid;place-items:center;
  background:linear-gradient(135deg,#12314f,#0a2238);border:1px solid var(--acc-dark);color:var(--acc-light);
  font-size:14px;overflow:hidden}
.dm-row .r-main{flex:1 1 auto;min-width:0}
.dm-row .r-name{display:block;font-size:13px;font-weight:700;color:var(--parchment);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-row .r-sub{display:block;font-size:10.5px;color:var(--pm);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-row .r-time{display:block;font-size:9.5px;color:var(--td-strong);margin-top:1px}
.dm-row .r-del{flex:0 0 40px;width:40px;height:40px;border-radius:6px;border:1px solid rgba(255,122,110,.35);
  color:#ff9c92;font-size:12px;display:grid;place-items:center;background:rgba(255,122,110,.06)}
.dm-row .r-del:active{background:rgba(255,122,110,.22)}
.dm-row-empty{padding:14px 8px;text-align:center;color:var(--td-strong);font-size:12px;line-height:1.7}
.dm-side-btns{display:flex;flex-direction:column;gap:6px;border-top:1px solid rgba(90,180,255,.14);padding-top:8px}
.dm-side-note{font-size:10px;color:var(--td-strong);line-height:1.6}

/* —— 主区：玩家汇总卡网格 —— */
.dm-main{flex:1 1 auto;min-width:0}
.dm-main-head{font-size:13px;color:var(--acc-light);font-weight:700;margin-bottom:8px;display:flex;align-items:baseline;gap:8px}
.dm-main-head small{font-size:10.5px;color:var(--td-strong);font-weight:400}
.dm-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(332px,1fr));gap:12px;align-items:start}
.dm-pc{border:1px solid var(--line);border-radius:var(--radius-md);background:linear-gradient(180deg,#0b1c2e,#081624);
  overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:8px;padding:10px 12px 12px}
.dm-pc-top{display:flex;align-items:center;gap:9px}
.dm-ava{flex:0 0 38px;width:38px;height:38px;border-radius:9px;display:grid;place-items:center;overflow:hidden;
  background:linear-gradient(135deg,#12314f,#0a2238);border:1px solid var(--acc-dark);color:var(--acc-light);
  font-size:17px;font-weight:800;box-shadow:inset 0 0 12px rgba(79,193,255,.16)}
.dm-pc-id{flex:1 1 auto;min-width:0}
.dm-pc-name{display:block;font-size:15px;font-weight:800;color:var(--acc-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-pc-sub{display:block;font-size:11px;color:var(--pm);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-pc-ref{flex:0 0 auto;width:40px;height:40px;border:1px solid var(--line);border-radius:8px;background:rgba(79,193,255,.07);
  color:var(--acc-light);font-size:14px;display:grid;place-items:center}
.dm-pc-ref:active{background:rgba(79,193,255,.24)}
.dm-hprow{display:flex;align-items:center;gap:8px}
.dm-hp-lab{font-size:11px;color:var(--td-strong);flex:0 0 auto}
.dm-hpbar{flex:1 1 auto;height:8px;border-radius:6px;background:#06101d;border:1px solid rgba(90,180,255,.22);overflow:hidden}
.dm-hpbar i{display:block;height:100%;border-radius:6px;
  background:linear-gradient(90deg,#7fe0a8,#4fc1ff);box-shadow:0 0 8px rgba(79,193,255,.4)}
.dm-hpbar.low i{background:linear-gradient(90deg,#ff7a6e,#ffb0a8);box-shadow:0 0 8px rgba(255,122,110,.4)}
.dm-hp-num{font-size:13px;font-weight:800;color:var(--parchment);flex:0 0 auto;font-variant-numeric:tabular-nums}
.dm-kvs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.dm-kv{border:1px solid rgba(90,180,255,.18);border-radius:8px;text-align:center;padding:5px 2px;background:rgba(79,193,255,.04)}
.dm-kv b{display:block;font-size:13.5px;color:var(--acc-light);font-variant-numeric:tabular-nums}
.dm-kv i{display:block;font-style:normal;font-size:9.5px;color:var(--td-strong);margin-top:1px}
.dm-sec-lab{font-size:10.5px;color:var(--acc);font-weight:700;letter-spacing:.5px;border-left:3px solid var(--acc-dark);padding-left:6px}
.dm-chiprow{display:flex;flex-wrap:wrap;gap:5px}
.dm-chip{font-style:normal;font-size:11px;color:var(--pm);border:1px solid rgba(90,180,255,.22);border-radius:5px;padding:2px 7px;background:rgba(79,193,255,.05)}
.dm-chip b{color:var(--acc-light);font-weight:700;margin-right:3px}
.dm-chip .u{color:var(--danger);font-weight:700}
.dm-none{font-size:11px;color:var(--td-strong);font-style:italic}
.dm-note{width:100%;min-height:40px;resize:vertical;border:1px solid rgba(90,180,255,.24);border-radius:8px;
  background:#050d18;color:var(--parchment);font-family:var(--font);font-size:12px;line-height:1.6;padding:6px 8px}
.dm-note:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px rgba(79,193,255,.18)}
.dm-cards-empty{border:1px dashed var(--line);border-radius:var(--radius-md);color:var(--td-strong);font-size:13px;
  text-align:center;padding:34px 16px;line-height:2;background:rgba(79,193,255,.02)}
.dm-cards .dm-cards-empty{grid-column:1/-1}
.dm-upd{font-style:normal;font-weight:400;font-size:9.5px;color:var(--td-strong);margin-left:6px}

/* —— 怪物面板 —— */
.dm-mon-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid var(--line);border-radius:var(--radius-md);
  background:var(--bg-card);padding:9px 12px}
.dm-mon-top .dm-main-head{margin:0;flex:1 1 auto;min-width:220px}
.dm-search{flex:0 0 230px;min-height:40px;border:1px solid var(--line);border-radius:8px;background:#050d18;color:var(--parchment);
  font-size:12.5px;padding:8px 10px;font-family:var(--font)}
.dm-search:focus{outline:none;border-color:var(--acc)}
.dm-mon-top .dm-btn{flex:0 0 auto;width:auto}
.dm-mon-body{display:flex;flex-direction:column;gap:9px}
.dm-mon-empty{border:1px dashed var(--line);border-radius:var(--radius-md);color:var(--td-strong);text-align:center;
  padding:30px 18px;font-size:13px;line-height:2;background:rgba(79,193,255,.02)}
.dm-mon-empty .dm-btn{max-width:240px;margin:10px auto 0}

/* —— 从角色库勾选加入：弹层 —— */
.dm-libover{position:fixed;inset:0;z-index:370;background:rgba(1,4,9,.8);display:flex;justify-content:center;align-items:flex-start}
.dm-libsheet{width:100%;max-width:560px;max-height:88vh;margin-top:5vh;overflow:hidden;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#081624,#04090f 90%);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 8px 40px rgba(0,0,0,.55);animation:wzUp .2s ease}
.dm-lib-head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid rgba(90,180,255,.16);
  background:linear-gradient(90deg,rgba(79,193,255,.14),rgba(79,193,255,.02))}
.dm-lib-head b{flex:1;font-size:14.5px;color:var(--acc-light)}
.dm-lib-x{width:40px;height:40px;border:1px solid var(--line);border-radius:8px;background:rgba(79,193,255,.07);
  color:var(--td);font-size:14px;line-height:1}
.dm-lib-list{overflow-y:auto;padding:8px;display:flex;flex-direction:column;gap:6px}
.dm-librow{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:8px 10px;
  border:1px solid rgba(90,180,255,.16);border-radius:9px;background:rgba(79,193,255,.04)}
.dm-librow .ck{flex:0 0 18px;width:18px;height:18px;border-radius:5px;border:1px solid var(--acc-dark);display:grid;place-items:center;
  color:transparent;font-size:12px;background:#050d18}
.dm-librow.is-sel{border-color:var(--acc);background:rgba(79,193,255,.13);box-shadow:0 0 0 1px var(--acc) inset}
.dm-librow.is-sel .ck{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc))}
.dm-librow.is-onlist{opacity:.6;pointer-events:none}
.dm-librow.is-onlist .ck{color:var(--acc);border-color:var(--acc);font-size:10px;color:#02111f;background:rgba(79,193,255,.5)}
.dm-librow .l-ava{flex:0 0 30px;width:30px;height:30px;border-radius:7px;display:grid;place-items:center;overflow:hidden;
  background:linear-gradient(135deg,#12314f,#0a2238);border:1px solid var(--acc-dark);color:var(--acc-light);font-size:14px}
.dm-librow .l-main{flex:1;min-width:0}
.dm-librow .l-name{display:block;font-size:13px;font-weight:700;color:var(--parchment);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-librow .l-sub{display:block;font-size:10.5px;color:var(--pm);margin-top:1px}
.dm-librow .l-tag{flex:0 0 auto;font-size:10px;color:var(--td-strong)}
.dm-lib-empty{padding:22px 12px;text-align:center;color:var(--td);font-size:12.5px;line-height:1.8}
.dm-lib-foot{display:flex;gap:8px;padding:10px 12px;border-top:1px solid rgba(90,180,255,.14)}
.dm-lib-foot .dm-btn{flex:1}
.dm-lib-foot .dm-ghost{background:rgba(79,193,255,.05);color:var(--td-strong)}

/* ============================================================
   FR-B 设置：浅色主题（CSS 变量覆盖 + 少量硬编码色收敛，保证可读性）
   默认仍为 FF 蓝黑（html[data-theme="dark"]）；浅色仅作基础可用实现。
   ============================================================ */
html[data-theme="light"]{
  --acc:#1668b3; --acc-light:#0d4f8b; --acc-dark:#2b8fd6; --acc-glow:rgba(22,104,179,.18);
  --bg-deep:#eef4fa; --bg-panel:#f7fbff; --bg-card:#ffffff;
  --parchment:#12212f; --pm:#33506b; --td:#5d7b96; --line:rgba(22,104,179,.28);
  /* 小字号次要文字专用：比 --td 更深（rgb(79,106,132)），同色相加深，保证浅底 >= 4.5（最差底 rgb(220,232,244) 仍 4.53） */
  --td-strong:#4f6a84;
  --danger:#c0392b; --ok:#1f7a4d;
}
html[data-theme="light"] .topbar{background:linear-gradient(180deg,#ffffff,#eaf2fa)}
html[data-theme="light"] .bottomnav{background:rgba(255,255,255,.96)}
html[data-theme="light"] .char-avatar,
html[data-theme="light"] .dm-librow .l-ava{background:linear-gradient(135deg,#d8e9f8,#bcd8f0);color:var(--acc-light)}
html[data-theme="light"] .avatar-wrap .level-badge{color:#ffffff}
html[data-theme="light"] .seg-btn.is-active,
html[data-theme="light"] .sp-chip.is-on,
html[data-theme="light"] .dm-librow.is-sel .ck{color:#ffffff;background:linear-gradient(180deg,var(--acc),var(--acc-dark));border-color:var(--acc-dark)}
html[data-theme="light"] .fab{background:linear-gradient(145deg,var(--acc),var(--acc-dark));color:#ffffff}
html[data-theme="light"] .menu-item,
html[data-theme="light"] .group-card,
html[data-theme="light"] .bt-card,
html[data-theme="light"] .ph-card{background:var(--bg-card);box-shadow:0 1px 2px rgba(18,33,47,.06)}
html[data-theme="light"] .group-head,
html[data-theme="light"] .mo-head{background:linear-gradient(90deg,rgba(22,104,179,.14),rgba(22,104,179,.02))}
html[data-theme="light"] .mo-over{background:rgba(210,224,238,.72)}
html[data-theme="light"] .toast{background:linear-gradient(180deg,#ffffff,#e8f1fa);color:var(--acc-light)}
html[data-theme="light"] .dm-librow{background:rgba(22,104,179,.05)}

/* ============================================================
   方案 A · 浅色主题「深底界面」令牌回落（2026 · 无头 Edge 实测后新增）
   浅色主题下仍有一批**界面本身是深底**的容器（它们沿用深色主题的深蓝渐变，未做浅色收敛）：
     建卡向导弹层 .wz-card / 角色页头像卡 .active-card、.ov-hero / 法术详情弹层 .sp-pop-card /
     DM 角色库勾选弹层 .dm-libsheet / DM 顶部与玩家卡 .dm-top、.dm-pc、.dm-kvs / DM 商店面板 .dms、#dmShopPanel /
     骰子面板 .dc-over、.dc-card
   在这些深底里：浅色档的 --td(#5d7b96) 与 --td-strong(#4f6a84) 都偏暗（实测 2.9~3.9 < 4.5）。
   处理方式：在这些容器内把两个「次要文字令牌」回落为**深色档 --td 的取值 #7b9dbd**（深底上既有的已验收配色，
   与深色主题观感一致），从而让容器内所有引用令牌的规则（含本批新替换的规则）在深底上 >= 4.5。
   注意：① 深色主题（默认档）不受影响；② 只列**整体深底**的容器 —— 弹层「遮罩层 + 浅色卡片」那种结构
   （.mo-ipop / .dm-stover / .ft-pop 等）**不算**，否则会把它内部的浅色卡改淡；③ 深底容器内的浅色内嵌卡
   （如 .wz-card 内的 .sum-card/.bt-card）在下面第二条把令牌恢复浅色档取值。
   实测（浅色主题，tools/e2e-contrast.mjs 断言 A1/A4 + tools/_probe/td-fontsize-measure.mjs）：
     .wz-card 内 11px 说明文字：#081624 底 2.89 → 6.71；.dms-row 内 11.5px 价格：#0b1c2e 底 3.06 → 6.13。
   ============================================================ */
html[data-theme="light"] .wz-card,
html[data-theme="light"] .active-card,
html[data-theme="light"] .ov-hero,
html[data-theme="light"] .sp-pop-card,
html[data-theme="light"] .dm-libsheet,
html[data-theme="light"] .dm-top,
html[data-theme="light"] .dm-pc,
html[data-theme="light"] .dm-kvs,
html[data-theme="light"] .dms,
html[data-theme="light"] #dmShopPanel,
html[data-theme="light"] .dc-over,
html[data-theme="light"] .dc-card{--td:#7b9dbd; --td-strong:#7b9dbd}
/* 小批 22 · 补漏：DM 端深底容器（商店工具面板 .dms / #dmShopPanel 与掷骰覆盖层）在浅色主题下
 * **只**回退了 --td / --td-strong，其余文字令牌仍是浅色档的**深色值**（--acc-light #0d4f8b、
 * --parchment #12212f、--pm #33506b、--ok #1f7a4d…），而这两块的背景始终是深底
 * （.dms 为 rgba(2,6,12,.95)）→ 实测出现「深字压深底」的低对比度文字。
 * 此前它只表现为 e2e-contrast 的「越界残余」（不计入 failures）；本轮商店/图鉴新增 1555 条
 * 魔法物品后逐行渲染放大了同一处颜色问题（原来 416 行 → 1971 行），故在此按既有惯例
 * （同 .wz-card / .dc-over 的做法）把**深底容器内的文字令牌恢复为深底档取值**。 */
html[data-theme="light"] .dms,
html[data-theme="light"] #dmShopPanel{
  --acc:#4fc1ff; --acc-light:#b8e4ff; --acc-dark:#2e8fd8;
  --parchment:#e9f2fb; --pm:#a9c4de; --ok:#7fe0a8;
  --line:rgba(90,180,255,.30);
  --td:#7b9dbd; --td-strong:#7b9dbd;
}
/* 上述深底容器内的**浅色内嵌卡**：令牌恢复浅色档取值（浅底上仍是 --td-strong 更可读） */
html[data-theme="light"] .wz-card .sum-card,
html[data-theme="light"] .wz-card .bt-card,
html[data-theme="light"] .sp-pop-card .bt-card,
html[data-theme="light"] .dc-over .bt-card{--td:#5d7b96; --td-strong:#4f6a84}
/* 建卡向导（.wz-card 是深底容器）内的**白底内嵌卡**：第 4 步属性格与第 6 步购物分类/行。
 * 漏挂令牌回落时，这两块白底上的文字会拿到深底档 #7b9dbd → 实测只有 2.57~2.84（< 4.5），
 * 由 tools/e2e-contrast.mjs 的 A4 守卫（「深底容器令牌值只允许出现在深底上」）实测发现并登记。*/
html[data-theme="light"] .wz-card .abil-row,
html[data-theme="light"] .wz-card .shop-cat,
html[data-theme="light"] .wz-card .shop-row{--td:#5d7b96; --td-strong:#4f6a84}
/* 浅色主题下「浅蓝调底」的弹层头部 / 大按钮：--td-strong(#4f6a84) 在这些底上实测只有 4.20~4.28（<4.5），
   就近改用浅色档正文次要色 --pm(#33506b)（实测 >= 6.2）；仅浅色主题生效 */
html[data-theme="light"] .mo-head,
html[data-theme="light"] .rs-big{--td-strong:var(--pm)}

/* ---------- 设置弹层小部件 ---------- */
.set-over .mo-sheet{max-width:560px}
.set-chips{flex-wrap:wrap;gap:6px}
.set-seg{display:flex;gap:6px;flex-wrap:wrap;margin:2px 0 8px}
.set-row{display:flex;align-items:center;gap:10px;justify-content:space-between;
  padding:8px 2px;border-bottom:1px dashed rgba(90,180,255,.16)}
.set-lab{font-size:12.5px;color:var(--pm)}
.set-val{font-size:12px;color:var(--td-strong)}
.set-sw{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:56px;min-height:40px;padding:5px 12px;border:1px solid var(--line);border-radius:16px;
  background:rgba(79,193,255,.06);color:var(--td-strong);font-size:12px;font-weight:700}
.set-sw.is-on{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:var(--acc-dark)}
html[data-theme="light"] .set-sw.is-on{color:#fff;background:linear-gradient(180deg,var(--acc),var(--acc-dark))}
.set-inp{width:96px;min-height:40px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;
  background:rgba(6,16,28,.55);color:var(--parchment);font-size:13px;text-align:right}
html[data-theme="light"] .set-inp{background:#fff}
.set-inp.sm{width:104px}
.set-curve{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 10px;margin:6px 0 10px}
.set-crow{display:flex;align-items:center;gap:8px;justify-content:space-between;
  padding:3px 6px;border-radius:6px;background:rgba(79,193,255,.05)}
.set-clv{font-size:11.5px;color:var(--td-strong);flex:0 0 34px}
.set-cxp{font-size:12px;color:var(--pm);font-variant-numeric:tabular-nums}
.set-ver{margin-top:10px;text-align:center;font-size:11.5px;color:var(--td-strong)}

/* ---------- 快速开始（FR-3） ---------- */
.qs-seg{display:flex;gap:8px;margin:0 0 10px}
.qs-seg .sp-btn{flex:1}
.qs-q{padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:var(--bg-card);margin-bottom:10px}
.qs-q-head{font-size:13px;font-weight:700;color:var(--acc-light);margin-bottom:8px}
.qs-q-head i{font-style:normal;font-size:10px;color:var(--td-strong);margin-left:6px;font-weight:400}
.qs-opts{display:flex;flex-wrap:wrap;gap:6px}
.qs-opt{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:6px 12px;border:1px solid var(--line);border-radius:18px;background:rgba(79,193,255,.05);
  color:var(--pm);font-size:12.5px}
.qs-opt.is-on{color:#02111f;font-weight:700;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:var(--acc-dark)}
html[data-theme="light"] .qs-opt.is-on{color:#fff;background:linear-gradient(180deg,var(--acc),var(--acc-dark))}
.qs-tpl{display:flex;flex-direction:column;gap:8px}
.qs-tcard{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:10px 12px;
  border:1px solid var(--line);border-radius:10px;background:var(--bg-card)}
.qs-tcard.is-on{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc) inset}
.qs-tava{flex:0 0 42px;width:42px;height:42px;border-radius:9px;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(135deg,#12314f,#0a2238);border:1px solid var(--acc-dark);color:var(--acc-light);font-size:16px}
.qs-tava img{width:100%;height:100%;object-fit:cover;display:block}
.qs-tmain{flex:1;min-width:0}
.qs-tname{display:block;font-size:13.5px;font-weight:700;color:var(--parchment)}
.qs-tsub{display:block;font-size:11px;color:var(--pm);margin-top:2px}
.qs-tdesc{display:block;font-size:11px;color:var(--td-strong);margin-top:3px}
.qs-row{display:flex;gap:8px;margin-top:10px}
.qs-row .sp-btn{flex:1}
.qs-recap{padding:10px 12px;border:1px dashed var(--line);border-radius:9px;background:rgba(79,193,255,.04);
  font-size:12.5px;color:var(--pm);line-height:1.9}
.qs-recap b{color:var(--acc-light)}
.qs-dis{color:var(--danger);font-size:12px;line-height:1.8;padding:8px 10px;border:1px solid rgba(255,122,110,.4);
  border-radius:8px;background:rgba(255,122,110,.08);margin-bottom:10px}
.sp-btn[disabled],.qs-opt[disabled]{opacity:.45;pointer-events:none}

/* =====================================================================
 * FR-10 升级向导（js/levelup.js）：步骤式弹层 · .lu- 前缀（移动优先）
 * 层级：.lu-over 350（高于 .mo-over 340）· .lu-dpop 392（高于法术详情 .sp-pop 380）
 * ===================================================================== */
.lu-over{position:fixed;inset:0;z-index:350;background:rgba(1,4,9,.82);display:flex;justify-content:center;align-items:flex-start;overflow:hidden}
.lu-sheet{width:100%;max-width:560px;height:100%;display:flex;flex-direction:column;background:var(--bg-deep);
  border-left:1px solid var(--line);border-right:1px solid var(--line);box-shadow:0 0 40px rgba(0,0,0,.65);
  padding-bottom:var(--safe-b)}
.lu-head{border-bottom:1px solid rgba(90,180,255,.18);background:linear-gradient(90deg,rgba(79,193,255,.18),rgba(79,193,255,.02))}
.lu-sub{font-weight:400;font-size:10px;color:var(--td-strong);margin-left:6px}
.lu-steps{display:flex;gap:4px;overflow-x:auto;padding:8px 10px 6px;border-bottom:1px solid rgba(90,180,255,.14);
  -webkit-overflow-scrolling:touch}
.lu-step{flex:1 0 auto;min-width:52px;min-height:40px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  padding:5px 6px;border:1px solid var(--line);border-radius:8px;background:rgba(79,193,255,.05);color:var(--td-strong);font-size:10px}
.lu-step i{font-style:normal;font-size:10px;font-weight:800;width:16px;height:16px;line-height:16px;text-align:center;
  border-radius:8px;background:rgba(79,193,255,.16);color:var(--acc-light)}
.lu-step.is-done{border-color:rgba(79,193,255,.45);color:var(--pm)}
.lu-step.is-done i{background:rgba(79,193,255,.4);color:#02111f}
.lu-step.is-cur{border-color:var(--acc);color:var(--acc-light);font-weight:800;box-shadow:0 0 0 1px var(--acc) inset}
.lu-step.is-cur i{background:linear-gradient(180deg,var(--acc-light),var(--acc));color:#02111f}
.lu-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px 14px 16px;-webkit-overflow-scrolling:touch}
.lu-foot{flex:0 0 auto;display:flex;flex-wrap:wrap;gap:8px;padding:10px 12px;border-top:1px solid rgba(90,180,255,.18);
  background:linear-gradient(0deg,rgba(79,193,255,.06),transparent)}
.lu-foot .sp-btn{flex:1 1 auto;min-width:0}
.lu-foot .lu-main{flex:2 1 120px;padding:11px 8px;font-size:13px}
.lu-foot .lu-err,.lu-foot [data-lu="gate"]{flex:1 0 100%}
.lu-tip{font-size:12px;color:var(--pm);line-height:1.75;margin-bottom:10px;padding:8px 10px;border:1px dashed var(--line);
  border-radius:var(--radius-md);background:rgba(79,193,255,.05)}
.lu-tip b{color:var(--acc-light)}
.lu-tip small{color:var(--td-strong)}
.lu-info{font-size:11.5px;color:var(--td-strong);line-height:1.7;padding:6px 2px}
.lu-info b{color:var(--acc-light)}
.lu-note{font-size:11px;color:var(--td-strong);line-height:1.75;padding:7px 10px;border:1px dashed rgba(90,180,255,.22);
  border-radius:var(--radius-md);background:rgba(79,193,255,.03);margin:6px 0}
.lu-warn{font-size:12px;color:#ffdf9a;line-height:1.7;padding:7px 10px;border:1px solid rgba(255,205,110,.42);
  border-radius:var(--radius-md);background:rgba(255,205,110,.09);margin:6px 0}
.lu-err{font-size:12px;color:#ff9c92;line-height:1.7;padding:7px 10px;border:1px solid rgba(255,122,110,.42);
  border-radius:var(--radius-md);background:rgba(255,122,110,.09);margin:6px 0}
.lu-warnred{font-size:11px;color:#ff9c92;line-height:1.7;padding:7px 10px;margin:6px 0;
  border:1px solid rgba(255,122,110,.42);border-radius:var(--radius-md);background:rgba(255,122,110,.08)}
.lu-openwiz{width:100%;padding:11px 10px;margin-top:8px;font-size:13px;font-weight:700;
  color:var(--acc-light);border:1px solid var(--acc-dark);border-radius:8px;background:rgba(79,193,255,.1)}
.lu-openwiz:disabled{opacity:.45}
.lu-row{display:flex;align-items:center;gap:8px;margin:8px 0}
.lu-lab{flex:0 0 auto;font-size:12px;color:var(--td-strong)}
.lu-select{flex:1;min-width:0;min-height:40px;padding:9px 8px;font-size:13.5px;color:var(--parchment);background:#0a1c30;
  border:1px solid var(--line);border-radius:8px}
.lu-select:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.lu-search{width:100%;box-sizing:border-box;padding:9px 10px;font-size:13px;color:var(--parchment);
  background:#0a1c30;border:1px solid var(--line);border-radius:8px;margin:6px 0}
.lu-search::placeholder{color:var(--td)}
.lu-search:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.lu-chk{display:flex;align-items:center;gap:8px;min-height:40px;font-size:12.5px;color:var(--pm);line-height:1.6;padding:7px 2px}
.lu-chk input{flex:0 0 auto;width:16px;height:16px;accent-color:#4fc1ff}
.lu-chk-inline{flex:1;min-width:0;padding:0;min-height:40px}
.lu-chk-inline b{color:var(--parchment);font-size:13px}
.lu-lvh{font-size:12px;font-weight:800;color:var(--acc-light);margin:11px 0 6px;display:flex;align-items:baseline;
  gap:6px;flex-wrap:wrap;letter-spacing:.3px}
.lu-lvh small{font-weight:400;font-size:10.5px;color:var(--td-strong)}
.lu-lvh .lu-libload{flex:0 0 auto;padding:4px 8px;font-size:10.5px}
.lu-hprow{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card)}
.lu-hprow{display:block;padding:9px 10px}
.lu-hphead{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.lu-hphead b{font-size:13.5px;color:var(--acc-light)}
.lu-hphead small{font-size:11px;color:var(--td-strong)}
.lu-hpgain{margin-left:auto;font-size:14px;font-weight:800;color:var(--acc-light);font-variant-numeric:tabular-nums}
.lu-modes{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:6px}
.lu-mode{display:inline-flex;align-items:center;min-height:40px;padding:5px 10px;border:1px solid var(--line);border-radius:16px;background:rgba(79,193,255,.05);
  color:var(--pm);font-size:11.5px}
.lu-mode.is-on{color:#02111f;font-weight:800;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:var(--acc-dark)}
.lu-hpctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lu-roll{flex:0 0 auto;padding:6px 10px;font-size:12px}
.lu-num{width:74px;padding:6px 8px;font-size:13px;text-align:center;color:var(--acc-light);background:rgba(3,10,20,.8);
  border:1px solid var(--line);border-radius:7px;font-variant-numeric:tabular-nums}
.lu-num:focus{outline:none;border-color:var(--acc)}
.lu-hpval{font-size:16px;font-weight:800;color:var(--acc-light);font-variant-numeric:tabular-nums}
.lu-hpdetail{font-size:10.5px;color:var(--td-strong);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lu-sumline{font-size:12.5px;color:var(--pm);line-height:1.8;margin-top:10px;padding:9px 10px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:rgba(79,193,255,.06)}
.lu-sumline b{color:var(--acc-light);font-size:15px}
.lu-featlv{margin-bottom:10px}
.lu-featrow{display:flex;align-items:center;gap:8px;padding:7px 9px;margin-bottom:5px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:var(--bg-card)}
.lu-featrow.is-off{opacity:.62;border-style:dashed}
.lu-featrow .lu-finfo{flex:0 0 auto;padding:5px 9px;font-size:11px}
.lu-skip{flex:0 0 auto;font-style:normal;font-size:10px;color:#ff9c92;border:1px solid rgba(255,122,110,.42);
  border-radius:5px;padding:0 5px}
.lu-spadded{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.lu-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 6px 4px 9px;border:1px solid var(--acc-dark);
  border-radius:14px;background:rgba(79,193,255,.12);color:var(--acc-light);font-size:12px}
.lu-chip i{font-style:normal;font-size:10px;color:var(--td-strong)}
.lu-x{border:none;background:transparent;color:var(--td-strong);font-size:11px;padding:0 2px;line-height:1}
.lu-x:active{color:#ff9c92}
.lu-cands{display:flex;flex-direction:column;gap:6px;max-height:280px;overflow-y:auto;padding:2px}
.lu-cand{display:flex;flex-direction:column;gap:5px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius-md);
  background:var(--bg-card)}
.lu-cand.is-sel{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc) inset;background:rgba(79,193,255,.09)}
.lu-cand.is-nojob{border-color:rgba(255,122,110,.42)}
.lu-candbtn{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;border:none;background:transparent;
  color:inherit;padding:0}
.lu-candbtn b{font-size:13px;color:var(--parchment)}
.lu-candbtn small{font-size:11px;color:var(--td-strong)}
.lu-nojob{font-style:normal;align-self:flex-start;font-size:10px;color:#ff9c92;border:1px solid rgba(255,122,110,.45);
  border-radius:5px;padding:0 5px;margin-top:3px}
.lu-candacts{display:flex;gap:6px;flex-wrap:wrap}
.lu-candacts .sp-btn{flex:1 1 auto;padding:7px 6px;font-size:12px}
.lu-caps{padding:7px 10px;border:1px solid rgba(255,205,110,.35);border-radius:var(--radius-md);
  background:rgba(255,205,110,.07);margin-bottom:8px}
.lu-asig{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);padding:8px 10px 10px;margin-bottom:9px}
.lu-asig .lu-row{margin:6px 0}
.lu-prepline{font-size:12px;color:var(--pm);line-height:1.8;padding:8px 10px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:rgba(79,193,255,.04)}
.lu-prepline b{color:var(--acc-light)}
.lu-reslist{border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;background:var(--bg-card)}
.lu-resrow{display:flex;align-items:center;gap:10px;padding:7px 10px;border-bottom:1px dashed rgba(90,180,255,.16)}
.lu-resrow:last-child{border-bottom:none}
.lu-resrow .k{flex:0 0 auto;font-size:12px;color:var(--td-strong);min-width:64px}
.lu-resrow .v{flex:1;text-align:right;font-size:13px;color:var(--acc-light);font-variant-numeric:tabular-nums}
.lu-sumcard{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);padding:10px 12px}
.lu-sumrows{display:flex;flex-direction:column;gap:5px;margin-bottom:8px}
.lu-sumrow{font-size:12px;color:var(--pm);line-height:1.75;border-left:3px solid var(--acc-dark);padding-left:8px}
.lu-dpop{position:fixed;inset:0;z-index:392;background:rgba(1,4,9,.86);display:flex;justify-content:center;
  align-items:center;padding:14px}
.lu-dpcard{width:100%;max-width:430px;max-height:88vh;display:flex;flex-direction:column;background:var(--bg-deep);
  border:1px solid var(--line);border-radius:12px;overflow:hidden}
.lu-dphead{background:linear-gradient(90deg,rgba(79,193,255,.16),rgba(79,193,255,.02))}
.lu-dpbody{flex:1 1 auto;min-height:0;overflow-y:auto;padding:10px 12px 14px}
.lu-dpsub{font-size:11px;color:var(--td-strong);margin-bottom:8px}
.lu-dptext{font-size:13px;color:var(--parchment);line-height:1.9;white-space:pre-line;padding:9px 11px;
  border:1px dashed rgba(90,180,255,.25);border-radius:var(--radius-md);background:rgba(79,193,255,.05)}
.lu-dptext.empty{color:var(--td)}
html[data-theme="light"] .lu-over{background:rgba(210,224,238,.72)}
html[data-theme="light"] .lu-dpop{background:rgba(210,224,238,.8)}
html[data-theme="light"] .lu-step.is-cur,html[data-theme="light"] .lu-mode.is-on{color:#fff}
html[data-theme="light"] .lu-mode.is-on{background:linear-gradient(180deg,var(--acc),var(--acc-dark))}
html[data-theme="light"] .lu-step.is-cur i{background:linear-gradient(180deg,var(--acc),var(--acc-dark));color:#fff}
html[data-theme="light"] .lu-select,html[data-theme="light"] .lu-search,html[data-theme="light"] .lu-num{background:#fff}

/* ===== #19 角色页三子页签（属性与技能 / 职业动作 / 特性·专长·背景）· 统一前缀 .cv- ===== */
.cv-card{margin-bottom:10px}
.cv-empty{display:flex;flex-direction:column;gap:5px;padding:12px 12px 14px;font-size:12px;color:var(--td-strong);line-height:1.7}
.cv-empty span{display:block}
.cv-ab-grid{display:flex;flex-direction:column;padding:6px 12px 2px}
.cv-ab-row{display:flex;align-items:center;gap:7px;padding:4px 0;border-bottom:1px dashed rgba(90,180,255,.14)}
.cv-ab-row:last-child{border-bottom:none}
.cv-ab-lab{flex:0 0 42px;font-size:13px;color:var(--pm)}
.cv-ab-inp{flex:1 1 auto;min-width:0;height:40px;text-align:center;font-size:16px;font-weight:800;
  font-variant-numeric:tabular-nums;color:var(--acc-light);background:rgba(79,193,255,.06);
  border:1px solid var(--line);border-radius:9px}
.cv-ab-inp:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.cv-ab-mod{flex:0 0 40px;text-align:center;font-size:13px;color:var(--td);font-variant-numeric:tabular-nums}
.cv-grid{padding:10px 12px}
.cv-check{min-height:40px}
.cv-skill-groups{display:flex;flex-direction:column;padding:6px 12px 10px}
.cv-sg{display:flex;flex-direction:column;gap:2px}
.cv-sg-t{font-size:11px;font-weight:800;color:var(--acc);letter-spacing:.5px;margin:6px 0 2px}
.cv-sg .bt-check-grid{padding:2px 0 6px}
.cv-rows{margin:0;border:none;border-radius:0}
.cv-langs{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px 4px}
.cv-lang{display:inline-flex;align-items:center;gap:5px;min-height:28px;padding:3px 10px;font-size:12px;
  color:var(--parchment);border:1px solid rgba(90,180,255,.35);border-radius:16px;background:rgba(79,193,255,.06)}
.cv-lang.is-own{color:var(--acc-light);border-color:var(--acc);background:rgba(79,193,255,.14)}
.cv-lang-tag{font-size:9px;font-style:normal;color:var(--td-strong);border:1px solid rgba(90,180,255,.3);
  border-radius:8px;padding:0 5px;min-height:16px;display:inline-flex;align-items:center}
.cv-lang.is-own .cv-lang-tag{color:var(--acc-light);border-color:rgba(184,228,255,.5)}
.cv-sec-t{font-size:12px;font-weight:800;color:var(--acc);padding:8px 12px 2px;letter-spacing:.4px}
.cv-sec-t small{font-size:10px;font-weight:400;color:var(--td-strong)}
.cv-feats{display:flex;flex-direction:column;gap:6px;padding:8px 12px 10px}
.cv-feat{padding:8px 10px;min-height:44px}
.cv-clip{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px;color:var(--pm)}
.cv-clip.is-none{color:var(--td-strong)}
.cv-act-row{display:flex;align-items:stretch;gap:6px}
.cv-act-row .cv-feat{flex:1 1 auto;min-width:0}
.cv-act-acts{display:flex;flex-direction:column;gap:6px;flex:0 0 auto;justify-content:center}
.cv-mini{min-width:52px;min-height:40px;padding:0 10px;font-size:11px;color:var(--pm);
  border:1px solid var(--line);border-radius:9px;background:rgba(79,193,255,.06)}
.cv-mini.danger{color:var(--danger);border-color:rgba(255,122,110,.45)}
.cv-mini:active{background:rgba(79,193,255,.24)}
.cv-actbar{display:flex;gap:8px;padding:0 12px 6px}
.cv-actbar .sp-btn{flex:1 1 auto}
.cv-pop{position:fixed;inset:0;z-index:394;background:rgba(1,4,9,.86);display:flex;align-items:center;
  justify-content:center;padding:14px}
.cv-pop-card{width:100%;max-width:420px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden;
  background:var(--bg-deep);border:1px solid var(--line);border-radius:12px}
.cv-pop-head{background:linear-gradient(90deg,rgba(79,193,255,.16),rgba(79,193,255,.02))}
.cv-field{display:flex;flex-direction:column;gap:4px;padding:8px 12px 0;font-size:11px;color:var(--td-strong)}
.cv-inp{width:100%;min-height:40px;padding:8px 10px;font-size:13px;color:var(--parchment);
  background:rgba(79,193,255,.06);border:1px solid var(--line);border-radius:9px;font-family:var(--font)}
.cv-inp:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--acc-glow)}
.cv-area{min-height:104px;resize:vertical;line-height:1.7}
.cv-pop-row{display:flex;gap:8px;padding:12px}
.cv-pop-row .sp-btn{flex:1 1 auto}
html[data-theme="light"] .cv-pop{background:rgba(210,224,238,.8)}
html[data-theme="light"] .cv-inp,html[data-theme="light"] .cv-ab-inp{background:#fff}
/* #3 旧数据（整行起始装备文本）在背包页的拆分展示 */
.iv-legacy{display:flex;flex-direction:column;gap:4px;margin:2px 12px 8px;padding:7px 9px;
  border:1px dashed rgba(90,180,255,.28);border-radius:var(--radius-md);background:rgba(79,193,255,.05)}
.iv-legacy-h{font-size:10px;color:var(--acc)}
.iv-legacy-list{display:flex;flex-wrap:wrap;gap:5px}
.iv-legacy-list i{font-style:normal;font-size:11px;color:var(--parchment);border:1px solid rgba(90,180,255,.3);
  border-radius:10px;padding:1px 7px;background:rgba(79,193,255,.08)}
.iv-legacy-tip{font-size:10px;color:var(--td-strong);line-height:1.5}
/* #18 空态说明：非法术职业 / 绑定施法职业 / 无资源与召唤物 */
.sp-nocast{border-color:rgba(255,214,110,.42);background:rgba(255,214,110,.06)}
.sp-nocast .bt-card-head{color:#ffd66e}
.sp-nocast-body{padding:2px 12px 11px;font-size:12px;color:var(--pm);line-height:1.75}
.sp-nocast-body small{color:var(--td-strong)}
.sp-slotnone{padding:10px 12px 12px;font-size:12px;color:var(--td-strong);line-height:1.75}
.sp-slots-none .bt-card-head{color:var(--td)}

/* ================================================================
   #5 商店全量分类 / 出处（_source）筛选 / 条目详情（js/inventory.js）
   新增分类 chip：坐骑与载具 · 饰品 · 商品与服务 · 攻城装备（与 category 对齐）
   ================================================================ */
.iv-chip-lab{font-size:10px;color:var(--td-strong);align-self:center;margin-right:2px;letter-spacing:.5px}
.iv-chip-row.iv-shop-srcrow{padding-top:4px}
/* 触屏可用性：出处 chip 与行内「详情」按钮统一 40px 高（移动端推荐值，tools/audit-ui.mjs 口径）。 */
.iv-chip.sm{font-size:10px;padding:2px 7px;display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px}
.iv-more{align-self:flex-start;margin-top:4px;padding:2px 8px;font-size:10px;color:var(--acc-light);
  border:1px solid var(--line);border-radius:7px;background:rgba(79,193,255,.06);
  display:inline-flex;align-items:center;min-height:40px}
.iv-more:active{background:rgba(79,193,255,.2)}
.iv-shop-row.is-open{background:rgba(79,193,255,.05);align-items:flex-start}
.iv-shop-det{margin-top:6px}
.iv-shop-det[hidden]{display:none}
.iv-shop-det .sp-fields{margin-bottom:6px}
.iv-shop-det .sp-field .v{word-break:break-word;overflow-wrap:anywhere}
.iv-shop-det .mo-block-lab{margin:6px 0 4px}
.iv-shop-det .mo-extra{padding:8px 10px;font-size:12px;line-height:1.75;
  word-break:break-word;overflow-wrap:anywhere}
html[data-theme="light"] .iv-shop-det .mo-extra{background:#fff}

/* ================================================================
   #7 法术详情全文（js/spells.js · data/library/spells-text.json 懒加载）
   「原文」标记 + 出处行 + 逐字正文（保留段落换行）+ 未收录占位
   ================================================================ */
.sp-pop-full{margin:2px 0 9px}
.sp-full-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.sp-full-lab{font-size:11px;font-weight:700;color:var(--acc-light);letter-spacing:.5px}
.sp-full-src{font-style:normal;font-size:10px;color:var(--td-strong);min-width:0;word-break:break-word}
.sp-tag.src{color:var(--acc-light);border-color:rgba(79,193,255,.45);background:rgba(79,193,255,.08)}
.sp-pop-full .sp-pop-bodytxt{max-height:52vh;overflow-y:auto;
  word-break:break-word;overflow-wrap:anywhere}
.sp-pop-full .sp-pop-note{margin-bottom:0}
.sp-full-none{border:1px dashed rgba(255,214,110,.35);border-radius:var(--radius-md);
  background:rgba(255,214,110,.06);padding:9px 11px;margin-bottom:0}
.sp-full-loading{color:var(--td-strong)}

/* ================================================================
   #4 图鉴·背景（出身特性）子页 + 详情弹层（js/more.js）
   卡面：背景名 / 英文名 + 特性短名 + 出处；弹层：featureName 标题 + featureText 正文
   ================================================================ */
.mo-bgrow .mo-isub{color:var(--acc-light)}
.mo-bgrow .mo-irow-meta>span{color:var(--td-strong)}
.mo-bgpop .mo-extra{max-height:46vh;overflow-y:auto;
  word-break:break-word;overflow-wrap:anywhere}
.mo-bgpop .sp-full-head{margin-bottom:6px}
.mo-bgpop .mo-sub{color:var(--acc-light);font-weight:400}
.mo-bgpop .sp-pop-note{word-break:break-word;overflow-wrap:anywhere}

/* ================================================================
   #13 / #14 / #10 / #15 / #17 战斗页战斗功能（js/battle.js）
   动作分池 · 通用动作名称条 · 职业资源槽 · 组合技 · 召唤物面板 ·
   机工储法物品 · 忍者忍术投掷 · 动作详情弹层
   ================================================================ */
/* ---- #13 动作分池 ---- */
.bt-pools{display:flex;flex-direction:column}
.bt-ag{border-top:1px solid rgba(90,180,255,.10)}
.bt-ag:first-child{border-top:none}
button.bt-ag-t{display:flex;align-items:center;gap:6px;width:100%;min-height:40px;padding:8px 12px;
  border:none;background:none;font-family:inherit;text-align:left;cursor:pointer;
  font-size:12px;font-weight:800;color:var(--acc)}
button.bt-ag-t:active{background:rgba(79,193,255,.10)}
.bt-ag-title{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-ag-hint{flex:0 0 auto;font-style:normal;font-size:9px;font-weight:400;color:var(--td-strong)}
.bt-ag-n{flex:0 0 auto;font-size:10px;font-weight:800;color:var(--acc-light);
  border:1px solid rgba(79,193,255,.35);border-radius:9px;padding:0 6px;line-height:15px}
.bt-ag-c{flex:0 0 auto;font-style:normal;font-size:10px;color:var(--td-strong)}
.bt-ag-body[hidden]{display:none}
.bt-act-list{display:flex;flex-direction:column;gap:6px}
button.bt-act{display:flex;flex-direction:column;gap:2px;width:100%;min-height:40px;padding:7px 10px;
  border:1px solid var(--line);border-radius:9px;background:rgba(79,193,255,.05);
  font-family:inherit;text-align:left;cursor:pointer}
button.bt-act:active{background:rgba(79,193,255,.18)}
.bt-act-n{font-size:12px;font-weight:700;color:var(--parchment);min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-act-s{font-size:10px;color:var(--td-strong);min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-act[data-src="pet"]{background:rgba(255,214,110,.06);border-color:rgba(255,214,110,.28)}
/* ---- 第五批：条目行内的「实现状态」小徽标（ISSUE-013 第 3 条 / ISSUE-008 第 6 条）----
   版式不变：.bt-act 仍是「名称 + 一行摘要」两个子元素，徽标挂在摘要行内第二段，
   摘要文本本身仍是 .bt-act-s 的第一个子元素（既有的「以 骰 / 使用：/ Lv. 开头」断言不受影响）。 */
.bt-act-s{display:flex;align-items:center;gap:5px}
.bt-act-sx{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-bdg{flex:0 0 auto;font-style:normal;font-size:9px;line-height:1.5;border-radius:8px;
  padding:0 5px;white-space:nowrap;border:1px solid var(--line);color:var(--td-strong)}
.bt-bdg[data-impl="done"]{color:var(--ok);border-color:rgba(127,224,168,.45);background:rgba(127,224,168,.10)}
.bt-bdg[data-impl="partial"]{color:#ffd0a0;border-color:rgba(255,180,110,.45);background:rgba(255,180,110,.10)}
.bt-bdg[data-impl="todo"]{color:#ffb4b4;border-color:rgba(255,120,120,.40);background:rgba(255,120,120,.08)}
.bt-bdg[data-impl="undef"]{color:#d6c8ff;border-color:rgba(180,160,255,.45);background:rgba(180,160,255,.10)}
/* ---- 第五批：详情弹层的「伤害构成（可追溯）」/「等级进化」/「实现状态」附加块 ---- */
.bt-pop-evo{margin:2px 12px 6px;padding:7px 10px;border:1px solid rgba(140,190,255,.35);border-radius:8px;
  background:rgba(90,150,255,.10);font-size:11px;color:var(--pm);line-height:1.65}
.bt-pop-atk{margin:2px 12px 8px;border:1px solid rgba(140,190,255,.30);border-radius:9px;
  background:rgba(79,193,255,.06);flex:0 0 auto;max-height:34vh;overflow-y:auto}
.bt-pop-atk-t{padding:6px 9px 2px;font-size:10.5px;font-weight:800;color:var(--acc-light);letter-spacing:.4px}
.bt-pop-atk-formula{padding:0 9px 6px;font-size:10px;color:var(--acc-light);word-break:break-word;line-height:1.6}
.bt-pop-atk-row{display:flex;flex-wrap:wrap;gap:2px 6px;padding:4px 9px;border-top:1px solid rgba(90,180,255,.12);
  align-items:baseline}
.bt-pop-atk-row .k{flex:0 0 auto;font-size:10px;font-weight:700;color:var(--parchment)}
.bt-pop-atk-row .v{flex:0 0 auto;font-size:10.5px;font-weight:800;color:var(--acc-light);font-variant-numeric:tabular-nums}
.bt-pop-atk-row .src{flex:1 1 100%;min-width:0;font-size:9.5px;color:var(--td-strong);line-height:1.5;
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-atk-sup,.bt-pop-atk-cond{padding:4px 9px;border-top:1px solid rgba(90,180,255,.12);
  font-size:9.5px;color:#ffd0a0;line-height:1.55;word-break:break-word;overflow-wrap:anywhere}
.bt-pop-stat{margin:2px 12px 8px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;
  background:rgba(255,255,255,.03);flex:0 0 auto}
.bt-pop-stat-l{font-size:10.5px;color:var(--pm);line-height:1.6}
.bt-pop-stat-l b{color:var(--acc-light)}
.bt-pop-stat-w{margin-top:3px;font-size:9.5px;color:var(--td-strong);line-height:1.6;
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-stat[data-impl="todo"]{border-color:rgba(255,120,120,.40)}
.bt-pop-stat[data-impl="undef"]{border-color:rgba(180,160,255,.45)}
.bt-pop-stat[data-impl="partial"]{border-color:rgba(255,180,110,.40)}
.bt-pop-foot{flex:0 0 auto}
.bt-atk-count{flex:1 1 auto;min-width:0;font-size:10.5px;font-weight:700;color:var(--acc-light);
  word-break:break-word;overflow-wrap:anywhere}
.bt-ag-body .bt-empty{padding:6px 0 2px}
/* 通用动作：只显示名称，区高度受限（点开才出说明） */
.bt-gen-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;
  max-height:104px;overflow-y:auto;align-content:start;
  border:1px solid rgba(90,180,255,.12);border-radius:9px;padding:6px}
button.bt-gen-chip{min-height:40px;padding:4px 6px;border:1px solid rgba(90,180,255,.24);
  border-radius:7px;background:rgba(79,193,255,.05);font-family:inherit;
  font-size:11px;color:var(--acc-light);cursor:pointer;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
button.bt-gen-chip:active{background:rgba(79,193,255,.22)}

/* ---- 动作详情弹层 ---- */
.bt-pop{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;
  padding:14px;background:rgba(6,12,20,.66)}
.bt-pop-card{width:100%;max-width:430px;max-height:88vh;display:flex;flex-direction:column;
  border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);
  box-shadow:0 18px 46px rgba(0,0,0,.5)}
.bt-pop-head{display:flex;align-items:flex-start;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line)}
.bt-pop-t{flex:1 1 auto;min-width:0;font-size:14px;font-weight:800;color:var(--acc-light);
  word-break:break-word;overflow-wrap:anywhere}
button.bt-pop-x{flex:0 0 auto;width:40px;height:40px;border:1px solid var(--line);border-radius:8px;
  background:rgba(79,193,255,.06);color:var(--pm);font-size:13px;cursor:pointer}
.bt-pop-meta{padding:6px 12px 0;font-size:10px;color:var(--td-strong);line-height:1.6;
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-body{padding:6px 12px 10px;font-size:12px;color:var(--pm);line-height:1.8;
  white-space:pre-wrap;overflow-y:auto;word-break:break-word;overflow-wrap:anywhere}
.bt-pop-roll{padding:0 12px}
.bt-pop-roll:empty{display:none}
.bt-pop-big{display:inline-block;font-size:24px;font-weight:800;color:var(--acc-light);
  font-variant-numeric:tabular-nums;margin-right:8px}
.bt-pop-note{font-size:11px;color:var(--pm)}
.bt-pop-break{display:block;margin-top:2px;font-size:10px;color:var(--td-strong);
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-dice{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px 12px}
.bt-pop-dice.is-empty{font-size:10px;color:var(--td-strong)}
.bt-rollbtn.primary{border-color:var(--acc);background:rgba(79,193,255,.22);color:var(--acc-light);font-weight:800}

/* ---- #10 职业资源槽 / 组合技 ---- */
.bt-sub-t{padding:9px 12px 4px;font-size:11px;font-weight:800;color:var(--td-strong);letter-spacing:.4px}
.bt-sub-t small{font-weight:400;color:var(--td-strong)}
.bt-cres-rows,.bt-cres-infos{display:flex;flex-direction:column}
.bt-cres-row{display:flex;align-items:center;gap:6px;padding:7px 12px;
  border-top:1px solid rgba(90,180,255,.08);flex-wrap:wrap}
.bt-cres-row:first-child{border-top:none}
.bt-cres-name{flex:1 1 96px;min-width:0;font-size:12px;font-weight:700;color:var(--parchment);
  word-break:break-word;overflow-wrap:anywhere}
.bt-cres-cur{color:var(--acc-light);font-size:18px;font-weight:800;font-variant-numeric:tabular-nums}
.bt-cres-max{width:46px;min-height:40px;padding:4px 2px;text-align:center;border:1px solid rgba(90,180,255,.3);
  border-radius:6px;background:rgba(79,193,255,.08);color:var(--acc-light);font-size:13px;font-family:var(--font)}
.bt-cres-max:focus{outline:none;border-color:var(--acc)}
.bt-cres-raw{flex:1 1 100%;font-style:normal;font-size:9px;color:var(--td-strong);line-height:1.5;
  word-break:break-word;overflow-wrap:anywhere}
.bt-cres-info{display:flex;align-items:center;gap:8px;padding:5px 12px;font-size:11px;color:var(--td-strong)}
.bt-cres-info .bt-cres-name{flex:1 1 auto;font-weight:400;color:var(--td-strong)}
.bt-cres-info-v{flex:0 0 auto;font-size:12px;font-weight:800;color:var(--acc-light)}
.bt-combos{display:flex;flex-direction:column;gap:6px;padding:8px 12px 4px}
.bt-combo{display:flex;flex-direction:column;gap:3px}
button.bt-combo-btn{width:100%;min-height:40px;display:flex;align-items:center;padding:7px 10px;border:1px solid var(--acc-dark);
  border-radius:9px;background:rgba(79,193,255,.10);font-family:inherit;font-size:12px;
  font-weight:700;color:var(--acc-light);cursor:pointer;text-align:left;
  word-break:break-word;overflow-wrap:anywhere}
button.bt-combo-btn:active{background:rgba(79,193,255,.3)}
button.bt-combo-btn:disabled{opacity:.45;cursor:not-allowed;color:var(--td-strong);border-color:var(--line)}
.bt-combo-why{font-size:9px;color:#ffb4b4;line-height:1.5;word-break:break-word;overflow-wrap:anywhere}
.bt-combo-extra{font-size:9px;color:var(--td-strong);line-height:1.5}

/* ---- #14 召唤物面板 ---- */
.bt-pet-tabs{display:flex;gap:5px;overflow-x:auto;padding:8px 12px 0}
button.bt-pet-tab{flex:0 0 auto;display:inline-flex;align-items:center;min-height:40px;padding:5px 9px;border:1px solid var(--line);
  border-radius:8px;background:rgba(79,193,255,.05);font-family:inherit;font-size:11px;
  color:var(--pm);cursor:pointer;white-space:nowrap}
button.bt-pet-tab.is-on{border-color:var(--acc);background:rgba(79,193,255,.2);color:var(--acc-light);font-weight:800}
.bt-pet-body{display:flex;flex-direction:column;gap:7px;padding:9px 12px 12px}
.bt-pet-hp{display:flex;align-items:center;gap:8px}
.bt-pet-hp-main{flex:1 1 auto;min-width:0}
.bt-pet-hp-num{text-align:center;color:var(--acc-light);font-variant-numeric:tabular-nums}
.bt-pet-hp-num b{font-size:22px;font-weight:800}
.bt-pet-hp-num .bt-slash{color:var(--td);margin:0 3px}
.bt-pet-hp-formula{font-size:9px;color:var(--td-strong);line-height:1.5;text-align:center;
  word-break:break-word;overflow-wrap:anywhere}
.bt-pet-gone{padding:7px 9px;border:1px solid rgba(255,120,120,.4);border-radius:8px;
  background:rgba(255,120,120,.10);font-size:11px;color:#ffb4b4;line-height:1.6}
.bt-pet-facts{display:flex;flex-direction:column;gap:3px}
.bt-pet-fact{display:flex;gap:8px;font-size:11px;line-height:1.6}
.bt-pet-fact .k{flex:0 0 46px;color:var(--td-strong)}
.bt-pet-fact .v{flex:1 1 auto;min-width:0;color:var(--pm);word-break:break-word;overflow-wrap:anywhere}
.bt-pet-line{font-size:11px;color:var(--pm);line-height:1.7;
  word-break:break-word;overflow-wrap:anywhere}
.bt-pet-line b{color:var(--acc-light)}

/* ---- #15 机工储法物品 ---- */
.bt-mach-meta{display:flex;flex-wrap:wrap;gap:10px;padding:8px 12px 2px;font-size:11px;color:var(--td-strong)}
.bt-mach-meta b{color:var(--acc-light);font-size:13px;font-variant-numeric:tabular-nums}
.bt-mach-rows{display:flex;flex-direction:column}
.bt-mach-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 12px;
  border-top:1px solid rgba(90,180,255,.08)}
.bt-mach-row:first-child{border-top:none}
.bt-mach-main{flex:1 1 120px;min-width:0;display:flex;flex-direction:column;gap:1px}
.bt-mach-spell{font-size:12px;font-weight:700;color:var(--parchment);
  word-break:break-word;overflow-wrap:anywhere}
/* 行主信息改为三段：物品名（玩家输入）/ 注入方式 / 储存法术 */
.bt-mach-item{font-size:12px;font-weight:800;color:var(--acc-light);
  word-break:break-word;overflow-wrap:anywhere}
.bt-mach-sub{font-size:10px;line-height:1.5;color:var(--td-strong);
  word-break:break-word;overflow-wrap:anywhere}
.bt-mach-sub b{font-weight:600;color:var(--parchment)}
.bt-mach-dc{flex:0 0 auto;font-size:11px;color:var(--acc-light);font-variant-numeric:tabular-nums}
.bt-mach-ok{flex:0 0 auto;font-size:10px;color:var(--td-strong);font-variant-numeric:tabular-nums}
.bt-mach-mode{font-style:normal;font-size:9px;color:var(--td-strong)}
.bt-mach-uses{flex:0 0 auto;font-size:11px;color:var(--acc-light);font-variant-numeric:tabular-nums}
.bt-mach-broken{flex:1 1 100%;font-size:10px;color:#ffb4b4;line-height:1.5}
.bt-mach-form{display:flex;flex-wrap:wrap;gap:6px;padding:9px 12px 4px}
.bt-mach-sel{flex:1 1 130px;min-width:0;min-height:40px;padding:6px 8px;border:1px solid var(--line);
  border-radius:8px;background:rgba(79,193,255,.06);color:var(--parchment);
  font-family:var(--font);font-size:12px}
.bt-mach-sel:focus{outline:none;border-color:var(--acc)}
button.bt-mini{flex:0 0 auto;display:inline-flex;align-items:center;min-height:40px;padding:4px 9px;border:1px solid var(--line);
  border-radius:7px;background:rgba(79,193,255,.06);font-family:inherit;font-size:11px;
  color:var(--pm);cursor:pointer}
button.bt-mini:active{background:rgba(79,193,255,.2)}

/* ---- #17 忍者忍术投掷 ---- */
.bt-nin-map{display:flex;flex-direction:column;gap:3px;padding:8px 12px 2px}
.bt-nin-maprow{display:flex;gap:6px;align-items:baseline;font-size:10px;color:var(--td-strong)}
.bt-nin-maprow b{flex:0 0 26px;color:var(--acc)}
.bt-nin-maprow span{display:flex;flex-wrap:wrap;gap:5px;min-width:0}
.bt-nin-maprow i{font-style:normal;border:1px solid rgba(90,180,255,.22);border-radius:6px;
  padding:0 5px;background:rgba(79,193,255,.05);color:var(--pm)}
.bt-nin-mapnote{padding:4px 0 2px;font-size:9px;color:var(--td-strong);line-height:1.6}
.bt-nin-build{display:flex;flex-direction:column;gap:6px;padding:8px 12px 2px}
.bt-nin-seals{display:flex;flex-wrap:wrap;gap:6px}
button.bt-nin-sealbtn{display:inline-flex;align-items:center;min-height:40px;padding:5px 10px;border:1px solid var(--acc-dark);border-radius:8px;
  background:rgba(79,193,255,.10);font-family:inherit;font-size:11px;color:var(--acc-light);cursor:pointer}
button.bt-nin-sealbtn:active{background:rgba(79,193,255,.3)}
.bt-nin-seq{display:flex;gap:6px}
.bt-nin-slot{flex:1 1 0;min-width:0;text-align:center;padding:5px 4px;border:1px dashed rgba(90,180,255,.3);
  border-radius:8px;font-size:11px;color:var(--td-strong)}
.bt-nin-slot.is-on{border-style:solid;border-color:var(--acc);background:rgba(79,193,255,.16);
  color:var(--acc-light);font-weight:800}
.bt-nin-chips{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px 2px}
button.bt-nin-chip{flex:1 1 128px;min-width:0;display:flex;flex-direction:column;gap:1px;
  min-height:40px;justify-content:center;padding:5px 8px;border:1px solid var(--line);border-radius:8px;
  background:rgba(79,193,255,.05);font-family:inherit;font-size:11px;color:var(--parchment);
  cursor:pointer;text-align:left}
button.bt-nin-chip:active{background:rgba(79,193,255,.2)}
.bt-nin-chip em{font-style:normal;font-size:9px;color:var(--td-strong);min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-nin-note{padding:6px 12px 0;font-size:10px;color:var(--acc-light);line-height:1.6;
  word-break:break-word;overflow-wrap:anywhere}
.bt-nin-result{margin:8px 12px 12px;padding:9px 10px;border:1px solid rgba(79,193,255,.35);
  border-radius:10px;background:rgba(79,193,255,.06);display:flex;flex-direction:column;gap:6px}
.bt-nin-result.is-empty{border-style:dashed;border-color:var(--line);background:none}
.bt-nin-r-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.bt-nin-r-head b{font-size:14px;font-weight:800;color:var(--acc-light)}
.bt-nin-ring{font-size:10px;color:var(--td-strong)}
.bt-nin-ring b{font-size:12px;color:var(--parchment)}
.bt-nin-req{font-size:10px;color:var(--acc);word-break:break-word;overflow-wrap:anywhere}
.bt-nin-text{font-size:12px;color:var(--pm);line-height:1.8;white-space:pre-wrap;
  max-height:34vh;overflow-y:auto;word-break:break-word;overflow-wrap:anywhere}
.bt-nin-dice{display:flex;flex-wrap:wrap;gap:6px}
.bt-nin-result .bt-empty{padding:2px 0}

/* 430 宽（窄屏）：单列 + 禁止横向溢出 */
@media (max-width:430px){
  .bt-gen-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bt-cres-name{flex:1 1 84px}
  .bt-mach-main{flex:1 1 100%}
  .bt-nin-chip{flex:1 1 100%}
  .bt-pop{padding:8px}
}
html[data-theme="light"] .bt-pop-card,
html[data-theme="light"] .bt-cres-max,
html[data-theme="light"] .bt-mach-sel{background:#fff}
html[data-theme="light"] .bt-pop{background:rgba(20,32,46,.42)}

/* =====================================================================
 * #6 DM 端商店工具面板（js/dm.js · window.DmShop / DmUI 商店工具）
 * 固定覆盖层 inset:0（含块为视口，不受 .dm-view min-width:900px 影响）：
 * 430 窄屏与 900+ 横屏均不产生横向溢出；z-index 5 处于 #dmView 层叠上下文内，
 * 低于 .toast(80) 与 .dm-libover(370) → 面板打开时 toast 仍可见。
 * 命名：.dms 面板 / .dms-wrap 内层 / .dms-row 条目行 / .dms-fld 行内输入框 / .dms-f 表单字段。
 * ===================================================================== */
.dms{position:fixed;inset:0;z-index:5;background:rgba(2,6,12,.95);overflow-y:auto;
  padding:10px 12px calc(20px + var(--safe-b));-webkit-overflow-scrolling:touch}
.dms-wrap{width:100%;max-width:1180px;margin:0 auto;display:flex;flex-direction:column;gap:8px;min-width:0}
.dms-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:9px 12px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:linear-gradient(90deg,#0d2136,#081624);min-width:0}
.dms-head b{font-size:15px;font-weight:800;color:var(--acc-light);letter-spacing:.5px}
.dms-head small{flex:1 1 240px;min-width:0;font-size:10.5px;color:var(--td-strong);line-height:1.6}
.dms-x{flex:0 0 auto;margin-left:auto}
.dms-sum{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;padding:8px 12px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:rgba(79,193,255,.05);font-size:12px;color:var(--pm);min-width:0}
.dms-sum b{color:var(--acc-light);font-weight:800}
.dms-sum span{white-space:nowrap}
.dms-sum em{flex:1 1 100%;font-style:normal;font-size:10px;color:var(--td-strong);line-height:1.6;word-break:break-word}
.dms-sum b.dms-off{color:#ffb0a8}
.dms-sum b.dms-pr{color:#ffd79a}
.dms-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;min-width:0}
.dms .dms-search{flex:1 1 200px;width:auto;min-width:0;max-width:none}
.dms-reset{flex:0 0 auto;border-color:rgba(255,122,110,.4);color:#ffb0a8;background:rgba(255,122,110,.08)}
.dms-reset.is-armed{border-color:var(--danger);color:#02111f;background:linear-gradient(180deg,#ffb0a8,#ff7a6e);font-weight:800}
.dms-cats{display:flex;flex-wrap:wrap;gap:5px;min-width:0}
button.dms-chip{display:inline-flex;align-items:center;min-height:40px;padding:5px 9px;border:1px solid var(--line);border-radius:20px;font-family:inherit;font-size:11px;
  color:var(--pm);background:rgba(79,193,255,.06);white-space:nowrap;cursor:pointer}
button.dms-chip:active{background:rgba(79,193,255,.22)}
button.dms-chip.is-on{color:#02111f;font-weight:800;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}
.dms-rows{display:flex;flex-direction:column;gap:5px;min-width:0}
.dms-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:6px 8px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:linear-gradient(180deg,#0b1c2e,#081624);min-width:0}
.dms-row.is-off{border-style:dashed;opacity:.66}
.dms-row.is-custom{border-color:rgba(255,215,154,.45)}
.dms-row.is-new{border-color:var(--acc);box-shadow:0 0 12px var(--acc-glow)}
.dms-name{flex:1 1 200px;min-width:0;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.dms-name b{font-size:13px;font-weight:700;color:var(--parchment);overflow-wrap:anywhere}
.dms-name em{font-style:normal;font-size:10px;color:var(--td-strong);overflow-wrap:anywhere}
.dms-name .dms-sub{flex:1 1 100%;font-size:10px;color:var(--td-strong);line-height:1.5;overflow-wrap:anywhere}
.dms-tag{font-style:normal;font-size:9.5px;font-weight:700;color:#ffd79a;border:1px solid rgba(255,215,154,.4);
  border-radius:4px;padding:0 4px}
.dms-tag.on{color:var(--acc-light);border-color:var(--line)}
.dms-price{flex:0 0 auto;display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--pm);white-space:nowrap}
.dms-price .dms-old{color:var(--td-strong)}
.dms-price .dms-arrow{font-style:normal;color:var(--td-strong)}
.dms-price .dms-new{color:var(--pm)}
.dms-price .dms-new.on{color:#ff9c92;font-weight:800}
.dms-state{flex:0 0 auto;font-size:10px;font-weight:700;color:var(--ok);border:1px solid rgba(127,224,168,.35);
  border-radius:4px;padding:1px 5px;white-space:nowrap}
.dms-state.off{color:#ffb0a8;border-color:rgba(255,122,110,.4);background:rgba(255,122,110,.08)}
.dms-fld{flex:1 1 110px;min-width:0;min-height:40px;padding:5px 7px;border:1px solid var(--line);border-radius:7px;background:#050d18;
  color:var(--parchment);font-family:inherit;font-size:11.5px}
.dms-fld:focus{outline:none;border-color:var(--acc)}
.dms-fld::placeholder{color:#5d7d9d}
button.dms-mini{flex:0 0 auto;display:inline-flex;align-items:center;min-height:40px;padding:5px 8px;border:1px solid var(--line);border-radius:7px;font-family:inherit;
  font-size:11px;font-weight:700;color:var(--acc-light);background:rgba(79,193,255,.08);white-space:nowrap;cursor:pointer}
button.dms-mini:active{background:rgba(79,193,255,.24)}
button.dms-mini.on{color:#ffb0a8;border-color:rgba(255,122,110,.45);background:rgba(255,122,110,.1)}
button.dms-mini.danger{color:#ffb0a8;border-color:rgba(255,122,110,.35)}
.dms-empty{padding:14px 10px;text-align:center;font-size:12px;color:var(--td-strong);line-height:1.7;
  border:1px dashed var(--line);border-radius:var(--radius-md)}
.dms-add{border:1px solid var(--line);border-radius:var(--radius-md);padding:10px 12px;
  background:linear-gradient(180deg,#0b1c2e,#081624);min-width:0}
.dms-add-h{font-size:12.5px;font-weight:800;color:var(--acc-light);margin-bottom:8px}
.dms-add-h small{font-size:10px;font-weight:400;color:var(--td-strong);margin-left:6px}
.dms-add-grid{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;min-width:0}
.dms-f{flex:1 1 150px;min-width:0;display:flex;flex-direction:column;gap:3px}
.dms-f.wide{flex:1 1 240px}
.dms-f>span{font-size:10px;color:var(--td-strong)}
.dms-f input,.dms-f select{width:100%;min-width:0;min-height:40px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;
  background:#050d18;color:var(--parchment);font-family:inherit;font-size:12px}
.dms-f input:focus,.dms-f select:focus{outline:none;border-color:var(--acc)}
.dms-addbtn{flex:0 0 auto;min-height:40px}
.dms-note{margin-top:8px;font-size:10px;color:var(--td-strong);line-height:1.7;word-break:break-word}
.dms-note b{color:var(--acc-light)}
/* 430 窄屏：条目行与表单字段单列铺开（面板自身仍无横向溢出） */
@media (max-width:560px){
  .dms{padding:8px 8px calc(16px + var(--safe-b))}
  .dms-name,.dms-price,.dms-fld,.dms-f,.dms-f.wide{flex:1 1 100%}
  .dms-x{margin-left:0}
  button.dms-mini{flex:1 1 110px}
}

/* ================================================================
 * #11 分区折叠（window.UICollapse，js/more.js）
 *   全站统一：角色 / 战斗 / 背包 / 法术 / 休息 / 更多 / 图鉴 内的分区卡片
 *   标题行可点 → 展开收起内容；折叠态「▸」、展开态「▾」；
 *   标题行点击目标 min-height:40px（audit-ui 的 error 阈值 24px、warn 阈值 40px，均达标）。
 * ================================================================ */
.csec-h{display:flex;align-items:center;gap:6px;min-height:40px;cursor:pointer;
  user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.csec-h::before{content:'▾';flex:0 0 auto;font-size:9px;line-height:1;color:var(--acc);opacity:.95}
.csec.is-collapsed > .csec-h::before{content:'▸'}
.csec-h:active{background:rgba(79,193,255,.08)}
.csec-h:focus-visible{outline:1px solid var(--acc);outline-offset:-1px}
/* 折叠 = 隐藏除标题行以外的全部直接子元素（显式分区用 .mo-csec-body/.csec-body 包一层） */
.csec.is-collapsed > :not(.csec-h){display:none !important}
/* 更多页 .group-head（存档 / 最近记录）：保持左侧标题、右侧计数顶到行尾 */
.group-head.csec-h{justify-content:flex-start}
.group-head.csec-h > :last-child{margin-left:auto}
/* 更多页菜单分组（运行时把 .mg-lab 与其后兄弟包进 .mg-grp） */
.mg-grp{border-top:1px solid rgba(90,180,255,.10)}
.mg-lab.csec-h{min-height:40px;margin:0;padding:0 12px;font-size:11px}
/* 图鉴四个子页的可折叠「速查」分区 */
.mo-csec{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-card);overflow:hidden}
.mo-csec > .csec-h{border-bottom:1px solid rgba(90,180,255,.14)}
.mo-csec-body{padding:2px 10px 10px}

/* ================================================================
 * #8 / #9 准备制职业（法表全掌握 · 战前准备）
 *   施法信息卡内的准备状态行 + 法术库卡片的「准备」按钮排 + 已准备法术子页
 * ================================================================ */
.sp-prepnote{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 12px 10px;
  padding:7px 9px;font-size:11px;line-height:1.5;color:var(--pm);border-radius:6px;
  border:1px solid rgba(79,193,255,.28);background:linear-gradient(90deg,rgba(79,193,255,.12),rgba(79,193,255,.02))}
.sp-prepnote b{color:var(--acc-light);font-size:13px}
.sp-prepnote .sp-prepform{font-size:10px;color:var(--td-strong)}
.sp-prepnote.is-bind{border-color:rgba(255,190,120,.35);background:linear-gradient(90deg,rgba(255,190,120,.12),rgba(255,190,120,.02))}
.sp-prepnote.is-over{border-color:rgba(255,120,120,.5);background:linear-gradient(90deg,rgba(255,120,120,.14),rgba(255,120,120,.02))}
/* 法术库卡片的操作排（仅在「本职业法表」范围 / 关键字命中表内法术时出现） */
.sp-card-box{border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--line);background:var(--bg-card)}
.sp-card-box > .sp-card{border:none;border-radius:0;background:transparent}
.sp-card-box > .sp-acts{padding:6px 10px 9px;border-top:1px solid rgba(90,180,255,.10)}
/* 范围 chip 行 */
.sp-scoperow{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:2px 0 6px}
.sp-scoperow .sp-flab{font-size:10px;color:var(--td-strong);flex:0 0 auto}
.sp-scopenote{font-size:10px;color:var(--td-strong);padding:0 2px 6px;line-height:1.5}
/* 已准备法术子页 */
.sp-prep-empty{margin:8px 0}
.sp-prep-sum{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sp-prep-sum b{font-size:15px}
.sp-seg .sp-seg-n{font-style:normal;font-size:10px;font-weight:800;color:var(--acc-light);
  border:1px solid rgba(79,193,255,.35);border-radius:8px;padding:0 4px;margin-left:2px}

/* =====================================================================
 * ISSUE-012（js/spells.js）追加块 —— 按职业施法模型重建「我的法术 / 已准备法术 / 施放面板」
 *   §1/§2 恒定准备与已掌握戏法：自动条目卡（.sp-card.auto，刻意不用 .sp-card.mine）
 *   §3    计数分流：.sp-autocount（不占位：恒定准备 N · 戏法 M）
 *   §8    魔法体系标签：.sp-tag.sis-black / .sis-white / .sis-both / .sis-none
 *   §6/§7 完整施放面板：.sp-cp-*（升环 chip 沿用 .sp-chip，保证 ≥40px 点击目标）
 * ===================================================================== */
/* ---- §3 计数分流（施法信息准备行 + 已准备子页摘要共用） ---- */
.sp-autocount{font-size:11px;color:#ffd8a8;border:1px solid rgba(255,190,120,.4);border-radius:10px;
  padding:1px 7px;white-space:nowrap;line-height:1.5}
.sp-autocount b{color:#ffe6c0;font-size:12px}
/* ---- §1/§2/§5 自动条目（恒定准备 / 已掌握戏法 / 法表掌握型自动掌握） ---- */
.sp-autogroup{margin-top:10px}
.sp-autohead{font-size:11px;color:var(--pm);line-height:1.6;padding:6px 2px 6px;
  border-top:1px dashed rgba(90,180,255,.18)}
.sp-card.auto{border-color:rgba(255,190,120,.28);background:linear-gradient(180deg,rgba(255,190,120,.05),rgba(0,0,0,0))}
.sp-card.auto .sp-main{width:100%;text-align:left;display:flex;flex-direction:column;gap:3px;padding:10px 12px 6px;
  color:inherit;background:transparent;border:none}
.sp-card.auto .sp-acts{align-items:center;gap:8px}
.sp-card.auto .sp-btn{flex:0 0 auto;min-width:88px}
.sp-auto-note{flex:1 1 auto;font-size:10px;color:var(--td-strong);line-height:1.5}
.sp-tag.auto{color:#ffd8a8;border-color:rgba(255,190,120,.55);background:rgba(255,190,120,.10)}
.sp-tag.noprep{color:#9aa4ae;border-color:rgba(154,164,174,.45)}
.sp-btn.act[disabled]{opacity:.45}
/* ---- §4 学习型：施法模型说明行 ---- */
.sp-modelrow{font-size:11px;color:var(--pm);line-height:1.7;padding:0 12px 10px}
.sp-modelrow b{color:var(--acc-light)}
.sp-modelsrc{display:block;font-size:10px;color:var(--td-strong);margin-top:2px;word-break:break-word}
/* ---- §4 学习型：学习名额与可学范围 ---- */
.sp-learnplan{font-size:11px;color:var(--pm);line-height:1.7;margin:0 12px 10px;padding:7px 9px;
  border:1px solid rgba(79,193,255,.16);border-radius:8px;
  background:linear-gradient(90deg,rgba(79,193,255,.07),rgba(79,193,255,.01));word-break:break-word}
.sp-learnplan b{color:var(--acc-light)}
/* ---- §8 魔法体系标签（与 5e 学派标签分色） ---- */
.sp-tag.sis-black{color:#cbb6ff;border-color:rgba(180,150,255,.5);background:rgba(150,120,255,.10)}
.sp-tag.sis-white{color:#a9e8ff;border-color:rgba(120,210,255,.5);background:rgba(90,190,255,.10)}
.sp-tag.sis-both{color:#ffd8a8;border-color:rgba(255,190,120,.5);background:rgba(255,190,120,.08)}
.sp-tag.sis-none{color:#9aa4ae;border-color:rgba(154,164,174,.4)}
.sp-pchip.sis{color:#cbb6ff;border-color:rgba(180,150,255,.45)}
.sp-pchip.sis.none{color:#9aa4ae;border-color:rgba(154,164,174,.4)}
.sp-pchip.auto{color:#ffd8a8;border-color:rgba(255,190,120,.5)}
.sp-cpsrc{font-size:10px;color:var(--td-strong);word-break:break-word}
/* ---- §6/§7 完整施放面板 ---- */
.sp-cp-upcast{border:1px solid rgba(90,180,255,.16);border-radius:8px;padding:8px 10px;margin:2px 0 9px;
  background:linear-gradient(90deg,rgba(79,193,255,.07),rgba(79,193,255,.01))}
.sp-cp-uph{font-size:11px;font-weight:700;color:var(--acc-light);margin-bottom:6px}
.sp-cp-uph em{font-style:normal;font-size:10px;color:var(--td-strong);margin-left:4px}
.sp-cp-rings{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:6px}
.sp-chip-n{font-style:normal;font-size:9px;color:var(--td-strong);margin-left:5px}
.sp-chip.is-on .sp-chip-n{color:#02111f}
.sp-cp-note{font-size:10px;color:var(--td-strong);line-height:1.6;margin-bottom:4px}
.sp-cp-delta{margin:4px 0}
.sp-cp-dline{font-size:11px;color:var(--parchment);line-height:1.7}
.sp-cp-verbatim{font-size:11px;color:var(--pm);line-height:1.7;margin:4px 0 6px;word-break:break-word}
.sp-pop-body[data-role="castpanel"] .sp-fields{margin-bottom:9px}
.sp-pop-body[data-role="castpanel"] .sp-field .v{word-break:break-word}
.sp-pop-body[data-role="castpanel"] .sp-pop-full .sp-pop-bodytxt{max-height:40vh}
.sp-pop .sp-auto-note{margin-bottom:6px}

/* =====================================================================
 * 战斗页调整（需求 1/3/5/6 · js/battle.js）—— 追加块，全部沿用 .bt-* 命名空间
 *   需求 1：自定义资源槽「＋ 添加 / 删除」（默认 0 个）
 *   需求 3：召唤物前置（掠影示现 → 英雄的掠影）·「原文未给出」HP 文案
 *   需求 5：动作池详情弹层（英文名 / 消耗·范围 / 检定卡 / 规则要点 / 使用按钮）
 *   需求 6：副手攻击 RULE LOCK · 常驻准备法术分组 · 自定义伙伴分区
 * 追加在文件末尾 → 同名属性覆盖既有 .bt-* 规则（不改动上方既有声明）。
 * ===================================================================== */

/* ---- 需求 1：自定义资源槽增 / 删 ---- */
.bt-res-del{flex:0 0 auto;width:40px;height:40px;border:1px solid rgba(255,120,120,.35);
  border-radius:7px;background:rgba(255,120,120,.08);color:#ffb4b4;font-family:inherit;
  font-size:11px;line-height:1;cursor:pointer}
.bt-res-del:active{background:rgba(255,120,120,.24)}
.bt-res-add-row{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px 10px}
button.bt-res-add{border-color:rgba(79,193,255,.45);color:var(--acc-light);font-weight:700;
  background:rgba(79,193,255,.10);min-height:40px}
.bt-res-card .bt-empty{padding:6px 12px 2px}

/* ---- 需求 5：通用动作合并栏（1 个可折叠行 + 展开后的长清单） ---- */
.bt-gen{display:flex;flex-direction:column;border:1px solid rgba(90,180,255,.14);
  border-radius:9px;overflow:hidden}
button.bt-gen-fold{display:flex;align-items:center;gap:6px;width:100%;min-height:40px;padding:8px 10px;
  border:none;background:rgba(79,193,255,.06);font-family:inherit;font-size:12px;font-weight:800;
  color:var(--acc);text-align:left;cursor:pointer}
button.bt-gen-fold:active{background:rgba(79,193,255,.16)}
.bt-gen-fold-t{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-gen-fold-hint{flex:0 0 auto;font-style:normal;font-size:9px;font-weight:400;color:var(--td-strong)}
.bt-gen-fold-n{flex:0 0 auto;font-size:10px;font-weight:800;color:var(--acc-light);
  border:1px solid rgba(79,193,255,.35);border-radius:9px;padding:0 6px;line-height:15px}
.bt-gen-fold-c{flex:0 0 auto;font-style:normal;font-size:10px;color:var(--td-strong)}
.bt-gen-list{display:flex;flex-direction:column;gap:4px;grid-template-columns:none;
  max-height:52vh;overflow-y:auto;align-content:initial;border:none;border-radius:0;
  border-top:1px solid rgba(90,180,255,.12);padding:6px 8px 8px;-webkit-overflow-scrolling:touch}
.bt-gen-list.is-folded{max-height:0;padding-top:0;padding-bottom:0;border-top-width:0;
  overflow:hidden;visibility:hidden}
button.bt-gen-chip{display:grid;grid-template-columns:auto 1fr;gap:1px 6px;align-items:baseline;align-content:center;
  width:100%;min-height:40px;padding:5px 8px;border:1px solid rgba(90,180,255,.20);border-radius:7px;
  background:rgba(79,193,255,.05);font-family:inherit;font-size:11px;color:var(--parchment);
  cursor:pointer;text-align:left;white-space:normal;overflow:visible}
button.bt-gen-chip:active{background:rgba(79,193,255,.20)}
.bt-gen-n{grid-column:1;font-size:11.5px;font-weight:700;color:var(--parchment);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bt-gen-en{grid-column:1;font-style:normal;font-size:8.5px;color:var(--td-strong);letter-spacing:.4px}
.bt-gen-d{grid-column:2;grid-row:1 / span 2;font-size:10px;color:var(--pm);line-height:1.5;
  word-break:break-word;overflow-wrap:anywhere}

/* ---- 需求 6：常驻准备法术分组（附赠动作池内） ---- */
.bt-always{margin-top:6px;padding-top:6px;border-top:1px dashed rgba(90,180,255,.20)}
.bt-always-t{padding:2px 0 5px;font-size:11px;font-weight:800;color:var(--acc-light);letter-spacing:.3px}
.bt-always-t small{font-weight:400;color:var(--td-strong);letter-spacing:0}

/* ---- 锁定态动作条目 ---- */
button.bt-act.is-locked{border-color:rgba(255,120,120,.45);background:rgba(255,120,120,.07)}
/* 文字色改用主题令牌：原先硬编码 #ffb4b4 仅适配深色，
 * 浅色主题下对比度只有 1.58（< 3.0，tools/audit-ui.mjs 实测）；
 * var(--danger) 深色 #ff7a6e / 浅色 #c0392b，两种主题均达标。 */
button.bt-act.is-locked .bt-act-s{color:var(--danger)}

/* ---- 需求 5：详情弹层新结构（标题 + 英文名 / 消耗·范围 / 检定卡 / 规则要点 / 使用） ---- */
.bt-pop-ttl{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.bt-pop-en{font-style:normal;font-size:9.5px;color:var(--td-strong);letter-spacing:.6px;
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-cost{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:8px 12px 2px}
.bt-pop-cost .k{display:block;font-size:9px;color:var(--td-strong);letter-spacing:.4px}
.bt-pop-cost .v{display:block;font-size:12px;font-weight:700;color:var(--parchment);
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-c1,.bt-pop-c2{border:1px solid var(--line);border-radius:8px;padding:5px 8px;
  background:rgba(79,193,255,.05);min-width:0}
.bt-pop-tnote{padding:6px 12px 0;font-size:10px;color:var(--acc-light);line-height:1.6;
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-check{margin:2px 12px 6px;padding:8px 10px;border:1px solid rgba(255,120,120,.30);
  border-radius:9px;background:rgba(255,120,120,.06)}
.bt-pop-chk-t{font-size:10px;font-weight:800;color:#ffd0a0;letter-spacing:.4px}
.bt-pop-chk-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:3px}
.bt-pop-chk-row b{font-size:16px;font-weight:800;color:var(--acc-light);font-variant-numeric:tabular-nums}
.bt-pop-dmg{font-size:10px;color:var(--pm);border:1px solid rgba(255,120,120,.35);border-radius:7px;
  padding:0 6px;background:rgba(255,120,120,.10)}
.bt-pop-chk-note{font-size:9.5px;color:var(--td-strong);margin-top:3px}
.bt-pop-rules{padding:2px 12px 8px}
.bt-pop-rules-t{font-size:11px;font-weight:800;color:var(--acc);letter-spacing:.4px;padding:6px 0 4px;
  border-top:1px solid rgba(90,180,255,.14)}
ol.bt-pop-rl{margin:0;padding-left:0;list-style:none;counter-reset:btrule}
ol.bt-pop-rl li{counter-increment:btrule;position:relative;padding:3px 0 3px 20px;
  font-size:11px;color:var(--pm);line-height:1.65;word-break:break-word;overflow-wrap:anywhere}
ol.bt-pop-rl li::before{content:counter(btrule);position:absolute;left:0;top:4px;
  width:14px;height:14px;line-height:14px;text-align:center;font-size:9px;font-weight:800;
  color:#04101c;background:linear-gradient(180deg,var(--acc-light, #9fd8ff),var(--acc, #4fc1ff));
  border-radius:4px}
.bt-pop-lock{margin:2px 12px 8px;padding:8px 10px;border:1px solid rgba(255,120,120,.55);
  border-radius:9px;background:rgba(255,120,120,.10)}
.bt-pop-lock-t{display:block;font-size:11px;font-weight:800;color:#ffb4b4;letter-spacing:.4px}
.bt-pop-lock-r{display:block;margin-top:3px;font-size:12px;font-weight:700;color:var(--parchment)}
.bt-pop-lock-f{display:block;margin-top:3px;font-size:10px;color:var(--pm);line-height:1.6;
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-lock-act{margin-top:6px}
.bt-pop-ok{margin:2px 12px 8px;padding:7px 10px;border:1px solid rgba(120,220,160,.45);
  border-radius:9px;background:rgba(120,220,160,.10);font-size:10.5px;color:var(--pm);line-height:1.6;
  display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.bt-pop-foot{display:flex;flex-direction:column;gap:4px;padding:4px 12px 12px}
button.bt-pop-use{width:100%;min-height:44px;border:1px solid var(--acc-dark,rgba(79,193,255,.5));
  border-radius:10px;background:linear-gradient(180deg,rgba(79,193,255,.30),rgba(79,193,255,.14));
  font-family:inherit;font-size:14px;font-weight:800;color:var(--acc-light);cursor:pointer;
  letter-spacing:.5px}
button.bt-pop-use:active{background:rgba(79,193,255,.42)}
button.bt-pop-use.is-disabled,button.bt-pop-use:disabled{opacity:.5;cursor:not-allowed;
  color:var(--td);border-color:var(--line);background:rgba(120,140,160,.10)}
.bt-pop-use-why{font-size:9.5px;color:#ffb4b4;text-align:center;line-height:1.5}
.bt-pop-hp-unk{color:var(--td);font-size:13px;font-weight:700}
.bt-pet-same{font-style:normal;margin-left:6px;font-size:9px;font-weight:700;color:var(--acc-light);
  border:1px solid rgba(79,193,255,.4);border-radius:8px;padding:0 5px;line-height:15px;
  vertical-align:middle;background:rgba(79,193,255,.10)}

/* ---- 需求 3/6：召唤物前置 + 自定义伙伴（与职业召唤物分区） ---- */
.bt-pet-line.is-gate{color:var(--acc-light)}
.bt-petc{display:flex;flex-direction:column;border-top:1px solid rgba(90,180,255,.14);margin-top:4px}
.bt-petc-rows{display:flex;flex-direction:column;gap:6px;padding:0 12px}
.bt-petc-row{display:grid;grid-template-columns:1fr auto;gap:5px 6px;align-items:center;
  padding:7px 9px;border:1px solid rgba(255,214,110,.28);border-radius:9px;
  background:rgba(255,214,110,.06);min-width:0}
.bt-petc-name{min-width:0;min-height:40px;padding:4px 7px;border:1px solid rgba(90,180,255,.28);
  border-radius:7px;background:rgba(79,193,255,.06);color:var(--parchment);
  font-family:var(--font);font-size:12px;font-weight:700}
.bt-petc-hp{display:flex;align-items:center;gap:4px;flex:0 0 auto}
.bt-petc-num{width:52px;min-height:40px;padding:3px 5px;text-align:center;
  border:1px solid rgba(90,180,255,.28);border-radius:7px;background:rgba(79,193,255,.06);
  color:var(--acc-light);font-family:var(--font);font-size:12px;font-variant-numeric:tabular-nums}
.bt-petc-bar{grid-column:1 / -1;height:5px}
.bt-petc-fields{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:6px}
.bt-petc-f{display:flex;align-items:center;gap:4px;min-width:0}
.bt-petc-f span{font-size:9.5px;color:var(--td-strong)}
.bt-petc-f-note{flex:1 1 120px;min-width:0}
.bt-petc-note{flex:1 1 auto;min-width:0;min-height:40px;padding:3px 6px;
  border:1px solid rgba(90,180,255,.22);border-radius:7px;background:rgba(79,193,255,.05);
  color:var(--pm);font-family:var(--font);font-size:11px}
.bt-petc-row > .bt-res-del{grid-column:2;grid-row:1;justify-self:end}
.bt-petc .bt-empty{padding:4px 12px 2px}

@media (max-width:430px){
  .bt-pop-cost{grid-template-columns:1fr 1fr}
  .bt-gen-d{grid-column:1 / -1;grid-row:auto;padding-top:1px}
  button.bt-gen-chip{grid-template-columns:1fr}
  .bt-petc-num{width:46px}
}
html[data-theme="light"] .bt-pop-c1,
html[data-theme="light"] .bt-pop-c2,
html[data-theme="light"] .bt-petc-name,
html[data-theme="light"] .bt-petc-num,
html[data-theme="light"] .bt-petc-note{background:#fff}

/* =====================================================================
 * 第四批（ISSUE-006 · 同级横向长条条目框改为每行两个）
 *   —— 追加块，追加在文件末尾 → 同名属性覆盖上方既有声明（不改动上方既有规则）。
 *
 * 并排（半行宽）只适用于「同层级、内容短、可并排」的条目框：
 *   · .bt-act-list  —— 动作分池条目 + 常驻准备法术条目 + 召唤物动作条目
 *                      （每行 = 名称 + 一行摘要，正文在详情弹层，条目本身不带编辑控件）；
 *   · .bt-cres-infos —— 职业资源的「派生值 / 信息」条（名称 + 数值，无编辑控件）。
 * 保持整行宽（不适合并排，见下方的显式约束注释）：
 *   · .bt-res-row   自定义资源行：名称输入 + 上限输入 + 加减 + 删除（复杂编辑）；
 *   · .bt-cres-row  职业资源池行：上限可直接编辑 + 公式原文（多控件 + 长文本）；
 *   · .bt-mach-row / .bt-petc-row：多字段编辑与长备注；
 *   · .cv-feats .ft-open 特性卡：长说明 + 独立详情弹层。
 * 430px 与 360px 两档均保持两列（条目内容是 nowrap + 省略号 / 可换行名称，不产生横向溢出）；
 * 交互控件高度一律 ≥40px（.u2-sk 技能卡的 32px 豁免不在此列）。
 * ===================================================================== */
.bt-act-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;align-items:stretch}
.bt-act-list > .bt-act{width:100%;min-width:0}
.bt-cres-rows{display:flex;flex-direction:column}
.bt-cres-infos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:6px}
.bt-cres-info{padding:5px 9px}
/* 并排后 .bt-cres-info 的「名称 + 数值」仍各自完整，不做单行截断 */
.bt-cres-info .bt-cres-name{overflow-wrap:anywhere}

/* UI-003：技术说明（开发信息区）里的代码字样不撑破卡片 */
.mo-ver-log code{font-family:var(--font);font-size:11px;color:var(--acc-light);
  word-break:break-word;overflow-wrap:anywhere}

/* =====================================================================
 * 第六批（ISSUE-001 · ISSUE-008 · ISSUE-013 暗黑骑士链路）
 *   ① 掠影示现的使用次数（动作条目摘要 + 详情「使用次数」块）
 *   ② 暗影卫的被动强化说明（明确「不是可执行的附赠动作」）
 *   ③ 掠影的暗血能力结算面板（选 n → 伤害骰 / 生命代价 / 豁免 / 结算）
 *   ④ 至黑之夜的生命值平衡块（项目口径公式 + 执行按钮）
 *   ⑤ 召唤物多实体（15 级起 2 个掠影，各自独立生命值）
 *   交互控件一律 ≥40px（高度与宽度），430 / 360 两档不得横向溢出。
 * ===================================================================== */

/* ---- ① 使用次数（掠影示现：每长休 1 次） ---- */
.bt-pop-use-lim{margin:2px 12px 8px;padding:7px 9px;border:1px solid rgba(255,214,110,.32);
  border-radius:8px;background:rgba(255,214,110,.07);font-size:11px;line-height:1.7;color:var(--pm)}
.bt-pop-use-lim b{color:var(--acc-light)}
.bt-pop-use-lim.is-out{border-color:rgba(255,120,120,.55);background:rgba(255,120,120,.10)}
.bt-pop-use-out{display:block;margin-top:3px;font-size:11px;font-weight:800;color:#ffb4b4}
.bt-pop-use-src{display:block;margin-top:3px;font-size:9px;color:var(--td-strong);
  word-break:break-word;overflow-wrap:anywhere}

/* ---- ② 暗影卫：被动强化（不是可执行动作） ---- */
.bt-pop-pe{margin:2px 12px 8px;padding:7px 9px;border:1px solid rgba(160,120,255,.34);
  border-radius:8px;background:rgba(160,120,255,.08);font-size:11px;line-height:1.7;color:var(--pm)}
.bt-pop-pe-t{font-weight:800;color:#cbb2ff}
.bt-pop-pe-e{margin-top:2px}
.bt-pop-pe-e b{color:var(--acc-light)}
.bt-pop-pe-l{margin-top:2px;color:#ffd68a}
.bt-pop-pe-s{margin-top:3px;font-size:9px;color:var(--td-strong);word-break:break-word;overflow-wrap:anywhere}

/* ---- ③ 掠影的暗血能力结算面板 ---- */
.bt-pop-shadow{margin:2px 12px 8px;padding:7px 9px;border:1px solid rgba(255,110,160,.34);
  border-radius:8px;background:rgba(255,110,160,.07)}
.bt-pop-shadow-t{font-size:11px;font-weight:800;color:#ffb0c8}
.bt-pop-shadow-t small{font-weight:400;color:var(--td-strong)}
.bt-shadow-line{margin-top:3px;font-size:10.5px;line-height:1.7;color:var(--pm);
  word-break:break-word;overflow-wrap:anywhere}
.bt-shadow-line b{color:var(--acc-light)}
.bt-shadow-limit{color:var(--td-strong)}
.bt-shadow-form{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:7px;min-width:0}
.bt-shadow-f{display:flex;align-items:center;gap:4px;min-width:0;flex:1 1 130px}
.bt-shadow-f span{flex:0 0 auto;font-size:9.5px;color:var(--td-strong)}
.bt-shadow-n{flex:0 1 84px;min-width:64px;min-height:40px;padding:3px 6px;text-align:center;
  border:1px solid rgba(90,180,255,.28);border-radius:7px;background:rgba(79,193,255,.06);
  color:var(--acc-light);font-family:var(--font);font-size:13px;font-variant-numeric:tabular-nums}
.bt-shadow-sel{flex:1 1 auto;min-width:0;min-height:40px;padding:4px 6px;border:1px solid rgba(90,180,255,.28);
  border-radius:7px;background:rgba(79,193,255,.06);color:var(--parchment);font-family:var(--font);font-size:11px}
.bt-shadow-go{flex:0 0 auto;min-height:40px;min-width:40px;padding:5px 12px;border:1px solid rgba(255,110,160,.5);
  border-radius:8px;background:rgba(255,110,160,.16);font-family:inherit;font-size:11.5px;font-weight:800;
  color:#ffd0dd;cursor:pointer}
.bt-shadow-go:active{background:rgba(255,110,160,.32)}
.bt-shadow-prev{margin-top:6px;padding:6px 8px;border:1px dashed rgba(90,180,255,.3);border-radius:7px;
  background:rgba(79,193,255,.05)}
.bt-shadow-prev-l{font-size:10.5px;line-height:1.7;color:var(--pm);word-break:break-word;overflow-wrap:anywhere}
.bt-shadow-prev-l b{color:var(--acc-light)}
.bt-shadow-prev-l.is-bad b{color:#ffb4b4}
.bt-shadow-bad{color:#ffb4b4;font-weight:700}
.bt-shadow-save{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.bt-shadow-save .bt-mini.is-on{border-color:var(--acc);background:rgba(79,193,255,.22);
  color:var(--acc-light);font-weight:800}
.bt-shadow-note{margin-top:6px;font-size:10px;line-height:1.6;color:var(--td-strong)}
.bt-shadow-note b{color:#ffd68a}
/* n 不合法（暗血不足 / 无暗血）→ 结算按钮禁用并给出原因，不做「可点但失败」的假可用 */
.bt-shadow-why{margin-top:5px;font-size:10px;line-height:1.6;color:#ffb4b4;font-weight:700;
  word-break:break-word;overflow-wrap:anywhere}
.bt-shadow-why:empty{display:none}
.bt-shadow-go:disabled{opacity:.45;cursor:not-allowed;border-color:var(--line);
  background:rgba(120,140,160,.10);color:var(--td-strong)}

/* ---- ④ 至黑之夜：生命值平衡（项目口径） ---- */
.bt-pop-bal{margin:2px 12px 8px;padding:7px 9px;border:1px solid rgba(120,220,180,.34);
  border-radius:8px;background:rgba(120,220,180,.07)}
.bt-pop-bal-t{font-size:11px;font-weight:800;color:#9fe6c8}
.bt-pop-bal-f{margin-top:3px;font-size:10.5px;line-height:1.7;color:var(--parchment);
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-bal-s{margin-top:3px;font-size:9.5px;line-height:1.7;color:var(--td-strong);
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-bal-s b{color:#ffd68a}
.bt-pop-bal-act{margin-top:6px}
.bt-pop-bal-lock{margin-top:6px;padding:6px 8px;border:1px solid rgba(255,120,120,.5);border-radius:7px;
  background:rgba(255,120,120,.10);font-size:11px;font-weight:700;color:#ffb4b4}

/* ---- ⑤ 召唤物多实体（15 级暗影卫起一次召唤 2 个掠影） ---- */
.bt-pet-ents{display:flex;flex-direction:column;gap:8px}
.bt-pet-hp-multi{padding:6px 7px;border:1px solid rgba(90,180,255,.16);border-radius:9px;
  background:rgba(79,193,255,.05)}
.bt-pet-inst-t{text-align:center;font-size:11px;font-weight:800;color:var(--acc-light);letter-spacing:.5px}

/* ---- ⑥ 掠影实例：每个掠影各自维护本回合攻击状态（用户口径 2026-09-12） ---- */
.bt-echo{margin-top:8px;padding:8px 9px;border:1px solid rgba(190,140,255,.34);border-radius:9px;
  background:rgba(190,140,255,.07)}
.bt-echo-t{font-size:11px;font-weight:800;color:#d9bcff}
.bt-echo-t small{font-weight:400;color:var(--td-strong)}
.bt-echo-rule{margin-top:3px;font-size:9.5px;line-height:1.7;color:#ffd68a;
  word-break:break-word;overflow-wrap:anywhere}
.bt-echo-rows{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.bt-echo-i{padding:6px 7px;border:1px solid rgba(90,180,255,.16);border-radius:9px;background:rgba(79,193,255,.05)}
.bt-echo-i-h{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.bt-echo-i-n{font-size:11.5px;font-weight:800;color:var(--acc-light);letter-spacing:.5px}
.bt-echo-i-t{font-size:9.5px;color:var(--td-strong);font-style:normal}
.bt-echo-st{margin-left:auto;padding:2px 7px;border-radius:999px;font-size:9.5px;font-weight:800;
  border:1px solid rgba(120,220,180,.4);background:rgba(120,220,180,.10);color:#9fe6c8;
  word-break:break-word;overflow-wrap:anywhere}
.bt-echo-st.is-can{border-color:rgba(120,220,180,.5);background:rgba(120,220,180,.14);color:#b6f0d6}
.bt-echo-st.is-used{border-color:rgba(255,180,110,.5);background:rgba(255,180,110,.12);color:#ffd68a}
.bt-echo-atk{display:block;width:100%;min-height:40px;margin-top:6px;padding:6px 10px;
  border:1px solid rgba(190,140,255,.5);border-radius:8px;background:rgba(190,140,255,.16);
  font-family:inherit;font-size:11.5px;font-weight:800;color:#e6d4ff;cursor:pointer}
.bt-echo-atk:active{background:rgba(190,140,255,.3)}
.bt-echo-atk:disabled,.bt-echo-atk.is-disabled{opacity:.45;cursor:not-allowed;border-color:var(--line);
  background:rgba(120,140,160,.10);color:var(--td-strong)}
.bt-echo-foot{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:7px;min-width:0}
.bt-echo-turn{flex:1 1 180px;min-height:40px;min-width:40px;padding:5px 12px;
  border:1px solid rgba(90,180,255,.45);border-radius:8px;background:rgba(79,193,255,.14);
  font-family:inherit;font-size:11px;font-weight:800;color:var(--acc-light);cursor:pointer}
.bt-echo-turn:active{background:rgba(79,193,255,.28)}
.bt-echo-src{flex:1 1 100%;font-size:9px;line-height:1.6;color:var(--td-strong);
  word-break:break-word;overflow-wrap:anywhere}
.bt-pop-echo{margin:2px 12px 8px;padding:7px 9px;border:1px solid rgba(190,140,255,.34);
  border-radius:8px;background:rgba(190,140,255,.07)}
.bt-pop-echo .bt-echo-rule{margin-top:3px}
.bt-echo-f{display:flex;align-items:center;gap:4px;min-width:0;flex:1 1 130px;margin-top:7px}
.bt-echo-f span{flex:0 0 auto;font-size:9.5px;color:var(--td-strong)}
.bt-echo-sel{flex:1 1 auto;min-width:40px;min-height:40px;padding:4px 6px;border:1px solid rgba(190,140,255,.35);
  border-radius:7px;background:rgba(190,140,255,.08);color:var(--parchment);font-family:var(--font);font-size:11px}
.bt-echo-why{margin-top:5px;font-size:10px;line-height:1.6;color:#ffd68a;font-weight:700;
  word-break:break-word;overflow-wrap:anywhere}
.bt-echo-why:empty{display:none}
/* 小批 8 · 缺口 B：本体状态限制下的掠影实例（失能等 → 攻击入口禁用 + 原因） */
.bt-echo-i.is-stlock{border-color:rgba(255,140,140,.45);background:rgba(255,120,120,.08)}
.bt-echo-i.is-stlock .bt-echo-st{border-color:rgba(255,140,140,.5);background:rgba(255,120,120,.12);color:#ffb3b3}
.bt-echo[data-stlock="1"]{border-color:rgba(255,140,140,.42)}
.bt-echo-atk[data-stlock]{border-color:var(--line);background:rgba(120,140,160,.10);color:var(--td-strong)}

/* 小批 8 · 缺口 B：掠影卡上的「本体状态 → 掠影」只读区块（逐条标注适用 / 不适用 / 未定义） */
.bt-petst{margin-top:8px;padding:8px 9px;border:1px solid rgba(255,214,138,.32);border-radius:9px;
  background:rgba(255,214,138,.06);min-width:0}
.bt-petst-t{font-size:11px;font-weight:800;color:#ffd68a}
.bt-petst-t small{font-weight:400;color:var(--td-strong)}
.bt-petst-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px;min-width:0}
.bt-petst-chip{display:inline-block;padding:1px 7px;border-radius:999px;font-size:9.5px;font-weight:700;
  border:1px solid rgba(255,214,138,.42);background:rgba(255,214,138,.10);color:#ffe9bd;
  max-width:100%;overflow-wrap:anywhere}
.bt-petst-row{display:flex;gap:6px;align-items:baseline;margin-top:5px;padding-left:7px;
  border-left:2px solid rgba(255,214,138,.42);min-width:0}
.bt-petst-row .k{flex:0 0 auto;font-size:10px;font-weight:800;color:#ffd68a;max-width:108px}
.bt-petst-row .v{flex:1 1 auto;min-width:0;font-size:10px;line-height:1.65;color:var(--parchment);
  overflow-wrap:anywhere;word-break:break-word}
.bt-petst-row[data-applies="no"]{border-left-color:rgba(150,170,190,.45)}
.bt-petst-row[data-applies="no"] .k{color:var(--td-strong)}
.bt-petst-row[data-applies="undef"]{border-left-color:rgba(190,140,255,.55)}
.bt-petst-row[data-applies="undef"] .k{color:#d9bcff}
.bt-petst-why{display:block;margin-top:1px;font-style:normal;font-size:9px;line-height:1.55;color:var(--td-strong)}
.bt-petst-note{margin-top:6px;font-size:9px;line-height:1.6;color:#ffd68a;font-weight:700;
  overflow-wrap:anywhere;word-break:break-word}

@media (max-width:430px){
  .bt-echo-turn{flex:1 1 100%}
  .bt-echo-f{flex:1 1 100%}
}
html[data-theme="light"] .bt-echo-sel{background:#fff}

/* ---- 本次攻击不适用（前提不符）的常驻命中后效果 ---- */
.bt-pop-atk-excl{margin-top:5px;padding:5px 7px;border:1px dashed rgba(255,214,110,.4);border-radius:7px;
  background:rgba(255,214,110,.06);font-size:9.5px;line-height:1.7;color:#ffd68a;
  word-break:break-word;overflow-wrap:anywhere}

@media (max-width:430px){
  .bt-shadow-f{flex:1 1 100%}
  .bt-shadow-n{flex:1 1 auto}
  .bt-shadow-go{flex:1 1 100%}
}
html[data-theme="light"] .bt-shadow-n,
html[data-theme="light"] .bt-shadow-sel{background:#fff}



/* ============================================================================
 * ISSUE-010 第 6 / 7 条：骰型动画（js/dice-fx.js） + 法术结算区 / 字段审计（js/spells.js）
 * ----------------------------------------------------------------------------
 * · 颜色全部走既有令牌（--acc / --acc-light / --parchment / --pm / --line …），深浅主题自动适配，
 *   不新增硬编码色值；数值与正文用 --parchment，说明文字用 --pm（与既有 .sp-field 同口径）。
 * · .dfx-die 用 CSS 3D 透视 + 逐面片 SVG 呈现与骰型一致的立体视觉；
 *   「减少动画」时 .dfx-stage[data-dfx-reduced="1"] 不加 .is-rolling，直接出结果。
 * ============================================================================ */

/* ---------- 骰型选择器：当前骰型的立体视觉预览（ISSUE-010 §7） ---------- */
.dc-previewrow{display:flex;justify-content:center;margin:2px 0 10px}
.dfx-preview{display:flex;align-items:center;gap:12px;padding:8px 14px;border:1px solid var(--line);
  border-radius:12px;background:rgba(79,193,255,.06);min-height:64px}
.dfx-preview-lab{display:flex;flex-direction:column;gap:2px;text-align:left}
.dfx-preview-lab b{font-size:18px;font-weight:800;color:var(--acc-light)}
.dfx-preview-lab em{font-style:normal;font-size:10px;color:var(--pm)}
.dc-die.is-on{color:#02111f;font-weight:800;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}

/* ---------- 骰子本体（立体多面体视觉） ---------- */
.dfx-stage{display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px 0 2px}
.dfx-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;perspective:520px}
.dfx-die{position:relative;display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;
  color:var(--acc-light);transform:rotateX(-12deg) rotateY(16deg);transition:transform .25s ease;
  filter:drop-shadow(0 2px 3px rgba(1,5,12,.55))}
.dfx-die--d% ,.dfx-die--d100{width:58px}
.dfx-preview .dfx-die{width:56px;height:56px}
.dfx-solid{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;
  border-radius:12px;background:radial-gradient(circle at 32% 26%,rgba(184,228,255,.30),rgba(11,26,43,.06) 62%)}
.dfx-svg{position:absolute;inset:0;width:100%;height:100%}
.dfx-svg polygon{fill:currentColor;stroke:currentColor;stroke-width:1.2;stroke-linejoin:round}
.dfx-sil{opacity:.20}
.dfx-face-d{opacity:.16}
.dfx-num{position:relative;font-size:16px;font-weight:800;color:var(--parchment);text-shadow:0 0 4px rgba(1,5,12,.85)}
.dfx-pct{position:relative;display:flex;gap:2px}
.dfx-pct-f{font-style:normal;font-size:12px;font-weight:800;color:var(--parchment)}
.dfx-pct + .dfx-num{display:none}
.dfx-meta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;font-size:11px;color:var(--pm)}
.dfx-count{color:var(--parchment)}
.dfx-mod{color:var(--pm)}
.dfx-total{font-size:30px;font-weight:800;color:var(--acc-light);line-height:1.15}
.dfx-total.is-pending{color:var(--pm);letter-spacing:.2em}
.dfx-detail{font-size:11px;color:var(--pm);text-align:center;line-height:1.6;word-break:break-word}
.dfx-detail.is-pending{color:var(--pm)}
/* 动画中：立体翻转（纯呈现，不影响数值） */
.dfx-stage.is-rolling .dfx-die{animation:dfx-tumble .62s linear infinite}
.dfx-stage.is-rolling .dfx-num{opacity:.85}
@keyframes dfx-tumble{
  0%{transform:rotateX(-12deg) rotateY(16deg)}
  35%{transform:rotateX(24deg) rotateY(-38deg)}
  70%{transform:rotateX(-40deg) rotateY(52deg)}
  100%{transform:rotateX(-12deg) rotateY(16deg)}
}
.dfx-stage.is-done .dfx-die{transform:rotateX(-8deg) rotateY(10deg)}
@media (prefers-reduced-motion: reduce){
  .dfx-stage.is-rolling .dfx-die{animation:none}
}
html[data-theme="light"] .dfx-solid{background:radial-gradient(circle at 32% 26%,rgba(22,104,179,.18),rgba(255,255,255,.5) 62%)}
html[data-theme="light"] .dfx-die{color:var(--acc);filter:drop-shadow(0 2px 3px rgba(20,40,70,.28))}
html[data-theme="light"] .dfx-num{color:#0b1a2b;text-shadow:none}

/* ---------- 真·立体骰（js/dice3d.js，用户 2026-09-13 要求） ----------
 * d4/d6/d8/d10/d12/d20 在格子里画 canvas：抛掷 / 三轴翻滚 / 落地弹跳 / 停在点数那一面。
 * 立体骰**自己动**，所以要把旧的 2D 翻转动画与落定倾斜对 [data-3d="1"] 关掉（否则会叠着抖）。
 * 数字画在骰面上 ⇒ 原来的数字层只留作无障碍/测试读值（视觉隐藏但仍在 DOM 里）。 */
.dfx-3d{position:absolute;inset:-6%;width:112%;height:112%;display:block}
.dfx-die[data-3d="1"] .dfx-solid{background:none}
/* 骰格不许被弹性布局压缩：否则同一次投掷里（弹层内容从「掷骰中…」变成完整明细）格子宽度会变，
 * 立体骰会跟着重新按新尺寸画，看起来像「骰子自己缩放了一下」。行内本来就会换行，不需要压缩。 */
.dfx-die{flex:0 0 auto}
.dfx-die[data-3d="1"] .dfx-num{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.dfx-stage.is-rolling .dfx-die[data-3d="1"]{animation:none}
.dfx-stage.is-done .dfx-die[data-3d="1"]{transform:none}
.dfx-preview .dfx-die[data-3d="1"]{width:56px;height:56px}

/* ---------- 设置页「减少动画」行（走既有 .set-row / .set-sw 令牌） ---------- */
.dfx-setblock{margin-top:10px;padding-top:8px;border-top:1px dashed var(--line)}
.dfx-setrow{min-height:44px}

/* ---------- 法术结算区（攻击 / 豁免 / 无投掷；ISSUE-010 第 2–5 条） ---------- */
.sp-res{border:1px solid rgba(90,180,255,.20);border-radius:8px;padding:8px 10px;margin:2px 0 9px;
  background:rgba(79,193,255,.05)}
.sp-res-plan{display:flex;flex-direction:column;gap:4px}
.sp-res-line{font-size:11px;line-height:1.7;color:var(--parchment);word-break:break-word}
.sp-res-line b{color:var(--acc-light)}
.sp-res-line.is-hit{color:var(--ok)}
.sp-res-sub{display:block;font-size:10px;color:var(--pm)}
.sp-res-src{display:inline-block;margin-right:5px;padding:1px 7px;border:1px solid var(--line);border-radius:12px;
  font-size:10px;color:var(--pm)}
.sp-res-src.is-on{color:var(--parchment);border-color:var(--acc-dark)}
.sp-res-sum{display:inline-block;margin-left:4px;font-size:11px;font-weight:700;color:var(--acc-light)}
.sp-res-acts{margin-top:8px;flex-wrap:wrap;gap:6px}
.sp-res-acts .sp-btn{flex:1 1 46%;min-height:40px}
.sp-res-host{margin-top:8px}
.sp-res-host:empty{display:none}
.sp-res-log{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.sp-res-log:empty{display:none}
.sp-res-log .sp-res-line{border-left:2px solid var(--acc-dark);padding-left:7px}

/* ---------- 法术卡字段审计（ISSUE-010 第 1 条） ---------- */
.sp-audit{border:1px solid rgba(90,180,255,.14);border-radius:8px;padding:8px 10px;margin:2px 0 9px;
  background:rgba(8,18,31,.35)}
.sp-audit-row{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:11px;line-height:1.6;padding:2px 0;
  border-bottom:1px dashed rgba(90,180,255,.10)}
.sp-audit-row:last-of-type{border-bottom:none}
.sp-audit-row .k{flex:0 0 108px;color:var(--pm)}
.sp-audit-row .v{flex:1 1 120px;color:var(--parchment);word-break:break-word}
.sp-audit-row .n{flex:1 1 100%;font-size:10px;color:var(--pm)}
.sp-audit-tag{font-style:normal;font-size:9px;margin-left:5px;padding:1px 6px;border-radius:10px;
  border:1px solid var(--line);color:var(--pm)}
.sp-audit-tag.pending{color:var(--danger);border-color:rgba(255,122,110,.45)}
html[data-theme="light"] .sp-audit{background:rgba(22,104,179,.05)}
html[data-theme="light"] .sp-res{background:rgba(22,104,179,.05)}
html[data-theme="light"] .sp-res-line.is-hit{color:var(--ok)}
/* ---------- 投掷浮层（战斗页「就地结算」入口共用；只呈现，不掷骰） ---------- */
.dfx-flash{position:fixed;left:50%;bottom:calc(var(--safe-b) + 74px);transform:translateX(-50%);z-index:360;
  pointer-events:none;max-width:min(430px,94vw);padding:6px 14px 8px;border:1px solid var(--line);
  border-radius:14px;background:var(--bg-card);box-shadow:0 8px 24px rgba(1,5,12,.55)}
.dfx-flash:empty{display:none}
.bt-rollhost:empty{display:none}
html[data-theme="light"] .dfx-flash{background:var(--bg-card);box-shadow:0 8px 24px rgba(20,40,70,.22)}

/* ============================================================================
 * ISSUE-009：同调位（Attunement）· 装备条件明细 · 副手攻击判定链 —— 深色蓝黑 + 浅色主题
 * 约束：交互控件 ≥40px（.iv-mini 已 min-height:40px）；430 / 360 宽不横向溢出
 *       （flex + min-width:0 + overflow-wrap:anywhere + 换行）
 * ========================================================================== */
.iv-attune-n{display:inline-block;margin-left:6px;font-size:11px;color:var(--acc-light);font-variant-numeric:tabular-nums}
.iv-attune-rows{display:flex;flex-direction:column;gap:6px;margin:6px 0}
.iv-attune-row{border:1px solid rgba(79,193,255,.22);border-radius:10px;padding:6px 8px;background:rgba(79,193,255,.05);min-width:0}
.iv-attune-row.is-on{border-color:rgba(127,224,168,.5);background:linear-gradient(90deg,rgba(127,224,168,.10),transparent)}
.iv-attune-row.is-over{border-color:rgba(255,196,110,.55);background:linear-gradient(90deg,rgba(255,196,110,.12),transparent)}
.iv-attune-row.is-off{border-color:rgba(255,122,110,.4);background:rgba(255,122,110,.06)}
.iv-attune-top{display:flex;align-items:center;gap:6px;min-width:0}
.iv-attune-name{flex:1 1 auto;min-width:0;font-size:13px;color:var(--parchment);overflow-wrap:anywhere}
.iv-attune-tag{flex:0 0 auto;font-size:10px;color:var(--acc-light);border:1px solid rgba(79,193,255,.45);border-radius:8px;padding:1px 6px}
.iv-attune-row.is-on .iv-attune-tag{color:var(--ok);border-color:rgba(127,224,168,.5)}
.iv-attune-row.is-over .iv-attune-tag{color:#ffc46e;border-color:rgba(255,196,110,.55)}
.iv-attune-row.is-off .iv-attune-tag{color:#ff9c92;border-color:rgba(255,122,110,.5)}
.iv-attune-src{font-size:10px;color:var(--td-strong);margin-top:2px;line-height:1.6;overflow-wrap:anywhere}
.iv-attune-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.iv-attune-foot{font-size:10px;color:var(--td-strong);line-height:1.7;overflow-wrap:anywhere}
.iv-attune-foot b{color:var(--acc-light);font-variant-numeric:tabular-nums}
.iv-attune-warn{font-size:11px;line-height:1.7;color:#ffc46e;border:1px solid rgba(255,196,110,.5);
  border-radius:10px;padding:6px 8px;margin:6px 0;background:rgba(255,196,110,.08);overflow-wrap:anywhere}
.iv-attune-msg{font-size:11px;line-height:1.7;color:#ff9c92;border:1px solid rgba(255,122,110,.5);
  border-radius:10px;padding:6px 8px;margin:6px 0;background:rgba(255,122,110,.08);overflow-wrap:anywhere}
.iv-att-flag{display:inline-block;font-size:9px;color:#ffc46e;border:1px solid rgba(255,196,110,.5);
  border-radius:8px;padding:0 6px;margin:0 2px;vertical-align:1px}
.iv-att-flag.is-on{color:var(--ok);border-color:rgba(127,224,168,.5)}

.iv-ac-cond{margin:4px 0 2px;font-size:11px;color:var(--acc-light);line-height:1.7;overflow-wrap:anywhere}
.iv-ac-cond-i{display:inline-block;margin-right:8px}
/* 小批 8 · 缺口 A：AC 明细里的状态修正行（ISSUE-007）—— 与装备条件行同版式，仅用左侧色条区分来源层 */
.iv-ac-status{margin:4px 0 2px;padding:2px 0 2px 8px;font-size:11px;color:#ffd68a;line-height:1.7;
  border-left:2px solid rgba(255,214,138,.55);overflow-wrap:anywhere}
.iv-ac-status b{color:var(--ok)}
.iv-ac-status .iv-ac-cond-i{color:#ffd68a}
.iv-ac-row.is-status{border-top-color:rgba(255,214,138,.20)}
.iv-ac-row.is-status .k{color:#ffd68a;flex:0 0 84px}
.iv-ac-row.is-status .v{color:#ffe9bd}
.iv-ac-row.is-status.is-off .v{color:var(--td-strong)}
.iv-cond-rows{display:flex;flex-direction:column;gap:4px;min-width:0}
.iv-cond-sec{margin:4px 0;min-width:0}
.iv-cond-sec > b{display:block;font-size:10px;color:var(--pm);letter-spacing:.4px;margin:4px 0 2px}
.iv-cond-row{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline;min-width:0;
  border-left:2px solid rgba(79,193,255,.35);padding:2px 0 2px 8px}
.iv-cond-row .k{flex:0 0 auto;font-size:11px;color:var(--parchment)}
.iv-cond-row .v{flex:1 1 60%;min-width:0;font-size:11px;color:var(--acc-light);overflow-wrap:anywhere}
.iv-cond-row .s{flex:1 1 100%;font-size:9.5px;color:var(--td-strong);line-height:1.6;overflow-wrap:anywhere}
.iv-cond-row.is-pending{border-left-color:rgba(255,196,110,.6)}
.iv-cond-row.is-pending .v{color:#ffc46e}
.iv-cond-row.is-todo{border-left-color:rgba(255,122,110,.5)}
.iv-cond-row.is-todo .v{color:#ff9c92}
.iv-cond-row.is-idle{border-left-color:rgba(140,160,180,.45)}
.iv-cond-row.is-idle .v{color:var(--pm)}

/* 角色页技能卡：装备条件带来的劣势标记（.u2-sk 保持既有 32px 豁免，不改高度） */
.u2-sk-dis{display:inline-block;font-size:9px;color:#ffc46e;border:1px solid rgba(255,196,110,.55);
  border-radius:7px;padding:0 4px;margin:0 2px;vertical-align:1px}
html[data-theme="light"] .u2-sk-dis{color:#8a5a00;border-color:rgba(138,90,0,.5)}
html[data-theme="light"] .iv-attune-warn{color:#8a5a00;background:rgba(255,196,110,.16)}
html[data-theme="light"] .iv-attune-msg{color:#a3231a;background:rgba(255,122,110,.14)}
html[data-theme="light"] .iv-att-flag{color:#8a5a00}
html[data-theme="light"] .iv-cond-row.is-pending .v{color:#8a5a00}
html[data-theme="light"] .iv-cond-row.is-todo .v{color:#a3231a}
@media (max-width:400px){
  .iv-attune-acts{gap:5px}
  .iv-attune-acts .iv-mini{flex:1 1 auto;justify-content:center}
  .iv-cond-row .v{flex-basis:100%}
}

/* ============================================================================
 * ISSUE-007：状态 / 标记（玩家可见侧 + DM 管理面板）
 * 约定：交互控件高度 >= 40px；430 / 360 窄屏不产生横向溢出；
 *      长文本一律 overflow-wrap:anywhere + min-width:0（复用既有窄屏口径）。
 * 颜色只用既有主题变量（深色 / 浅色主题自动跟随）。
 * ========================================================================== */
/* ---- 玩家侧：战斗页 / 角色页的「状态」区 ---- */
.st-card{display:flex;flex-direction:column;gap:6px;min-width:0}
/* 空态文字用 --pm（浅色主题下对比度达标的正文色），不放宽任何既有断言 */
.st-empty{padding:9px 12px;font-size:11.5px;color:var(--pm);line-height:1.7;overflow-wrap:anywhere}
.st-empty span{display:block}
.st-list{display:flex;flex-direction:column;gap:6px;min-width:0}
.st-item{display:flex;flex-direction:column;gap:3px;min-width:0;padding:6px 8px;border:1px solid var(--line);
  border-left:3px solid var(--acc);border-radius:var(--radius-sm);background:rgba(79,193,255,.05)}
.st-top{display:flex;flex-wrap:wrap;gap:4px 6px;align-items:baseline;min-width:0}
.st-name{font-size:12.5px;color:var(--acc-light);font-weight:700;overflow-wrap:anywhere}
.st-type{font-style:normal;font-size:9.5px;color:var(--pm);border:1px solid var(--line);border-radius:7px;padding:0 5px}
.st-dur{font-size:10px;color:var(--td-strong);margin-left:auto;overflow-wrap:anywhere}
.st-fx{font-size:11px;color:var(--parchment);line-height:1.65;overflow-wrap:anywhere}
.st-meta{font-size:9.5px;color:var(--td-strong);line-height:1.6;overflow-wrap:anywhere}
.st-shadow{margin-top:3px;padding:5px 7px;border:1px dashed rgba(255,196,110,.5);border-radius:var(--radius-sm);
  background:rgba(255,196,110,.07);font-size:10px;line-height:1.7;color:#ffd68a;overflow-wrap:anywhere}
.st-unwired,.st-unwired-all{margin-top:3px;padding:4px 6px;border:1px dashed rgba(255,122,110,.5);border-radius:var(--radius-sm);
  background:rgba(255,122,110,.07);font-size:10px;line-height:1.6;color:#ff9c92;overflow-wrap:anywhere}
.st-efflist{display:flex;flex-direction:column;gap:4px;min-width:0}
.st-eff{font-size:11px;color:var(--pm);line-height:1.65;border-left:2px solid var(--acc-dark);padding-left:7px;overflow-wrap:anywhere}
.st-eff b{color:var(--acc-light)}
.st-eff.is-idle{border-left-color:rgba(140,160,180,.5);color:var(--td-strong)}
.st-eff.is-lock{border-left-color:var(--danger)}
.st-eff.is-lock b{color:var(--danger)}
.st-btns{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.st-btns .bt-mini{min-height:40px;flex:1 1 auto;justify-content:center}
.st-tag-mini{display:inline-block;font-size:9px;color:var(--acc-light);border:1px solid var(--line);border-radius:7px;
  padding:0 4px;margin:0 2px;vertical-align:1px}
.st-tag-mini.is-adv{color:var(--ok);border-color:rgba(127,224,168,.55)}
.ov-status{display:flex;flex-direction:column;gap:6px;min-width:0}
.bt-check.is-stfail{border-color:rgba(255,122,110,.55)}
.bt-check-tag.is-fail{color:var(--danger);border-color:rgba(255,122,110,.5)}

/* ---- DM 卡片上的「状态 / 标记」入口 ---- */
.dm-st-open{display:flex;align-items:center;justify-content:center;min-height:40px;padding:8px 10px;width:100%;
  border:1px solid var(--line);border-radius:8px;background:rgba(79,193,255,.07);color:var(--acc-light);
  font-size:12px;font-weight:700;font-family:inherit}
.dm-st-open:active{background:#123352}
.st-chip{border-color:rgba(127,224,168,.35)}
.st-chip.is-hidden{opacity:.75;border-style:dashed}
.st-chip .st-hide{font-style:normal;font-size:9px;color:var(--danger);margin-left:3px}
.st-chip .st-fx{font-style:normal;font-size:9px;color:var(--td-strong);margin-left:3px}
.mo-rel{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:6px 0 2px;min-width:0}
.mo-rel-lab{font-size:10px;color:var(--td-strong)}
.mo-relbtn{display:flex;align-items:center;justify-content:center;min-height:40px;padding:6px 10px;
  border:1px solid var(--line);border-radius:8px;background:rgba(79,193,255,.05);color:var(--pm);
  font-size:11.5px;font-weight:700;font-family:inherit}
.mo-relbtn.is-on{color:#02111f;background:linear-gradient(180deg,var(--acc-light),var(--acc));border-color:#01050b}

/* ---- DM 状态面板（覆盖层，样式与 dm-libover / 商店面板同族） ---- */
.dm-stover{position:fixed;inset:0;z-index:380;background:rgba(1,4,9,.82);display:flex;justify-content:center;align-items:flex-start}
/* hidden 必须真的不渲染：display:flex 会压过 [hidden] 的默认 display:none（否则收起后仍覆盖在玩家页上） */
.dm-stover[hidden]{display:none}
.dm-stsheet{width:100%;max-width:600px;max-height:92vh;margin-top:3vh;overflow:hidden;display:flex;flex-direction:column;
  background:var(--bg-panel);border:1px solid var(--line);border-radius:10px}
.dm-st-top{display:flex;align-items:center;gap:8px;padding:9px 11px;border-bottom:1px solid var(--line);min-width:0}
.dm-st-top b{font-size:13px;color:var(--acc-light);overflow-wrap:anywhere}
.dm-st-kind{font-size:10px;color:var(--pm);border:1px solid var(--line);border-radius:7px;padding:1px 6px}
.dm-st-top .dm-lib-x{margin-left:auto;min-width:40px;min-height:40px}
.dm-st-body{padding:9px 11px 14px;overflow-y:auto;display:flex;flex-direction:column;gap:9px;min-width:0}
.dm-st-lib{font-size:10.5px;color:var(--td-strong);line-height:1.6;overflow-wrap:anywhere}
.dm-st-cur{display:flex;flex-direction:column;gap:8px;min-width:0}
.dm-st-empty{font-size:11.5px;color:var(--td-strong);font-style:italic}
.dm-st-item{border:1px solid var(--line);border-left:3px solid var(--acc);border-radius:var(--radius-sm);
  padding:7px 8px;display:flex;flex-direction:column;gap:6px;min-width:0}
.dm-st-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;min-width:0}
.dm-st-name{font-size:12.5px;color:var(--acc-light);overflow-wrap:anywhere}
.dm-st-type{font-style:normal;font-size:9.5px;color:var(--pm);border:1px solid var(--line);border-radius:7px;padding:0 5px}
.dm-st-vis{font-size:10px;color:var(--ok);border:1px solid rgba(127,224,168,.45);border-radius:7px;padding:0 5px}
.dm-st-vis.is-off{color:var(--danger);border-color:rgba(255,122,110,.45)}
.dm-st-rows{display:flex;flex-direction:column;gap:3px;min-width:0}
.dm-st-row{display:flex;flex-wrap:wrap;gap:2px 8px;min-width:0;font-size:11px}
.dm-st-row .k{flex:0 0 auto;color:var(--td-strong)}
.dm-st-row .v{flex:1 1 60%;min-width:0;color:var(--parchment);overflow-wrap:anywhere}
.dm-st-acts{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:0}
.dm-st-btn{display:flex;align-items:center;justify-content:center;min-height:40px;padding:6px 10px;
  border:1px solid var(--line);border-radius:8px;background:rgba(79,193,255,.05);color:var(--pm);
  font-size:11.5px;font-weight:700;font-family:inherit}
.dm-st-btn.is-danger{color:var(--danger);border-color:rgba(255,122,110,.5)}
.dm-st-btn.is-armed{color:#02111f;background:linear-gradient(180deg,#ffb3aa,var(--danger));border-color:#5a1a12}
.dm-st-stack{min-width:26px;text-align:center;font-size:12px;color:var(--acc-light);font-weight:700}
.dm-st-note{width:100%;min-height:40px;padding:8px;border:1px solid var(--line);border-radius:8px;
  background:var(--bg-card);color:var(--parchment);font-size:11.5px;font-family:inherit}
.dm-st-unwired{padding:5px 7px;border:1px dashed rgba(255,122,110,.5);border-radius:var(--radius-sm);
  background:rgba(255,122,110,.07);font-size:10px;line-height:1.6;color:#ff9c92;overflow-wrap:anywhere}
.dm-st-add{display:flex;flex-direction:column;gap:7px;padding:8px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:rgba(79,193,255,.04);min-width:0}
.dm-st-add-t{font-size:11.5px;color:var(--acc);font-weight:700}
.dm-st-f{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:11px;color:var(--pm);min-width:0}
.dm-st-f > span{flex:1 1 100%;color:var(--td-strong);font-size:10px}
.dm-st-f select,.dm-st-f .dm-st-inp{flex:1 1 100%;min-width:0;min-height:40px;padding:8px;border:1px solid var(--line);
  border-radius:8px;background:var(--bg-card);color:var(--parchment);font-size:11.5px;font-family:inherit}
.dm-st-f select[data-st="duru"],.dm-st-f input[data-st="durv"]{flex:1 1 40%}
.dm-st-check{align-items:flex-start}
.dm-st-check input{width:22px;height:22px;flex:0 0 auto;margin-top:8px}
.dm-st-check > span{flex:1 1 60%;font-size:11px;color:var(--pm)}
.dm-st-visbtn{flex:1 1 100%;justify-content:center;color:var(--ok);border-color:rgba(127,224,168,.45)}
.dm-st-visbtn.is-off{color:var(--danger);border-color:rgba(255,122,110,.45)}
.dm-st-hint{font-style:normal;font-size:9.5px;color:var(--td-strong);flex:1 1 100%}
.dm-st-shadow{padding:6px 8px;border:1px dashed rgba(255,196,110,.5);border-radius:var(--radius-sm);
  background:rgba(255,196,110,.07);font-size:10.5px;line-height:1.7;color:#ffd68a;overflow-wrap:anywhere}
.dm-st-shadow b{display:block;margin-bottom:2px}
.dm-st-shadow .dm-st-src{color:var(--td-strong)}
.dm-st-addrow{display:flex;flex-wrap:wrap;gap:7px;min-width:0}
.dm-st-addrow .dm-btn{flex:1 1 auto;min-height:40px;justify-content:center}
.dm-st-addrow .dm-btn.is-danger{color:var(--danger);border-color:rgba(255,122,110,.5)}
.dm-st-err{padding:5px 7px;border-radius:var(--radius-sm);background:rgba(255,122,110,.14);
  font-size:10.5px;color:var(--danger);overflow-wrap:anywhere}
html[data-theme="light"] .st-shadow,
html[data-theme="light"] .dm-st-shadow{color:#8a5a00;border-color:rgba(138,90,0,.45);background:rgba(255,196,110,.18)}
html[data-theme="light"] .st-unwired,html[data-theme="light"] .st-unwired-all,
html[data-theme="light"] .dm-st-unwired{color:#a3231a}
html[data-theme="light"] .dm-st-btn.is-armed{color:#fff}
@media (max-width:430px){
  .dm-stsheet{margin-top:0;max-height:100vh;border-radius:0}
  .dm-st-row .v,.dm-st-f select,.dm-st-f .dm-st-inp{flex-basis:100%}
  .dm-st-acts .dm-st-btn{flex:1 1 auto}
}
/* =====================================================================
 * UI-002（用户口径 2026-09-12）：「攻击」进动作池 + 通用动作合集按经济分池
 *   · 「攻击」= 动作池（.bt-ag[data-pool="action"]）内的第一个 .bt-act 条目；
 *     改动前动作池下方那张攻击卡（.bt-atk）现内嵌在该条目的详情弹层里 —— 版式与选择器不变。
 *   · 「通用动作合集」折叠栏（.bt-gen）分别落在 .bt-ag[data-pool="action"|"bonus"] 的 body 内，
 *     展开后**只列名称**（.bt-gen-chip 内只有 .bt-gen-n），沿用既有类名与配色令牌 ——
 *     不新增任何文字颜色，tools/audit-ui.mjs 的对比度基线不受影响。
 *   · 合集条目仍是单列、名称单行省略（超长不换行 → 360px 不横向溢出），高度仍 ≥40px。
 * ===================================================================== */
.bt-ag-body .bt-gen{margin-top:2px}
.bt-ag-body button.bt-gen-chip{grid-template-columns:minmax(0,1fr)}

/* =====================================================================
 * 小批 10 · 宽屏两列（平板 / 桌面）
 * =====================================================================
 * 口径（与用户确认）：
 *  · 单一 DOM：不新增、不复制任何 HTML 结构；宽窄差异 100% 由本块 CSS 决定。
 *    没有 JS 设备判定、没有 UA / ontouchstart / 设备型号分支 —— 判定依据只有
 *    「视口宽度」这一个媒体查询条件。JS / index.html 本批**未改一行**。
 *  · 两档断点：≤700px = 单列（本块整体不生效，移动端与改动前逐像素同源）；
 *    ≥701px = 两列。宽屏容器从手机框 560px 放宽到 min(1000px,100%)。
 *  · 两列用 CSS 多列（column-count）而不是 grid：这里的两列是「左右各自自上
 *    而下堆叠的长短块」——grid 的同一行会被该行最高的单元格撑高，左列卡片会被
 *    右侧很高的动作池推到页面底部；多列则左右互不影响。卡片一律
 *    break-inside:avoid（整块不跨列断开），列边界用 break-before:column 钉在
 *    语义区块上（战斗页钉在 .bt-actions，即「动作分池」起全部进右列）。
 *  · 触控目标口径（≥40px，唯一豁免角色页 .u2-sk 32px）、卡面比例口径
 *    （原图 aspect-ratio + object-fit:contain）、FAB / toast / 底部导航的结构与
 *    定位，本块一律不涉及（宽屏下仍与移动端同一结构、同一套定位规则）。
 *  · 用了 :has() 做「数量守卫」：只在目标确有足够区块时才开两列（例如背包页
 *    商店子页只有 1 张卡 → 保持单列整行，不会被压成半宽）；:has() 不支持时
 *    整条声明失效 → 自动退回单列（优雅降级，不影响功能）。
 * ===================================================================== */
@media (min-width: 701px){
  /* —— 容器：手机框 560px → 1000px。
         .bottomnav 只同步 max-width（对齐内容宽度），结构 / 6 个页签 / 顺序 /
         fixed 定位全部不变；DM 端 body.dm{max-width:none} 优先级更高，不受影响。 —— */
  body{max-width:min(1000px,100%)}
  .bottomnav{max-width:min(1000px,100%)}

  /* —— 战斗页两列 ——
     左列：生命值 / 状态·标记 / 职业资源（.bt-stack 前 3 张卡，DOM 顺序即移动端顺序）
     右列：动作分池 / 召唤物 / 储法物品 / 忍术（.bt-actions 及其后全部）
     顶部状态条（AC/速度/先攻/熟练/视觉 = .u2-bar）保持整行横跨两列：它是页级
     状态带，5 等分列需要宽度，且整行放置可避免改动 #battlePanel 的既有结构。 */
  #battlePanel > .bt-stack:has(> .bt-actions){
    display:block;                /* 覆盖移动端 flex 纵列 —— 多列只对块容器生效 */
    column-count:2;
    column-gap:14px;
  }
  #battlePanel > .bt-stack > *{
    break-inside:avoid;
    page-break-inside:avoid;
    margin-bottom:10px;           /* 顶替移动端 flex 的 gap:10px（间距不变） */
  }
  #battlePanel > .bt-stack > .bt-actions{break-before:column}

  /* —— 角色页「总览」：左 = 头像 / HP·AC·熟练 / 六维属性；右 = 卡头档案 / 特性 /
     状态 / 出身摘要。子元素顺序固定为 12 个 div，故用 :nth-child(5)（「卡头档案」
     标题）钉列边界，保证标题与其内容同列。 —— */
  .page[data-page="character"] > [data-ctab-panel="overview"]:has(> :nth-child(5)){
    column-count:2;
    column-gap:16px;
  }
  .page[data-page="character"] > [data-ctab-panel="overview"] > *{
    break-inside:avoid;
    page-break-inside:avoid;
  }
  .page[data-page="character"] > [data-ctab-panel="overview"] > :nth-child(5){break-before:column}

  /* —— 角色页「属性与技能」：5 张 section 卡（六维 / 豁免 / SKILLS / 熟练项 /
     语言）按高度均分两列；每列内技能格仍是 2 轨（.u2-skgrid 未改）。 —— */
  .page[data-page="character"] > [data-ctab-panel="abilities"]:has(> :nth-child(2)){
    column-count:2;
    column-gap:16px;
  }
  .page[data-page="character"] > [data-ctab-panel="abilities"] > *{
    break-inside:avoid;
    page-break-inside:avoid;
  }

  /* —— 背包页：货币 / 负重（左）与物品列表或装备槽（右）。
     商店子页只有 1 张卡 → :has 守卫不成立 → 单列整行。 —— */
  #inventoryPanel .iv-body:has(> :nth-child(3)){display:block;column-count:2;column-gap:14px}
  #inventoryPanel .iv-body > *{break-inside:avoid;page-break-inside:avoid;margin-bottom:10px}

  /* —— 法术页：法术条目卡按列宽自适应成多列卡片（列表用满宽度）。
     详情仍是「点卡 → 弹层」（.sp-pop-card，既有交互，本批不动）。 —— */
  #spellPanel .sp-list{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
    gap:8px;
    align-items:start;
  }

  /* —— 休息页：营地（左）与资源总览 / 恢复明细（右）。 —— */
  #restPanel .rs-stack:has(> :nth-child(3)){display:block;column-count:2;column-gap:14px}
  #restPanel .rs-stack > *{break-inside:avoid;page-break-inside:avoid;margin-bottom:10px}
}
/* =====================================================================
 * 小批 22 · 批 A 战斗页口径修订（2026-09-13）新增样式
 *   ① .bt-atk-head  —— 攻击条目的「攻击次数 + 逐击进度」（需求 #3/#4）
 *   ② .bt-turn / .bt-turn-fx —— 本回合状态卡：攻击进度 / 反应额度 / 临时效果（需求 #3/#10）
 *   ③ .dm-rules-overlay —— DM 端只读「规则资料」页（需求 #2）
 *   ④ .lu-sgrant —— 升级流程「特性授予的技能熟练」选择块（需求 #13）
 * 一律使用 flex-wrap + min-width:0，430 窄屏与 900+ 横屏均不产生横向溢出。
 * ===================================================================== */
.bt-atk-head{margin:2px 12px 6px;padding:7px 9px;border:1px solid rgba(79,193,255,.28);
  border-radius:9px;background:rgba(79,193,255,.05);min-width:0}
.bt-atk-head .bt-atk-row{margin:0}
.bt-atk-head-p{margin-top:3px;font-size:10.5px;font-weight:700;color:var(--acc-light);line-height:1.55;
  word-break:break-word;overflow-wrap:anywhere}
.bt-atk-inp.sm{flex:0 0 66px;width:66px;min-width:0}
.bt-atk-row[data-role="atkstrike"]{flex-wrap:wrap;gap:4px 6px}
.bt-turn{margin-top:6px;padding-top:6px;border-top:1px solid rgba(90,180,255,.14);min-width:0}
.bt-turn-t{font-size:11.5px;font-weight:800;color:var(--acc);letter-spacing:.4px;padding:2px 0 3px}
.bt-turn-t small{font-size:9.5px;color:var(--td-strong);font-weight:400;margin-left:5px}
.bt-turn-btns{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px}
.bt-turn-row{padding:4px 0;font-size:11.5px;color:var(--pm);line-height:1.7;word-break:break-word;overflow-wrap:anywhere}
.bt-turn-row.is-idle{color:var(--td-strong)}
.bt-turn-row b{color:var(--acc-light);font-weight:800}
.bt-turn-fx{margin:4px 0;padding:6px 9px;border:1px solid rgba(150,220,140,.42);border-radius:8px;
  background:rgba(150,220,140,.10);font-size:11.5px;font-weight:700;color:#cfeec4;line-height:1.65;
  word-break:break-word;overflow-wrap:anywhere}
html[data-theme="light"] .bt-turn-fx{color:#1d4a12}
/* —— DM 只读「规则资料」覆盖层（与 #dmShopPanel 同一层级与形态） —— */
.dm-rules-overlay{position:fixed;inset:0;z-index:6;background:rgba(2,6,12,.95);overflow-y:auto;
  padding:10px 12px calc(20px + var(--safe-b));-webkit-overflow-scrolling:touch}
.dm-rules-card{width:100%;max-width:1180px;margin:0 auto;display:flex;flex-direction:column;gap:8px;min-width:0}
.dm-rules-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 12px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:linear-gradient(90deg,#0d2136,#081624);min-width:0}
.dm-rules-head b{font-size:15px;font-weight:800;color:var(--acc-light);letter-spacing:.5px}
.dm-rules-sub{flex:1 1 240px;min-width:0;font-size:10.5px;color:var(--td-strong);line-height:1.6}
.dm-rules-body{display:flex;flex-direction:column;gap:8px;min-width:0}
.dm-rules-cls{border:1px solid var(--line);border-radius:var(--radius-md);background:rgba(79,193,255,.04);
  padding:8px 10px;min-width:0}
.dm-rules-ch{font-size:13px;font-weight:800;color:var(--acc-light);margin-bottom:4px}
.dm-rules-ch small{font-size:10px;color:var(--td-strong);font-weight:400;margin-left:6px}
.dm-rules-item{padding:6px 0;border-top:1px solid rgba(90,180,255,.14);min-width:0}
.dm-rules-n{display:block;font-size:12px;font-weight:800;color:var(--parchment);margin-bottom:3px}
.dm-rules-row{display:flex;flex-wrap:wrap;gap:2px 8px;padding:2px 0;min-width:0}
.dm-rules-k{flex:0 0 auto;font-size:10px;font-weight:800;color:var(--acc-light)}
.dm-rules-v{flex:1 1 220px;min-width:0;font-size:10.5px;color:var(--pm);line-height:1.6;
  word-break:break-word;overflow-wrap:anywhere}
.dm-rules-raw{margin-top:4px;font-size:10px;color:var(--td-strong);line-height:1.65;
  word-break:break-word;overflow-wrap:anywhere}
.dm-rules-empty{font-size:10.5px;color:var(--td-strong);padding:3px 0}
/* —— 小批 23：规则资料页顶部「关键字检索 + 分节计数」工具行（430 / 360 窄屏不横向溢出） —— */
.dm-rules-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:7px 12px;border:1px solid var(--line);
  border-radius:var(--radius-md);background:rgba(79,193,255,.06);min-width:0}
.dm-rules-q{flex:1 1 200px;min-width:0;max-width:100%}
.dm-rules-count{flex:1 1 100%;min-width:0;font-size:10.5px;color:var(--td-strong);line-height:1.6;
  word-break:break-word;overflow-wrap:anywhere}
.dm-rules-clr{flex:0 0 auto}
.dm-rules-more{margin-top:5px;font-size:10px;color:var(--td-strong);line-height:1.65;
  word-break:break-word;overflow-wrap:anywhere}
.dm-rules-n small{font-weight:400;font-size:10px;color:var(--td-strong)}
/* —— 升级向导：特性授予的技能熟练（需求 #13） —— */
.lu-sgrant-box{margin:8px 0;padding:8px 10px;border:1px solid rgba(255,214,110,.35);border-radius:var(--radius-md);
  background:rgba(255,214,110,.07);min-width:0}
.lu-sgrant{display:block;padding:6px 0;min-width:0}
.lu-sgrant-h{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.lu-sgrant-h b{font-size:12.5px;font-weight:800;color:var(--parchment)}
.lu-sgrant-tag{font-size:10px;font-style:normal;color:#ffd79a}
.lu-sgrant-pick{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:4px;font-size:11.5px;color:var(--pm)}
.lu-sgrant-pick .lu-select{flex:0 1 auto;min-width:0;max-width:100%}

/* ===== 赤魔法学者「黑白对学」卡（用户 2026-09-15 裁定 F′1：学一得二 · 玩家自选对应属性法术） ===== */
.sp-rdm{margin-bottom:10px}
.sp-rdm-pend{margin:0 12px 8px;padding:8px 10px;border:1px solid rgba(79,193,255,.22);border-radius:8px;
  background:linear-gradient(90deg,rgba(79,193,255,.08),rgba(79,193,255,.02));min-width:0}
.sp-rdm-line{font-size:12px;color:var(--parchment);line-height:1.6;word-break:break-word}
.sp-rdm-rule{font-size:11px;color:var(--acc-light);margin-top:3px}
.sp-rdm-acts{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:7px;min-width:0}
.sp-rdm-sel{flex:1 1 140px;min-width:0;max-width:100%;font-size:12px;padding:5px 6px;border-radius:7px;
  border:1px solid var(--line);background:rgba(8,20,34,.75);color:var(--parchment)}
.sp-rdm-pair{margin:0 12px 6px;padding:6px 9px;border:1px solid rgba(120,220,170,.28);border-radius:8px;
  background:rgba(120,220,170,.07);font-size:12px;color:var(--parchment);min-width:0;word-break:break-word}
.sp-rdm-pair em{display:block;font-size:10.5px;font-style:normal;color:var(--pm);margin-top:2px}
.sp-rdm-out{margin:0 12px 8px;font-size:11px;color:var(--pm)}
.sp-rdm-re{margin:0 4px 0 0;padding:3px 7px;font-size:11px;border:1px solid var(--line);border-radius:6px;
  background:rgba(79,193,255,.08);color:var(--acc-light)}
.sp-rdm-note{margin:0 12px 8px;font-size:11px;line-height:1.7;color:var(--pm)}
.sp-rdm-none{margin:0 12px 8px;font-size:11px;color:var(--pm)}
/* 升级向导：由「魔法奥秘」取自本职业法表之外的标记 */
.lu-mystic{font-style:normal;font-size:10px;color:#ffd79a;border:1px solid rgba(255,214,110,.4);
  border-radius:5px;padding:0 4px;margin-left:4px}