/* =========================================================================
   护航对战标签页
   ========================================================================= */

#tabbar{display:flex;gap:6px;background:#eef1f7;padding:4px;border-radius:10px;flex:none}
#tabbar .tab{
  border:none;background:transparent;padding:7px 18px;border-radius:8px;
  cursor:pointer;font-size:13px;color:var(--ink2);font-weight:600;transition:.13s;
  white-space:nowrap;
}
#tabbar .tab:hover{background:#e2e7f2}
#tabbar .tab.on{background:#fff;color:var(--sys);box-shadow:0 1px 4px rgba(30,40,70,.12)}

#battle-layout{
  display:grid;grid-template-columns:260px minmax(0,1fr) 420px;
  gap:14px;padding:14px;align-items:start;height:calc(100vh - 58px);
}
#battle-layout[hidden]{display:none}
.bpanel{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  height:100%;display:flex;flex-direction:column;overflow:hidden;
}
.bpanel > .side-head{padding:12px;border-bottom:1px solid var(--line)}

/* --- 舰船池 --- */
#bt-shiplist{flex:1;overflow-y:auto;padding:8px}
.bt-ship{
  padding:8px 10px;border-radius:8px;cursor:pointer;margin-bottom:4px;
  border:1px solid transparent;transition:.12s;
}
.bt-ship:hover{background:var(--sys-bg);border-color:#d8cfff}
.bt-ship .nm{font-weight:600;font-size:12.5px}
.bt-ship .mt{font-size:10.5px;color:var(--ink3);margin-top:2px;display:flex;gap:6px}
.bt-ship .add{color:var(--sys);font-weight:700}

/* --- 编队 --- */
#bt-forms{flex:1;overflow-y:auto;padding:12px}
.bt-side{border:2px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden}
.bt-side.blue{border-color:#2f8dfb}
.bt-side.red{border-color:#e5484d}
.bt-side-head{
  padding:8px 12px;font-weight:700;font-size:13px;display:flex;align-items:center;gap:10px;
}
.bt-side.blue .bt-side-head{background:#eef5ff;color:#2064c0}
.bt-side.red .bt-side-head{background:#fdeeee;color:#b5343a}
.bt-side-head .pop{margin-left:auto;font-size:12px;font-weight:400;color:var(--ink2)}
.bt-fleet{padding:8px 10px;border-top:1px solid var(--line)}
.bt-fleet-head{
  font-size:11.5px;color:var(--ink2);font-weight:700;margin-bottom:6px;
  display:flex;align-items:center;gap:8px;cursor:pointer;
}
.bt-fleet.sel .bt-fleet-head{color:var(--sys)}
.bt-fleet.sel{background:#faf9ff}
.bt-fleet-head .tag{
  font-size:10px;font-weight:400;border-radius:20px;padding:1px 8px;background:#eef1f7;
}
.bt-fleet.sel .bt-fleet-head .tag{background:var(--sys);color:#fff}
.bt-unit{
  display:flex;align-items:center;gap:8px;font-size:12.5px;
  padding:5px 8px;border-radius:7px;background:#f8fafd;margin-bottom:4px;
  border:1px solid #e8edf6;
}
.bt-unit .un{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bt-unit .cnt{display:flex;align-items:center;gap:3px}
.bt-unit .cnt button{
  width:20px;height:20px;border:1px solid var(--line);background:#fff;border-radius:5px;
  cursor:pointer;font-size:12px;line-height:1;padding:0;
}
.bt-unit .cnt button:hover{background:var(--sys-bg);border-color:var(--sys)}
.bt-unit .cnt input{width:38px;text-align:center;border:1px solid var(--line);border-radius:5px;font-size:12px;padding:2px}
.bt-unit .flag{cursor:pointer;font-size:13px;opacity:.35;user-select:none}
.bt-unit .flag.on{opacity:1}
.bt-empty{font-size:11.5px;color:var(--ink3);padding:6px 8px}

.btsettings{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px;border-top:1px solid var(--line);align-items:end}
.btsettings .btn{padding:7px 10px}
#bt-problems{border-top:1px solid var(--line);max-height:180px;overflow-y:auto}
#bt-problems:empty{display:none}
.btprob{font-size:11.5px;padding:6px 12px;border-bottom:1px solid #f4f6fb;color:#8a5a10}
.btprob.bad{color:#b5343a}

/* --- 战报 --- */
#bt-result-body{padding:12px}
.rsum{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:14px}
.rsum .card{border-radius:10px;padding:9px 11px;border:1px solid var(--line)}
.rsum .card.blue{background:#eef5ff;border-color:#cfe2fb}
.rsum .card.red{background:#fdeeee;border-color:#f7d5d5}
.rsum .card .who{font-size:11px;font-weight:700;margin-bottom:5px}
.rsum .card.blue .who{color:#2064c0}
.rsum .card.red .who{color:#b5343a}
.rsum .card .row{display:flex;justify-content:space-between;font-size:11.5px;padding:1px 0}
.rsum .card .row b{font-variant-numeric:tabular-nums}

.rwin{
  text-align:center;padding:12px;border-radius:10px;margin-bottom:12px;
  background:linear-gradient(135deg,#7c5cff,#2f8dfb);color:#fff;
}
.rwin .big{font-size:20px;font-weight:800}
.rwin .sm{font-size:11.5px;opacity:.9;margin-top:3px}

.rsec{margin-bottom:14px}
.rsec h4{
  margin:0 0 8px;font-size:12px;color:var(--ink2);font-weight:700;
  padding-bottom:5px;border-bottom:1px solid var(--line);
}
canvas.rchart{width:100%;height:180px;display:block;border-radius:8px;background:#fbfcfe}

table.rtab{width:100%;border-collapse:collapse;font-size:11.5px}
table.rtab th{
  text-align:left;padding:5px 6px;color:var(--ink3);font-weight:600;
  border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;
}
table.rtab td{padding:4px 6px;border-bottom:1px solid #f4f6fb;font-variant-numeric:tabular-nums}
table.rtab tr.dead td{color:#b5343a}
table.rtab td.num{text-align:right}

.rtl{list-style:none;margin:0;padding:0}
.rtl li{
  display:flex;gap:9px;padding:5px 0;border-bottom:1px solid #f4f6fb;font-size:11.5px;
}
.rtl .t{
  flex:0 0 52px;font-weight:700;color:var(--sys);font-variant-numeric:tabular-nums;
}
.rtl .e{flex:1;color:var(--ink2)}

.rbatch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;font-size:11.5px}
.rbatch .b{background:#f8fafd;border:1px solid #e8edf6;border-radius:8px;padding:7px 9px}
.rbatch .b .k{font-size:10.5px;color:var(--ink3)}
.rbatch .b .v{font-size:14px;font-weight:700}

/* ==================== 战报独立整页 ==================== */
#report-page{
  position:fixed;inset:0;z-index:150;background:var(--bg);
  display:flex;flex-direction:column;overflow:hidden;
}
#report-page[hidden]{display:none !important}

.rp-banner{
  flex:none;display:flex;align-items:center;justify-content:center;gap:26px;
  padding:14px 20px 12px;flex-wrap:wrap;
  background:linear-gradient(135deg,#5b3fd6,#2f8dfb);color:#fff;
  box-shadow:0 2px 14px rgba(30,40,70,.18);
}
.rp-banner.lose{background:linear-gradient(135deg,#a8292e,#e5484d)}
.rp-banner.draw{background:linear-gradient(135deg,#5a6478,#8b95a8)}
.rp-main{text-align:center}
.rp-title{font-size:26px;font-weight:800;letter-spacing:2px}
.rp-sub{font-size:12.5px;opacity:.92;margin-top:5px}
/* 战斗时长：用户口径 —— 这是最该一眼看到的信息，单独放大 */
.rp-dur-box{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:2px 18px;border-left:1px solid rgba(255,255,255,.34);
  border-right:1px solid rgba(255,255,255,.34);
}
.rp-dur-lab{font-size:11px;letter-spacing:3px;opacity:.9}
.rp-dur{
  font-size:34px;font-weight:800;line-height:1.05;letter-spacing:1px;
  font-variant-numeric:tabular-nums;text-shadow:0 2px 10px rgba(0,0,0,.18);
}

.rp-tabs{
  flex:none;display:flex;gap:6px;align-items:center;
  padding:8px 14px;background:#fff;border-bottom:1px solid var(--line);
}
.rp-tab{
  border:none;background:transparent;padding:7px 16px;border-radius:8px;
  cursor:pointer;font-size:13px;color:var(--ink2);font-weight:600;transition:.13s;
}
.rp-tab:hover{background:#eef1f7}
.rp-tab.on{background:var(--sys);color:#fff}
.rp-actions{display:flex;gap:6px}

.rp-body{flex:1;overflow-y:auto;padding:14px 18px 40px}

/* --- 舰队状态 --- */
.fs-side{margin-bottom:18px}
.fs-head{
  display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px;
  padding:8px 12px;border-radius:9px;margin-bottom:10px;
}
.fs-head.blue{background:#eef5ff;color:#2064c0}
.fs-head.red{background:#fdeeee;color:#b5343a}
.fs-head .cnt{font-weight:400;font-size:12px;color:var(--ink2);margin-left:auto}
.fs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:9px}
.fs-card{
  border:1px solid var(--line);border-radius:10px;padding:9px 11px;background:#fff;
}
.fs-card.dead{background:#fdf2f2;border-color:#f0d4d4}
.fs-card .top{display:flex;align-items:center;gap:7px;margin-bottom:6px}
.fs-card .nm{font-weight:700;font-size:12.5px;flex:1;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-card .tag{font-size:10px;border-radius:20px;padding:1px 7px;background:#eef1f7;color:var(--ink2)}
.fs-card.dead .tag{background:#f7d5d5;color:#b5343a}
.fs-hp{height:9px;border-radius:5px;background:#eef1f7;overflow:hidden;margin-bottom:5px}
.fs-hp i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#1fb46b,#5ed69b)}
.fs-hp i.warn{background:linear-gradient(90deg,#e8a013,#f5c95a)}
.fs-hp i.crit{background:linear-gradient(90deg,#e5484d,#f58a8e)}
.fs-num{display:flex;justify-content:space-between;font-size:11px;color:var(--ink2);
  font-variant-numeric:tabular-nums;margin-bottom:5px}
.fs-rows{font-size:11px;color:var(--ink2);line-height:1.75;
  border-top:1px dashed #e8edf6;padding-top:5px}
.fs-rows b{font-variant-numeric:tabular-nums;color:var(--ink)}
.fs-air{margin-top:6px;border-top:1px dashed #e8edf6;padding-top:5px}
.fs-air .t{font-size:10.5px;color:var(--ink3);margin-bottom:4px}
.fs-air .items{display:flex;flex-wrap:wrap;gap:4px}
.fs-air .a{font-size:10px;border-radius:5px;padding:1px 6px;background:#eef4ff;color:#2b5cab}
.fs-air .a.dead{background:#f7d5d5;color:#b5343a;text-decoration:line-through}

/* --- 行动统计 --- */
.st-tab{width:100%;border-collapse:collapse;font-size:12px;background:#fff;
  border:1px solid var(--line);border-radius:10px;overflow:hidden}
.st-tab th{background:#f8fafd;text-align:left;padding:8px 10px;color:var(--ink2);
  font-weight:700;font-size:11.5px;border-bottom:1px solid var(--line);white-space:nowrap}
/* 数字列：表头也右对齐，跟下面的数字对齐，免得看起来串列 */
.st-tab th.num{text-align:right}
/* 输出类 / 防御类分开着色，一眼看清哪几列是一组 */
.st-tab th.out{color:#2064c0}
.st-tab th.take{color:#b5343a}
.st-tab th.heal{color:#0f8b50}
.st-tab td{padding:7px 10px;border-bottom:1px solid #f4f6fb;font-variant-numeric:tabular-nums}
/* 承伤 / 维修量两列加极淡底色，对齐时不会看跑偏 */
.st-tab td.take{background:rgba(181,52,58,.045)}
.st-tab td.heal{background:rgba(15,139,80,.055)}
.st-tab tr:last-child td{border-bottom:none}
.st-tab td.num{text-align:right}
.st-tab tr.sub td{background:#fbfcfe;font-size:11.5px;color:var(--ink2)}
.st-tab tr.sub td:first-child{padding-left:26px}
.st-tab td.st-tgt{font-size:10.5px;color:var(--ink3);text-align:left;max-width:280px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st-tab .blue{color:#2064c0;font-weight:700}
.st-tab .red{color:#b5343a;font-weight:700}
.st-caret{cursor:pointer;user-select:none;display:inline-block;width:12px;color:var(--ink3)}

/* --- 结构值变动 --- */
.curve-wrap{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px}
.curve-wrap h4{margin:0 0 10px;font-size:13px;color:var(--ink2)}
canvas.curve{width:100%;height:440px;display:block}
.curve-legend{display:flex;gap:18px;justify-content:center;margin-top:10px;font-size:12px}
.curve-legend i{display:inline-block;width:14px;height:3px;border-radius:2px;
  margin-right:5px;vertical-align:middle}

/* --- 行动结果 --- */
.res-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}
.res-card{border:1px solid var(--line);border-radius:11px;padding:12px 14px;background:#fff}
.res-card.blue{border-color:#cfe2fb;background:#f7fbff}
.res-card.red{border-color:#f7d5d5;background:#fff8f8}
.res-card h5{margin:0 0 8px;font-size:13px}
.res-card.blue h5{color:#2064c0}
.res-card.red h5{color:#b5343a}
.res-row{display:flex;justify-content:space-between;font-size:12px;padding:2px 0;
  font-variant-numeric:tabular-nums}
.res-row span:first-child{color:var(--ink2)}

/* ==================== 机库 / 舰载机 ==================== */
.bt-ship.is-air{border-style:dashed;opacity:.72}
.bt-ship.is-air .add{background:#eef1f7;color:var(--ink2)}
.bt-unit.is-air{background:#fbfcfe}
.bt-unit.is-air .un{color:var(--ink2)}

.bt-hangar{
  display:flex;align-items:center;gap:8px;margin-top:5px;padding:5px 8px;
  background:#f6f9ff;border:1px dashed #cfe0fb;border-radius:7px;font-size:11.5px;
}
.bt-hangar .lb{
  flex:none;font-weight:700;color:#2b5cab;background:#e4eeff;
  border-radius:5px;padding:1px 7px;
}
/* 是哪个机库（一艘母舰可能有多个机库系统，各占一行） */
.bt-hangar .hn{
  flex:none;max-width:132px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--ink2);font-size:11px;
}
.bt-hangar .txt{flex:1;min-width:0;color:var(--ink);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.bt-hangar .txt.empty{color:#b08a2e}
.bt-hangar .mini{
  flex:none;border:1px solid #cfe0fb;background:#fff;color:#2b5cab;
  border-radius:6px;padding:2px 9px;font-size:11px;cursor:pointer;
}
.bt-hangar .mini:hover{background:#e4eeff}
.bt-ov-tip.sub{color:#2b5cab;background:#f2f7ff;border-radius:6px;padding:6px 8px}

/* 机库配置弹窗 */
.bt-ov{
  position:fixed;inset:0;z-index:400;background:rgba(24,32,52,.42);
  display:flex;align-items:center;justify-content:center;
}
.bt-ov-box{
  width:min(560px,92vw);max-height:84vh;overflow:auto;background:#fff;
  border-radius:14px;padding:18px 20px;box-shadow:0 18px 48px rgba(20,30,60,.28);
}
.bt-ov-box h3{margin:0 0 8px;font-size:15px}
.bt-ov-tip{font-size:11.5px;color:var(--ink3);line-height:1.7;
  background:#f8fafd;border-radius:8px;padding:8px 10px;margin-bottom:10px}
.bt-ov-sum{font-size:12px;font-weight:700;color:#2b5cab;margin-bottom:8px}
.bt-ov-sum.bad{color:#b5343a}
.bt-ov-list{border:1px solid var(--line);border-radius:9px;overflow:hidden}
.bt-ov-row{display:flex;align-items:center;gap:8px;padding:7px 10px;
  border-bottom:1px solid #f4f6fb;font-size:12.5px}
.bt-ov-row:last-child{border-bottom:none}
.bt-ov-row.on{background:#f4f9ff}
.bt-ov-row .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.bt-ov-row .cnt{display:flex;align-items:center;gap:5px}
.bt-ov-row .cnt button{
  width:22px;height:22px;border:1px solid var(--line);background:#fff;
  border-radius:5px;cursor:pointer;font-size:13px;line-height:1;
}
.bt-ov-row .cnt b{min-width:18px;text-align:center}
.bt-ov-btns{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}