:root{
  --bg:#15120d; --bg2:#1e1a13; --bg3:#272016; --raise:#2f2718;
  --paper:#ece2cd; --ink:#ece3d1; --ink2:#b7a988; --ink3:#8a7d62;
  --line:#3a3222; --line2:#4a4030;
  --cinnabar:#c04a3c; --cinnabar-d:#9c352b; --cinnabar-g:#e0685a;
  --jade:#5f9c85; --jade-d:#487a67;
  --gold:#c9a24e; --gold-d:#a3823a;
  --leave:#7f8fa6; --sub:#c9924e;
  --shadow:0 10px 30px rgba(0,0,0,.45);
  --serif:"Songti SC","STSong","SimSun","Noto Serif SC",serif;
  --sans:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Source Han Sans SC","Noto Sans SC",system-ui,-apple-system,sans-serif;
  --mono:"SF Mono","DIN Alternate","Menlo","Consolas",monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  background-image:
    radial-gradient(1200px 500px at 80% -10%, rgba(192,74,60,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(95,156,133,.07), transparent 55%);
  color:var(--ink); font-family:var(--sans); font-size:14px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--cinnabar);color:#fff}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--line2);border-radius:6px}
::-webkit-scrollbar-track{background:transparent}

/* ---------- layout ---------- */
.wrap{max-width:1280px;margin:0 auto;padding:0 20px 80px}
header.top{position:sticky;top:0;z-index:40;background:rgba(21,18,13,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.topinner{max-width:1280px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.seal{display:flex;align-items:center;gap:12px}
.sealmark{
  width:46px;height:46px;flex:0 0 46px;border-radius:8px;
  background:linear-gradient(160deg,var(--cinnabar),var(--cinnabar-d));
  border:1.5px solid rgba(224,104,90,.5);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);color:#fff5ee;font-size:24px;font-weight:700;
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.10), var(--shadow);
  letter-spacing:-2px;
}
.title h1{font-family:var(--serif);font-size:21px;margin:0;letter-spacing:2px;font-weight:700}
.title .sub{font-size:11.5px;color:var(--ink3);letter-spacing:3px;margin-top:1px}
.spacer{flex:1}
.hbtns{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.admin-toggle{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--ink2);
  border:1px solid var(--line2);padding:5px 10px;border-radius:20px;user-select:none}
.switch{width:34px;height:18px;border-radius:20px;background:var(--line2);position:relative;transition:.2s}
.switch::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--ink2);transition:.2s}
.switch.on{background:var(--cinnabar)}
.switch.on::after{left:18px;background:#fff}

/* nav tabs */
nav.tabs{display:flex;gap:4px;flex-wrap:wrap;margin-top:2px}
.tab{
  background:transparent;border:1px solid transparent;border-bottom:none;
  color:var(--ink3);padding:9px 15px;font-size:13.5px;border-radius:8px 8px 0 0;
  position:relative;transition:.15s;letter-spacing:1px;
}
.tab:hover{color:var(--ink)}
.tab.active{color:var(--ink);background:var(--bg2);border-color:var(--line);}
.tab.active::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--cinnabar)}
.tab .n{font-family:var(--mono);font-size:11px;color:var(--cinnabar-g);margin-right:5px;opacity:.85}

main{margin-top:24px}
.panel{background:var(--bg2);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.panel-h{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
/* 花名册筛选/操作：桌面平铺（display:contents 让 .mem-tools 不生成盒子，孩子照常参与 panel-h 布局）；
   手机默认折叠、点「筛选」展开（见文件末尾手机块）。 */
.mem-tools{display:contents}
.mem-h .mem-ftoggle{display:none}   /* 加 .mem-h 提高优先级，压过 .btn 的 display */
.mem-search{max-width:190px}
.panel-h h2{font-family:var(--serif);font-size:18px;margin:0;letter-spacing:2px}
.panel-h .brush{width:34px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--cinnabar),transparent)}
.panel-b{padding:20px}
.muted{color:var(--ink3)}
.pill{font-size:11px;color:var(--ink2);background:var(--bg3);border:1px solid var(--line);padding:2px 9px;border-radius:20px}

/* buttons */
.btn{background:var(--bg3);color:var(--ink);border:1px solid var(--line2);padding:8px 14px;border-radius:9px;font-size:13px;transition:.15s;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.btn:hover{border-color:var(--ink3);background:var(--raise)}
.btn.pri{background:linear-gradient(160deg,var(--cinnabar),var(--cinnabar-d));border-color:var(--cinnabar-g);color:#fff5ee;font-weight:600}
.btn.pri:hover{filter:brightness(1.08)}
.btn.jade{background:linear-gradient(160deg,var(--jade),var(--jade-d));border-color:#7ab8a2;color:#f0fff8}
.btn.ghost{background:transparent}
.btn.sm{padding:5px 10px;font-size:12px}
.btn.danger{color:var(--cinnabar-g);border-color:var(--cinnabar-d)}
.btn.danger:hover{background:rgba(192,74,60,.14)}
.btn:disabled{opacity:.4;cursor:not-allowed}

/* forms */
label.f{display:block;font-size:12px;color:var(--ink2);margin-bottom:5px;letter-spacing:.5px}
input.i,select.s,textarea.t{
  width:100%;background:var(--bg);border:1px solid var(--line2);color:var(--ink);
  padding:9px 11px;border-radius:9px;font-size:13.5px;outline:none;transition:.15s;
}
input.i:focus,select.s:focus,textarea.t:focus{border-color:var(--cinnabar);box-shadow:0 0 0 3px rgba(192,74,60,.15)}
textarea.t{resize:vertical;min-height:90px;line-height:1.6;font-family:var(--mono);font-size:13px}
select.s{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238a7d62'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:30px}
.row{display:flex;gap:12px;flex-wrap:wrap}
.row>*{flex:1;min-width:130px}

/* tables */
table.tb{width:100%;border-collapse:collapse;font-size:13px}
table.tb th{text-align:left;color:var(--ink3);font-weight:600;font-size:11.5px;letter-spacing:1px;padding:10px 12px;border-bottom:1px solid var(--line2);white-space:nowrap;text-transform:uppercase}
table.tb td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
table.tb tr:hover td{background:rgba(255,255,255,.02)}
.tb .name{font-weight:600;letter-spacing:.5px}
.tb .alias{font-size:11px;color:var(--ink3)}

/* profession chip */
.chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;padding:2px 9px;border-radius:20px;border:1px solid var(--line2);white-space:nowrap}
.chip .dot{width:7px;height:7px;border-radius:50%}
.tag{font-size:10.5px;padding:1px 7px;border-radius:5px;border:1px solid var(--line2);color:var(--ink2)}
.tag.lead{color:var(--gold);border-color:var(--gold-d)}
.tag.off{color:var(--ink3);opacity:.7}

/* ---------- lineup / DnD ---------- */
.board{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.zone{background:var(--bg2);border:1px solid var(--line);border-radius:12px;min-height:120px;transition:.12s;display:flex;flex-direction:column}
.zone.drag-over{border-color:var(--cinnabar);box-shadow:0 0 0 3px rgba(192,74,60,.18) inset}
.zone-h{padding:11px 13px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;position:sticky;top:0}
.zone-h .zt{font-family:var(--serif);font-size:15px;letter-spacing:1px}
.zone-h .cnt{font-family:var(--mono);font-size:11px;color:var(--ink3);margin-left:auto}
.zone-body{padding:9px;display:flex;flex-direction:column;gap:7px;flex:1}
.pool{flex:1 1 260px;max-width:340px}
.team{flex:1 1 220px;min-width:210px}
.side{flex:1 1 220px;min-width:210px}
.zone.leave .zone-h{border-color:var(--leave)}
.zone.bench .zone-h .zt{color:var(--sub)}
.zone.leave .zone-h .zt{color:var(--leave)}

.mcard{
  background:var(--bg3);border:1px solid var(--line2);border-radius:9px;padding:8px 10px;
  cursor:grab;user-select:none;display:flex;align-items:center;gap:9px;transition:.12s;position:relative;
}
.mcard:hover{border-color:var(--ink3);background:var(--raise)}
.mcard.dragging{opacity:.35}
.mcard.sel{border-color:var(--cinnabar);box-shadow:0 0 0 2px rgba(192,74,60,.25)}
.mcard .mn{font-weight:600;font-size:13px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mcard .prof-sel{font-size:11px;background:var(--bg);border:1px solid var(--line2);color:var(--ink2);border-radius:6px;padding:2px 4px;max-width:82px}
.mcard .x{width:18px;height:18px;border-radius:5px;display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:13px;border:1px solid transparent}
.mcard .x:hover{color:var(--cinnabar-g);border-color:var(--cinnabar-d)}
.mcard.leave-c{opacity:.85;border-style:dashed}
.hint{font-size:11.5px;color:var(--ink3);padding:14px;text-align:center;border:1px dashed var(--line2);border-radius:8px;margin:6px}

/* ---------- calendar ---------- */
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal-dow{text-align:center;font-size:11px;color:var(--ink3);padding:6px 0;letter-spacing:2px}
.cal-cell{background:var(--bg);border:1px solid var(--line);border-radius:9px;min-height:88px;padding:6px 7px;cursor:pointer;transition:.12s;display:flex;flex-direction:column;gap:3px}
.cal-cell:hover{border-color:var(--line2);background:var(--bg3)}
.cal-cell.other{opacity:.35}
.cal-cell.today{border-color:var(--cinnabar)}
.cal-cell .dnum{font-family:var(--mono);font-size:13px;color:var(--ink2)}
.cal-cell.today .dnum{color:var(--cinnabar-g);font-weight:700}
/* 事件条：颜色/字色由 JS 的 evStyle() 给（淡底 + 亮字 + 描边），这儿别写死 color。
   标题**拆两行**（evLines：从 vs 起换行）—— 「四海 vs梦江南 横戈 3CW」一行在格子里只看得到开头。 */
.ev{position:relative;font-size:10.5px;padding:2px 6px;border-radius:5px;font-weight:600;line-height:1.35}
.ev+.ev{margin-top:2px}
.ev-l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev-l2{font-weight:500;opacity:.92}          /* 第二行（vs…）稍轻，让时间/前缀先被读到 */
/* 条右上角：数据都传好了的绿点（「补」字标试过太丑，砍了） */
.ev-marks{position:absolute;top:2px;right:3px;display:flex;gap:3px;align-items:center;line-height:1}
.ev-data{width:7px;height:7px;border-radius:50%;background:var(--jade);box-shadow:0 0 0 1.5px var(--bg2)}
/* 帮补名额报满了：划掉 —— 这事儿办完了，不用再点进去看。
   删除线要看得清（别把整条压太暗，否则划线也跟着糊掉，等于没划）。 */
.ev.done{opacity:.72}
.ev.done .ev-l{text-decoration:line-through;text-decoration-thickness:1.6px;text-decoration-color:currentColor}

/* ---------- charts ---------- */
.bar-row{display:flex;align-items:center;gap:10px;margin:6px 0;font-size:12.5px}
.bar-row .bl{width:92px;flex:0 0 92px;text-align:right;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-track{flex:1;height:20px;background:var(--bg);border-radius:5px;overflow:hidden;position:relative;border:1px solid var(--line)}
.bar-fill{height:100%;border-radius:4px;transition:width .5s cubic-bezier(.2,.8,.2,1)}
.bar-val{font-family:var(--mono);font-size:11.5px;color:var(--ink2);width:78px;flex:0 0 78px}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.stat{background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:14px}
.stat .sv{font-family:var(--mono);font-size:22px;color:var(--ink);font-weight:700}
.stat .sl{font-size:11.5px;color:var(--ink3);margin-top:2px;letter-spacing:1px}

/* ---------- modal ---------- */
.overlay{position:fixed;inset:0;background:rgba(8,6,4,.62);backdrop-filter:blur(3px);z-index:80;display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;overflow:auto}
/* #4：看原图 lightbox（页面内，不开新网页）。z-index 高过弹窗(80) */
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.92);overflow:auto;cursor:zoom-out;
  display:flex;align-items:flex-start;justify-content:center;padding:24px}
.lightbox-img{max-width:none;height:auto;cursor:default;border-radius:6px;box-shadow:0 8px 40px rgba(0,0,0,.6)}
.lightbox-x{position:fixed;top:14px;right:20px;width:44px;height:44px;border-radius:50%;font-size:30px;line-height:1;
  color:#fff;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;cursor:pointer}
.lightbox-x:hover{background:rgba(248,103,164,.6)}
.modal{background:var(--bg2);border:1px solid var(--line2);border-radius:16px;box-shadow:var(--shadow);width:100%;max-width:560px;animation:pop .18s ease}
.modal.wide{max-width:820px}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1}}
.modal-h{padding:16px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px}
.modal-h h3{font-family:var(--serif);font-size:17px;margin:0;letter-spacing:1px}
.modal-b{padding:20px;max-height:70vh;overflow:auto}
.modal-f{padding:14px 20px;border-top:1px solid var(--line);display:flex;gap:10px;justify-content:flex-end}
.close-x{margin-left:auto;background:none;border:none;color:var(--ink3);font-size:20px;line-height:1}
.close-x:hover{color:var(--ink)}

/* toast */
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:120;display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{background:var(--bg3);border:1px solid var(--line2);border-left:3px solid var(--cinnabar);padding:10px 16px;border-radius:9px;font-size:13px;box-shadow:var(--shadow);animation:tin .2s ease}
.toast.ok{border-left-color:var(--jade)}
@keyframes tin{from{opacity:0;transform:translateY(8px)}}

/* misc */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.match-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:9px;margin-bottom:6px;background:var(--bg)}
.match-row .raw{width:150px;flex:0 0 150px;font-size:12.5px;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.match-row .arrow{color:var(--ink3)}
.match-row select{flex:1}
.match-row select.rnd-sel{flex:0 0 106px}   /* 「第几把」选择器：窄，别跟成员下拉抢宽度 */
.conf{font-family:var(--mono);font-size:10.5px;padding:1px 6px;border-radius:5px;white-space:nowrap}
.conf.hi{color:var(--jade);border:1px solid var(--jade-d)}
.conf.mid{color:var(--gold);border:1px solid var(--gold-d)}
.conf.lo{color:var(--cinnabar-g);border:1px solid var(--cinnabar-d)}
.empty{text-align:center;padding:50px 20px;color:var(--ink3)}
.empty .big{font-family:var(--serif);font-size:26px;color:var(--ink2);margin-bottom:8px;letter-spacing:3px}
.readonly-lock{display:none}
body.locked .needs-admin{display:none!important}
body.locked .readonly-lock{display:flex}
@media (max-width:720px){.grid2{grid-template-columns:1fr}.topinner{padding:12px}}
@media print{header.top,nav.tabs,.needs-admin{display:none}}

/* sync status dot (server connection) */
.sync-dot{width:9px;height:9px;border-radius:50%;background:#7f8fa6;display:inline-block;flex:0 0 9px;box-shadow:0 0 0 3px rgba(255,255,255,.04);transition:background .2s}

/* ===== 全部人员 分组标签 ===== */
.gbadge{display:inline-block;padding:1px 7px;border-radius:10px;color:#fff;font-size:11px;line-height:1.6;white-space:nowrap}

/* ===== 对战数据 ===== */
.subnav{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.subnav .sb{padding:6px 14px;border:1px solid var(--line);background:var(--paper);border-radius:8px;cursor:pointer;font-size:13px;color:var(--ink2)}
.subnav .sb.active{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.vs-head{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:6px}
.vs-side{font-weight:700;font-size:16px}
.vs-mid{color:var(--vermilion);font-weight:700}
.cmp-row{display:grid;grid-template-columns:120px 1fr 64px 1fr 120px;align-items:center;gap:10px;margin:7px 0;font-size:13px}
.cmp-bar{height:16px;border-radius:4px;position:relative;overflow:hidden;background:rgba(0,0,0,.05)}
.cmp-bar>i{position:absolute;top:0;bottom:0;display:block}
.cmp-bar.l>i{right:0;background:#c9a24e}
.cmp-bar.r>i{left:0;background:#5f9c85}
.cmp-num{font-family:var(--mono);font-size:12px;color:var(--ink2)}
.cmp-num.l{text-align:right}
.cmp-label{text-align:center;font-weight:600;color:var(--ink)}
.cmp-win{color:var(--vermilion)}

/* ===== 过往排表网格 ===== */
.grid-wrap{overflow:auto;border:1px solid var(--line);border-radius:8px;max-height:72vh}
table.grid{border-collapse:collapse;font-size:12px;white-space:nowrap}
table.grid td{border:1px solid var(--line);padding:3px 8px;min-width:52px;color:var(--ink)}
table.grid td.hd{background:var(--wash);font-weight:700;color:var(--ink)}
table.grid td.team{font-weight:700;background:rgba(201,162,78,.10)}
table.grid td.mut{color:var(--ink3)}

/* ============================================================
   深色紫蓝主题（覆盖变量）+ 帮战排表 团/小队 布局
   ============================================================ */
:root{
  --bg:#080b14; --bg2:#111726; --bg3:#161d30; --raise:#1b2338;
  --paper:#e8ebf5; --ink:#e9ecf6; --ink2:#9aa4c0; --ink3:#697291;
  --line:#222b40; --line2:#313c5c;
  --cinnabar:#ef5a6a; --cinnabar-d:#c8434f; --cinnabar-g:#ff7d89;
  --jade:#43d0a3; --jade-d:#2fb389;
  --gold:#e0b24e; --gold-d:#b98f34;
  --purple:#7b6bff; --purple-d:#5b48e6; --blue:#3f7bff; --blue-d:#2f63e0;
  --leave:#8590ad; --sub:#e0a24e;
  --shadow:0 14px 40px rgba(0,0,0,.6);
}
body{
  background:var(--bg);
  background-image:
    radial-gradient(1100px 460px at 82% -12%, rgba(123,107,255,.16), transparent 60%),
    radial-gradient(900px 480px at -8% 108%, rgba(63,123,255,.12), transparent 55%);
}
header.top{background:rgba(10,13,22,.9)}
.sealmark{ background:linear-gradient(160deg,var(--purple),var(--purple-d)); border-color:rgba(123,107,255,.55);
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.08), var(--shadow); }
.tab.active::after{background:var(--purple)}
.tab .n{color:var(--purple)}
.switch.on{background:var(--cinnabar)}
.btn.pri,.btn.jade{background:linear-gradient(135deg,var(--purple),var(--purple-d));border-color:transparent;color:#fff}
.btn.pri:hover,.btn.jade:hover{filter:brightness(1.08)}
::selection{background:var(--purple);color:#fff}
.gbadge{color:#fff}

/* 顶部控制条 */
.lc-top{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.lc-count{display:flex;flex-direction:column;line-height:1.2}
.lc-count b{font-size:20px;font-family:var(--mono);color:#fff}
.lc-count .muted{font-size:11px}
.lfield{display:flex;flex-direction:column;gap:3px}
.lfield label{font-size:11px;color:var(--ink3)}
.lfield .i{max-width:180px}

/* 主区 + 侧栏 */
.lc-layout{display:grid;grid-template-columns:1fr 340px;gap:16px;align-items:start}
@media(max-width:940px){ .lc-layout{grid-template-columns:1fr} }
.lc-main{min-width:0}

/* 团面板 */
.team-panel{background:linear-gradient(180deg,rgba(123,107,255,.06),transparent 40%),var(--bg2);
  border:1px solid var(--line);border-left:4px solid var(--purple);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.team-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.drag-handle{color:var(--ink3);cursor:grab;font-weight:700;letter-spacing:-2px}
.team-name{font-size:16px;font-weight:700;color:#fff;cursor:pointer}
.team-edit{color:var(--ink3);cursor:pointer;font-size:13px}
.team-edit:hover{color:var(--purple)}
.team-cnt{font-size:12px;color:var(--ink2);font-family:var(--mono)}
.team-del{color:var(--ink3);cursor:pointer;font-size:18px;line-height:1;padding:0 4px}
.team-del:hover{color:var(--cinnabar)}

/* 小队网格 */
.squad-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
@media(max-width:1200px){ .squad-grid{grid-template-columns:repeat(3,1fr)} }
@media(max-width:640px){ .squad-grid{grid-template-columns:repeat(2,1fr)} }
.squad{background:rgba(38,58,102,.20);border:1px solid #2a3c66;border:1px solid #2a3c66;border-radius:10px;
  min-height:118px;display:flex;flex-direction:column;transition:.12s}
.squad.drag-over{border-color:var(--purple);background:rgba(123,107,255,.12);box-shadow:0 0 0 2px rgba(123,107,255,.3) inset}
.squad.full{border-color:var(--jade-d)}
.squad-h{display:flex;align-items:center;justify-content:space-between;padding:7px 9px}
.squad-t{background:linear-gradient(135deg,var(--blue),var(--blue-d));color:#fff;font-size:12px;font-weight:700;padding:2px 9px;border-radius:6px}
.squad-c{font-size:12px;color:var(--ink2);font-family:var(--mono)}
.squad-b{flex:1;padding:4px 7px 9px;display:flex;flex-direction:column;gap:5px;min-height:60px}
.squad-hint{flex:1;display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:12px;text-align:center;padding:10px 4px}

/* 成员 chip */
.pchip{display:flex;align-items:center;gap:6px;background:var(--raise);border:1px solid var(--line2);
  border-radius:8px;padding:4px 7px;cursor:grab;user-select:none;transition:.1s}
.pchip:hover{border-color:var(--purple)}
.pchip.sel{border-color:var(--purple);box-shadow:0 0 0 2px rgba(123,107,255,.35)}
.pchip.dragging{opacity:.4}
.pchip.leave{opacity:.6}
.pchip .dot{width:9px;height:9px;border-radius:50%;flex:0 0 9px}
.pchip .pn{flex:1;font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:96px}
.pchip .pp{font-size:11px;color:var(--ink2);white-space:nowrap}
.pchip .lv{font-size:10px;background:var(--leave);color:#fff;border-radius:4px;padding:0 4px}
.pchip .px{color:var(--ink3);cursor:pointer;font-size:13px;padding:0 2px}
.pchip .px:hover{color:var(--cinnabar)}

/* 添加团 */
.lc-addteam{width:100%;background:transparent;border:1.5px dashed var(--line2);color:var(--ink2);
  border-radius:12px;padding:16px;font-size:14px}
.lc-addteam:hover{border-color:var(--purple);color:var(--purple)}

/* 待选池侧栏 */
.lc-side{position:sticky;top:96px}
.pool-panel{border-radius:14px}
.pool-h{display:flex;align-items:center;gap:6px}
.pool-t{font-size:15px;font-weight:700;color:#fff}
.pool-n{color:var(--purple);font-family:var(--mono)}
.pool-hint{font-size:11.5px;color:var(--ink3);background:rgba(63,123,255,.07);border:1px solid var(--line);
  border-radius:8px;padding:8px 10px;margin-bottom:10px}
.pool-b{display:flex;flex-direction:column;gap:6px;min-height:120px;max-height:52vh;overflow:auto;
  border:1px dashed transparent;border-radius:8px;padding:2px}
.pool-b.drag-over{border-color:var(--purple);background:rgba(123,107,255,.08)}
.pool-empty{color:var(--ink3);text-align:center;padding:28px 8px;font-size:13px;white-space:pre-line}
.jl-btn{width:100%;margin-top:12px;display:flex;align-items:center;justify-content:space-between;
  background:var(--bg3);border:1px solid var(--line2);color:var(--ink);font-weight:700;padding:12px 14px;border-radius:10px}
.jl-btn:hover{border-color:var(--purple)}
.jl-ar{color:var(--purple)}

/* 弹窗内的选人行 */
.pick-row{display:flex;align-items:center;gap:8px;padding:5px 8px;border:1px solid var(--line);border-radius:7px;background:var(--bg2)}
.pick-row .dot{width:9px;height:9px;border-radius:50%;flex:0 0 9px}

/* 小队 增/删 */
.squad-del{color:var(--ink3);cursor:pointer;font-size:15px;line-height:1;padding:0 2px}
.squad-del:hover{color:var(--cinnabar)}
.squad-add{border:1.5px dashed var(--line2);border-radius:10px;min-height:118px;display:flex;
  flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--ink2);cursor:pointer}
.squad-add:hover{border-color:var(--purple);color:var(--purple)}

/* ===== 本次排表 · 浅色成品表 ===== */
.sheet-wrap{background:#fff;border-radius:10px;padding:14px;overflow:auto}
.sheet-cols{display:flex;gap:16px;align-items:flex-start;min-width:min-content}
table.sheet-t{border-collapse:collapse;background:#fff;color:#222}
.sheet-t td{border:1px solid #cfd4dc;padding:3px 8px;white-space:nowrap;font-size:12.5px}
.sheet-t .team-hdr{text-align:center;font-weight:800;font-size:15px;padding:8px 6px;letter-spacing:1px}
.sheet-t .sub-hdr td{background:#f2f4f7;text-align:center;font-weight:700;color:#475467}
.sheet-t .sub-hdr .corner{background:#f2f4f7}
.sheet-t .sq-label{background:#fff;text-align:center;vertical-align:middle;min-width:52px}
.sheet-t .sq-n{font-size:13px;font-weight:700;color:#111}
.sheet-t .sq-note{border:none;background:transparent;text-align:center;font-size:11px;color:#667085;width:52px;margin-top:2px}
.sheet-t .c-id{font-weight:600;min-width:80px;color:#111}
.sheet-t .c-profcell{padding:0;text-align:center;min-width:52px}
.sheet-t .c-prof{border:none;background:transparent;font-size:12.5px;color:#1a1a1a;font-weight:600;text-align:center;text-align-last:center;padding:3px 2px;width:100%;-webkit-appearance:none;appearance:none;cursor:pointer}
.sheet-t .c-in{border:none;background:transparent;font-size:12.5px;color:#222;width:100%;min-width:120px;padding:2px}
.sheet-t .c-in::placeholder{color:#c0c4cc}
.sheet-t .c-in:focus,.sheet-t .c-prof:focus,.sheet-t .sq-note:focus{outline:1.5px solid var(--purple);background:#f3f1ff;border-radius:3px}
.sheet-t .c-empty{background:#fafbfc}
/* 成品表：代打/两把顶替那格 —— 浅底高亮 + 顶上一行小字（跟出图一致） */
.sheet-t td.c-hint{background:#fff3cf}
.sheet-t .c-subhint{font-size:10px;color:#8a6a00;font-weight:700;line-height:1.3;padding:1px 2px 0}
.comp-wrap{display:flex;flex-wrap:wrap;gap:6px}
.comp-chip{color:#2a2a2a;border-radius:6px;padding:3px 10px;font-size:12.5px}
.comp-chip b{font-family:var(--mono);margin-left:2px}

/* 团头 进攻/防守 徽标 */
.kind-badge{font-size:11px;font-weight:700;padding:1px 8px;border-radius:5px;cursor:pointer;user-select:none}
.kind-badge.atk{background:rgba(224,178,78,.18);color:var(--gold);border:1px solid rgba(224,178,78,.4)}
.kind-badge.def{background:rgba(67,208,163,.16);color:var(--jade);border:1px solid rgba(67,208,163,.4)}

/* 只读模式隐藏成品表里的编辑光标 */
body.locked .sheet-t input,body.locked .sheet-t select{pointer-events:none}

/* ===== 排表：请假标红 / 补员 / 职业底色 / 封存 ===== */
.pchip .pp-prof{font-size:11px;font-weight:700;color:#222;border-radius:5px;padding:1px 6px;flex:0 0 auto}
.pchip .pn{flex:1;font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:130px}
/* 补人卡片的 ID 可点改：虚下划线提示；点开变输入框 */
.pchip .pn.pn-edit{cursor:text;border-bottom:1px dashed color-mix(in srgb,var(--gold) 55%,transparent)}
.pchip .pn.pn-edit:hover{border-bottom-color:var(--gold)}
.pchip .pn-inp{flex:1;min-width:0;max-width:96px;font-size:13px;font-family:inherit;color:var(--ink);
  background:var(--bg2);border:1px solid var(--purple);border-radius:5px;padding:0 5px;outline:none}
/* 「添加待选成员」弹窗里的勾选行 */
.add-cb{display:flex;align-items:flex-start;gap:8px;margin-top:10px;font-size:13px;cursor:pointer;line-height:1.5}
.add-cb input{margin-top:3px;flex:0 0 auto;width:15px;height:15px;accent-color:var(--purple)}
.add-cb span{color:var(--ink2)}
/* 输入型筛选的下拉结果（代打人等）：搜到才展开，不一次全列 */
.combo-list{max-height:190px;overflow:auto;margin-top:4px;border-radius:8px;background:var(--bg1);
  box-shadow:inset 0 0 0 1px var(--line)}
.combo-item{padding:6px 10px;cursor:pointer;font-size:13px;color:var(--ink);border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent)}
.combo-item:last-child{border-bottom:none}
.combo-item:hover{background:color-mix(in srgb,var(--purple) 16%,transparent)}
.pchip.leave{background:rgba(239,90,106,.16);border-color:var(--cinnabar)}
.pchip.leave .pn{color:var(--cinnabar-g);text-decoration:line-through}
.pchip.sub{border-color:var(--gold)}
.pchip .sub-badge{font-size:10px;font-weight:700;background:var(--gold);color:#3a2a08;border-radius:4px;padding:0 5px}
/* 代打标记：号主请假时帮内谁在替他上号。展开=「代 名字」，未设=一个「代」按钮（管理点开选人） */
.pchip .pilot{font-size:10px;font-weight:700;margin-left:2px;border-radius:5px;padding:0 5px;white-space:nowrap;
  color:var(--purple);background:color-mix(in srgb,var(--purple) 15%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--purple) 38%,transparent)}
.pchip .pilot.edit{cursor:pointer}
.pchip .pilot.add{color:var(--ink3);background:transparent;opacity:.55;cursor:pointer;box-shadow:inset 0 0 0 1px var(--line)}
.pchip .pilot.add:hover{opacity:1;color:var(--purple);background:color-mix(in srgb,var(--purple) 12%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--purple) 45%,transparent)}
/* 「第X把顶替」徽章/按钮：用琥珀色（跟「只缺一把」一系），区别于紫色的代打 */
.pchip .rsub{font-size:10px;font-weight:700;margin-left:2px;border-radius:5px;padding:0 5px;white-space:nowrap;
  color:var(--gold);background:color-mix(in srgb,var(--gold) 16%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gold) 42%,transparent)}
.pchip .rsub.edit{cursor:pointer}
.pchip .rsub.need{cursor:pointer;opacity:.9}
.pchip .rsub.need:hover{opacity:1;background:color-mix(in srgb,var(--gold) 24%,transparent)}
/* 轮换「②代?」：每张小队卡都有一个，默认做得很淡，别吵；hover / 悬停卡片时提亮 */
.pchip .rsub.rot{cursor:pointer;opacity:.32;font-weight:600}
.pchip:hover .rsub.rot{opacity:.7}
.pchip .rsub.rot:hover{opacity:1;background:color-mix(in srgb,var(--gold) 24%,transparent)}
/* 老板号：号主不玩、每场代打。花名册里给金色「老板」标；排表卡片窄，改用左侧金条 + 金色代打钮表示（省横向空间、名字不被挤没）。 */
/* #4：老板号标改成库洛米紫粉渐变（原来是金色，跟主题不搭） */
.boss-badge{display:inline-block;font-size:10px;font-weight:800;
  background:linear-gradient(135deg,#f867a4,#a25bf0);color:#fff;border-radius:5px;padding:1px 7px;
  letter-spacing:.5px;white-space:nowrap;box-shadow:0 1px 4px rgba(162,91,240,.45)}
.pchip.boss{box-shadow:inset 3px 0 0 #a25bf0}
/* 代打钮颜色统一（不分借号/老板号）：设了=紫色「代 XX」(.pilot)，没设=淡框「代?/代」(.pilot.add)。
   老板号的身份靠左侧金条区分，不再给代打钮单独上金色。「代?」没派人时提示更实一点。 */
.pchip .pilot.add.need{opacity:.85}
.pchip .pilot.add.need:hover{opacity:1}
/* #15：待选池里的「代」按钮默认藏起来，hover 卡片才露（别满池子都是「代」太吵）；老板号的「代?」照常显示提醒 */
.pchip.inpool .pilot.add:not(.need){opacity:0;transition:opacity .12s}
.pchip.inpool:hover .pilot.add:not(.need){opacity:.7}
.pchip.inpool:hover .pilot.add:not(.need):hover{opacity:1}
.btn.ow-toggle.boss-toggle.on{color:var(--gold);border-color:var(--gold);background:color-mix(in srgb,var(--gold) 15%,transparent)}
.btn.ow-toggle.boss-toggle.on:hover{color:var(--gold);border-color:var(--gold)}
.lb-chip.pick.on{outline:2px solid var(--purple);outline-offset:1px}
.squad-lbl{font-size:10.5px;color:var(--ink3);margin-left:6px;background:rgba(63,123,255,.12);padding:0 6px;border-radius:4px}

.seal-tag{font-size:12px;font-weight:700;color:var(--jade);background:rgba(67,208,163,.14);border:1px solid rgba(67,208,163,.4);padding:4px 10px;border-radius:8px}
.warn-banner{background:rgba(224,178,78,.12);border:1px solid rgba(224,178,78,.45);color:var(--sub);
  border-radius:10px;padding:10px 14px;margin-bottom:14px;font-size:13px}
.seal-mini{font-size:11px;color:var(--jade);margin-left:8px}
.seal-mini.open{color:var(--sub)}

/* 成品表 请假标红/补 */
/* 请假不再红底+删除线；补/假 都用括号，灰色小字（跟出图一致） */
.sheet-t .c-tag{font-size:11px;color:#8a8f99;margin-left:2px}

/* ===== 待选池 · 请假名单折叠区 ===== */
.leave-sec{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
.leave-h{display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none;padding:6px 8px;
  border-radius:8px;color:var(--ink2);font-size:13px}
.leave-h:hover{background:rgba(239,90,106,.08);color:var(--ink)}
.leave-h .lh-caret{color:var(--cinnabar);font-size:11px;width:12px}
.leave-h .lh-t{font-weight:700;color:var(--cinnabar-g)}
.leave-h .lh-n{color:var(--ink3);font-family:var(--mono)}
.leave-h.open{background:rgba(239,90,106,.06)}
.leave-b{display:flex;flex-direction:column;gap:6px;margin-top:8px;max-height:38vh;overflow:auto;
  padding:2px;border-left:2px solid rgba(239,90,106,.3);padding-left:8px}

/* ============================================================
   库洛米主题（深紫黑 + 粉）—— 覆盖为最终配色
   · 立体感取自吉伊卡哇：粗描边 + 位移实心投影（--hard / --soft）。
     注意：深色底上硬投影必须用亮色，黑投影会直接消失。
   · 护眼三件事，别退回去：底色不用纯黑（#0f0c17）、正文不用纯白（#ede3f9）、
     职业色统一降过饱和 —— 纯黑配纯白会产生光晕，高饱和色块堆一起是色彩噪音。
   · 「本次排表」成品表 + canvas 出图保持浅色（要发微信群），见 .sheet-* 与 PROF_SHEET。
   ============================================================ */
:root{
  --bg:#0f0c17; --bg2:#201732; --bg3:#2a1f40; --raise:#332648;
  --paper:#ffffff; --ink:#ede3f9; --ink2:#bbaed0; --ink3:#86779f;
  --line:#2e2545; --line2:#453a63;
  --cinnabar:#f44471; --cinnabar-d:#c93a5e; --cinnabar-g:#f66a8d;
  --jade:#50d580; --jade-d:#3fae68;
  --gold:#efb92e; --gold-d:#c69a26;
  --purple:#f867a4; --purple-d:#824ae2;   /* --purple 沿用旧变量名，实为「强调色」= 库洛米粉 */
  --blue:#64a3f1; --blue-d:#4a86d4;
  --leave:#f44471; --sub:#efb92e;
  --hard:#53279b; --soft:#361a67;         /* 描边 + 硬投影 */
  --shadow:0 14px 40px rgba(0,0,0,.5);
  --sans:ui-rounded,"SF Pro Rounded",-apple-system,"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Noto Sans SC",system-ui,sans-serif;
}
body{
  color:var(--ink); background:var(--bg);
  background-image:
    radial-gradient(circle at 12% 15%, rgba(155,125,205,.17), transparent 33%),
    radial-gradient(circle at 88% 10%, rgba(215,135,180,.135), transparent 35%),
    radial-gradient(circle at 72% 88%, rgba(135,105,195,.153), transparent 39%),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.42) 0 1px, transparent 1.5px),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.25) 0 .8px, transparent 1.2px);
  background-size:auto,auto,auto,110px 110px,63px 63px;
  background-position:0 0,0 0,0 0,0 0,32px 41px;
  background-attachment:fixed;
}
::selection{background:var(--purple);color:#fff}
header.top{background:rgba(15,12,23,.86);border-bottom:2px solid var(--hard)}
.title h1,.panel-h h2{font-family:var(--sans);font-weight:800;letter-spacing:.02em}
.panel-h h2{background:linear-gradient(100deg,#f6f1fc 20%,#f78bbe 55%,#c08ef0 85%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sealmark{background:linear-gradient(160deg,var(--purple-d),var(--purple));border:0;
  box-shadow:0 0 0 1.75px var(--hard),1.75px 1.75px 0 var(--soft)}
.pill{background:rgba(210,150,190,.14);color:#f7a3c9;border:1.75px solid var(--hard);
  box-shadow:1.75px 1.75px 0 var(--soft);font-weight:700}

/* 页签：吉伊卡哇式胶囊，选中的凸起 */
nav.tabs{gap:5px}
.tab{border:1.75px solid transparent;border-radius:980px;color:var(--ink3);letter-spacing:0;font-weight:600}
.tab:hover{color:var(--ink);border-color:rgba(158,136,196,.26);background:transparent}
.tab.active{background:linear-gradient(135deg,var(--purple-d),var(--purple));color:#fff;
  border:1.75px solid var(--hard);box-shadow:2.5px 2.5px 0 var(--hard)}
.tab.active::after{display:none}
.tab .n{color:inherit;opacity:.55}

/* 卡片 / 按钮：粗描边 + 硬投影，按下去位移 */
.panel{background:var(--bg2);border:2px solid var(--hard);border-radius:19px;box-shadow:4.5px 4.5px 0 var(--soft)}
.btn{background:var(--bg3);border:1.75px solid var(--line2);box-shadow:1.75px 1.75px 0 var(--soft);
  transition:none;font-weight:600}
.btn:hover{border-color:var(--purple);color:var(--purple);background:var(--bg3)}
.btn:active{transform:translate(1.75px,1.75px);box-shadow:none}
.btn.pri,.btn.jade{background:linear-gradient(135deg,var(--purple-d),var(--purple));color:#fff;
  border:2.25px solid var(--hard);box-shadow:2.5px 2.5px 0 var(--hard);font-weight:800}
.btn.pri:hover,.btn.jade:hover{filter:brightness(1.09);color:#fff;border-color:var(--hard)}
.btn.pri:active,.btn.jade:active{transform:translate(2.5px,2.5px);box-shadow:none}
.btn.ghost{background:transparent}
.btn.danger{color:var(--cinnabar-g);border-color:var(--cinnabar-d)}
.btn.danger:hover{background:rgba(244,68,113,.14);color:var(--cinnabar-g);border-color:var(--cinnabar)}
.admin-toggle{border:1.75px solid var(--hard);box-shadow:1.75px 1.75px 0 var(--soft);font-weight:600}
.switch{background:var(--line2)}
.switch.on{background:var(--purple)}

/* 表单：深色底 + 自绘下拉箭头（基础样式那个箭头是深褐色，深色底下看不见） */
input.i,select.s,textarea.t{background:rgba(255,255,255,.045);color:var(--ink);
  border:1.75px solid var(--line2);border-radius:11px}
input.i::placeholder,textarea.t::placeholder{color:var(--ink3)}
input.i:focus,select.s:focus,textarea.t:focus{border-color:var(--purple);box-shadow:0 0 0 3px rgba(248,103,164,.2)}
/* 上面用了 background 简写，会把基础样式里的 no-repeat / position 一并重置 —— 必须补回来，
   否则这个箭头 SVG 会平铺成斜纹布铺满整个下拉框。 */
select.s{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2386779f'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:30px}

/* 表格：表头与内容全部居中；数字等宽对齐 */
table.tb th,table.tb td{text-align:center}
table.tb th{text-transform:none;letter-spacing:.05em;font-weight:700;background:rgba(158,136,196,.06)}
/* #4：花名册 / 查号记录 —— 表体内部滚动，表头定住（背景须不透明，否则滚动时透出下面的行） */
.tbl-stick table.tb thead th{position:sticky;top:0;z-index:6;
  background:color-mix(in srgb,var(--purple) 9%,var(--bg2));
  box-shadow:0 1px 0 var(--line2)}
table.tb td{border-bottom:1px solid rgba(158,136,196,.08)}
table.tb tr:hover td{background:rgba(210,150,190,.06)}
.tb .name{letter-spacing:0}

/* 排表：团 / 小队 */
.team-panel{background:linear-gradient(180deg,rgba(248,103,164,.07),transparent 42%),var(--bg2);
  border:1.75px solid var(--hard);border-left:4px solid var(--purple);box-shadow:2.5px 2.5px 0 var(--soft)}
.team-name{color:var(--ink)}
.squad{background:rgba(255,255,255,.03);border:1.75px solid var(--line)}
/* 满员「不做任何标记」是故意的：该抢注意力的是「没满」，那个已经由计数标红加粗表达了。
   给满员加高亮（绿框/绿底）会把一整屏正常的队都点亮，噪音全落在「一切正常」上，正好反了。
   注意这里必须显式写回和 .squad 一样的值 —— 前面第 298 行还有个
   `.squad.full{border-color:var(--jade-d)}`，空规则压不住它。
   .full 这个 class 仍然由 app.js 挂着，以后要用时可以接手。 */
.squad.full{border-color:var(--line);background:rgba(255,255,255,.03)}
.squad.drag-over{border-color:var(--purple);background:rgba(248,103,164,.12);box-shadow:0 0 0 2px rgba(248,103,164,.3) inset}
/* 拖小队换序：跟「拖成员进队」用不同颜色区分（紫=换序，粉=放人） */
.squad.sq-over{border-color:var(--purple-d);background:rgba(130,74,226,.16);box-shadow:0 0 0 2px rgba(130,74,226,.45) inset}
.squad.sq-dragging{opacity:.4}
.sq-grip{font-size:13px;margin-right:1px}
.sq-grip:active{cursor:grabbing}
.squad-t{background:linear-gradient(135deg,var(--purple-d),var(--purple));color:#fff}
.squad-c{color:var(--ink2)}
.squad-c.warn{color:var(--cinnabar);font-weight:800}
.squad-add{border-color:var(--line2)}
.squad-add:hover{border-color:var(--purple);color:var(--purple)}
.squad-lbl{background:rgba(80,213,128,.16);color:var(--jade)}

/* 成员 chip */
.pchip{background:var(--bg3);border:1.5px solid var(--line2)}
.pchip:hover{border-color:var(--purple)}
.pchip.sel{border-color:var(--purple);box-shadow:0 0 0 2px rgba(248,103,164,.3)}
.pchip .pn{color:var(--ink)}
.pchip.leave{background:rgba(244,68,113,.14);border-color:var(--cinnabar)}
.pchip.leave .pn{color:var(--cinnabar-g)}
/* 橙武：名字下橙色下划线。这里用 text-decoration-line 而非简写 —— 请假的人是 line-through，
   两者要能叠在同一个人身上（既请假又有橙武），简写会互相整个覆盖掉。 */
.pchip .pn.ow{text-decoration-line:underline;text-decoration-color:#ff9d3c;
  text-decoration-thickness:2px;text-underline-offset:2px}
.pchip.leave .pn{text-decoration-line:line-through}
.pchip.leave .pn.ow{text-decoration-line:underline line-through}
.pchip.sub{border-color:var(--gold)}
.pchip .pp-prof{color:inherit}   /* 颜色由 profChipStyle 内联给 */
.pchip .pp-prof.dual{box-shadow:0 0 0 1.5px var(--purple) inset}

/* 待选池 / 子导航 / 添加 */
.pool-t{color:var(--ink)}
.pool-hint{background:rgba(130,74,226,.1);border-color:var(--line)}
.jl-btn{background:var(--bg3);border-color:var(--line2)}
.jl-btn:hover{border-color:var(--purple)}
.jl-ar{color:var(--purple)}
.lc-addteam{border-color:var(--line2)}
.lc-addteam:hover{border-color:var(--purple);color:var(--purple)}
.lc-count b{color:var(--ink)}
.subnav .sb{background:var(--bg3);border:1.75px solid var(--line2);box-shadow:1.75px 1.75px 0 var(--soft)}
.subnav .sb.active{background:var(--purple);color:#fff;border-color:var(--hard)}
.cmp-bar{background:rgba(255,255,255,.06)}
.cmp-bar.l>i{background:var(--purple)}
.cmp-bar.r>i{background:var(--jade)}

/* 徽标 */
.kind-badge.atk{background:rgba(239,185,46,.16);color:var(--gold);border:1px solid rgba(239,185,46,.4)}
.kind-badge.def{background:rgba(80,213,128,.16);color:var(--jade);border:1px solid rgba(80,213,128,.4)}
.seal-tag{color:var(--jade);background:rgba(80,213,128,.14);border-color:rgba(80,213,128,.4)}
.sync-dot{box-shadow:0 0 0 3px rgba(255,255,255,.05)}
.gbadge{color:inherit}   /* 颜色由 groupChipStyle 内联给 */

/* 全部人员：出勤 / 状态 / 请假记录 */
.att-cell{font-family:var(--mono);font-size:12.5px;font-variant-numeric:tabular-nums}
.att-good{color:var(--jade)}
.att-mid{color:var(--gold)}
.att-low{color:var(--cinnabar)}
.st-sel{font-size:12px;padding:2px 6px;border-radius:6px;border:1.5px solid var(--line2);
  background:var(--bg3);color:var(--ink)}
.st-正常{color:var(--ink2)}
.st-不在帮会{color:var(--ink3)}
.st-长期请假{color:var(--gold)}
.st-退出{color:var(--ink3)}
.st-sel.st-退出{opacity:.7}
.quit-toggle{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--ink2);
  cursor:pointer;user-select:none;white-space:nowrap}
.quit-toggle input{accent-color:var(--purple)}
/* 编辑成员：橙武开关，默认 ✗（灰），点亮为 ✓（橙） */
.btn.ow-toggle{width:100%;justify-content:center;font-weight:700;color:var(--ink3)}
.btn.ow-toggle.on{color:#ff9d3c;border-color:#ff9d3c;background:rgba(255,157,60,.14)}
.btn.ow-toggle.on:hover{color:#ff9d3c;border-color:#ff9d3c}
/* 橙武：游戏名下加橙色下划线（不占列）。用 text-decoration 而不是 border-bottom ——
   .name 是块级，border 会横贯整个单元格；text-decoration 自动只贴着文字。 */
.tb .name.ow{text-decoration:underline;text-decoration-color:#ff9d3c;
  text-decoration-thickness:2px;text-underline-offset:3px}
.rec-table td{padding:5px 10px;border-bottom:1px solid var(--line);font-size:13px}
.rec-att{color:var(--jade)}
.rec-leave{color:var(--cinnabar)}
.rec-absent{color:var(--ink3)}

/* 全部人员：职业胶囊 / 主职业人数 —— 底色与字色由 profChipStyle 内联，这里只管几何 */
.prof-sel-cell,.prof-badge{display:inline-block;border:none;border-radius:8px;padding:2px 8px;
  font-size:11.5px;font-weight:600;line-height:1.5;white-space:nowrap;text-align:center;text-align-last:center;
  -webkit-appearance:none;appearance:none}
.prof-sel-cell{cursor:pointer}
.prof-sel-cell:focus{outline:1.5px solid var(--purple)}
.prof-sel-cell option{background:var(--bg2);color:var(--ink)}
.prof-counts{display:flex;gap:5px;flex-wrap:wrap;align-items:center;width:100%;padding-top:2px}
.prof-count{display:inline-flex;align-items:center;gap:5px;border-radius:8px;padding:2px 9px 2px 5px;
  font-size:11px;font-weight:700;line-height:1.5;white-space:nowrap;cursor:pointer;user-select:none}
.prof-count b{font-weight:800;font-variant-numeric:tabular-nums}
.prof-count .pc-ic{width:16px;height:16px;object-fit:contain;flex:0 0 auto}
.prof-count:hover{filter:brightness(1.25)}
/* 选中态：图标区变亮 + 外描边。用 outline 而不是 border —— border 会撑宽，一排胶囊会跳。 */
.prof-count.on{outline:1.5px solid currentColor;outline-offset:1px;filter:brightness(1.3)}

/* 全部人员：可排序表头 */
table.tb th.sortable{cursor:pointer;user-select:none}
table.tb th.sortable:hover{color:var(--ink)}
table.tb th.sorted{color:var(--purple)}
table.tb th .sort-ind{margin-left:3px;font-size:9px;opacity:.3}
table.tb th.sorted .sort-ind{opacity:1}

/* 本次排表预览：与成品图一致（团间无缝、字段居中）。整块保持浅色，勿跟随主题。 */
.sheet-cols{gap:0}
.sheet-t+.sheet-t{margin-left:-1px}
.sheet-t .c-id{text-align:center}
.sheet-t .c-in{text-align:center}
.sheet-t .sq-note{text-align:center}

/* 对战数据 · BO 选项卡 */
.bo-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border:1.75px solid var(--line2);
  background:var(--bg3);border-radius:8px;cursor:pointer;font-size:13px;color:var(--ink2);
  box-shadow:1.75px 1.75px 0 var(--soft)}
.bo-chip.active{background:var(--purple);color:#fff;border-color:var(--hard)}
.bo-inp{width:52px;border:none;background:transparent;color:inherit;font-size:13px;font-weight:700;padding:0}
.bo-inp:focus{outline:none;text-decoration:underline}
.bo-chip .bo-x{opacity:.7;font-size:14px;padding:0 2px}
.bo-chip .bo-x:hover{opacity:1;color:var(--cinnabar)}
.bo-chip.active .bo-x:hover{color:#fff}

/* 弹窗 */
.modal{background:var(--bg2);border:2px solid var(--hard);box-shadow:4.5px 4.5px 0 var(--soft),var(--shadow)}
.overlay{background:rgba(10,7,18,.7)}

/* ============================================================
   浅色版（库洛米浅色）—— 由右上角开关切换，挂在 <html data-theme="light">
   深色是默认（上面那块）。这里只覆盖「变量」+「少数把颜色写死的规则」。
   注意：职业胶囊的颜色不在这里 —— 那是 app.js 按主题在 PROF_UI / PROF_UI_LIGHT
   之间切（浅色版亮度压到 ~44%，否则白底上是浅字，读不了）。
   ============================================================ */
:root[data-theme="light"]{
  --bg:#f7f4fb; --bg2:#ffffff; --bg3:#f3eefb; --raise:#ece4f8;
  --paper:#ffffff; --ink:#2e2440; --ink2:#645777; --ink3:#9b8fb2;
  --line:#eae4f4; --line2:#dbd1ec;
  --cinnabar:#d63a63; --cinnabar-d:#b12a4f; --cinnabar-g:#e05680;
  --jade:#2c9c5f; --jade-d:#1f7d4a;
  --gold:#b8860b; --gold-d:#966d09;
  --purple:#e0559a; --purple-d:#7c4ad6;
  --blue:#3b7dd8; --blue-d:#2b62b4;
  --leave:#d63a63; --sub:#b8860b;
  --hard:#c3b3e0; --soft:#e3daf5;      /* 浅底上：中紫描边 + 更浅的硬投影 */
  --shadow:0 10px 30px rgba(90,60,140,.12);
}
:root[data-theme="light"] body{
  background-image:
    radial-gradient(circle at 12% 15%, rgba(170,140,225,.16), transparent 33%),
    radial-gradient(circle at 88% 10%, rgba(235,150,195,.14), transparent 35%),
    radial-gradient(circle at 72% 88%, rgba(150,120,215,.13), transparent 39%),
    radial-gradient(circle at 50% 50%, rgba(140,110,190,.10) 0 1px, transparent 1.5px),
    radial-gradient(circle at 50% 50%, rgba(140,110,190,.07) 0 .8px, transparent 1.2px);
}
:root[data-theme="light"] header.top{background:rgba(255,255,255,.82)}
:root[data-theme="light"] .panel-h h2{
  background:linear-gradient(100deg,#4a3a66 20%,#d94f92 55%,#8250d6 85%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
:root[data-theme="light"] .pill{background:rgba(224,85,154,.12);color:#b53a77}
:root[data-theme="light"] input.i,
:root[data-theme="light"] select.s,
:root[data-theme="light"] textarea.t{background:#fff;color:var(--ink)}
:root[data-theme="light"] select.s{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%239b8fb2'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center}
:root[data-theme="light"] input.i:focus,
:root[data-theme="light"] select.s:focus,
:root[data-theme="light"] textarea.t:focus{box-shadow:0 0 0 3px rgba(224,85,154,.18)}
:root[data-theme="light"] table.tb th{background:#faf7fe}
:root[data-theme="light"] table.tb td{border-bottom:1px solid rgba(90,60,140,.07)}
:root[data-theme="light"] table.tb tr:hover td{background:#fdfaff}
:root[data-theme="light"] .team-panel{background:linear-gradient(180deg,rgba(224,85,154,.05),transparent 42%),#fff}
:root[data-theme="light"] .squad{background:#faf8fd}
:root[data-theme="light"] .squad.full{background:#faf8fd}
:root[data-theme="light"] .squad.drag-over{background:rgba(224,85,154,.1)}
:root[data-theme="light"] .squad.sq-over{background:rgba(124,74,214,.12)}
:root[data-theme="light"] .pchip{background:#fff}
:root[data-theme="light"] .pchip.leave{background:rgba(214,58,99,.09)}
/* 注意 :not() —— `[data-theme=light] .btn` 的优先级 (0,3,0) 高于 `.btn.pri` (0,2,0)，
   不排除的话会把主按钮的粉色渐变底盖成白的，而文字仍是白色 → 白底白字，按钮变空白框。
   子页签 / BO 选项卡的 .active 同理。 */
:root[data-theme="light"] .jl-btn,
:root[data-theme="light"] .subnav .sb:not(.active),
:root[data-theme="light"] .bo-chip:not(.active),
:root[data-theme="light"] .st-sel,
:root[data-theme="light"] .btn:not(.pri):not(.jade){background:#fff}
:root[data-theme="light"] .pool-hint{background:rgba(124,74,214,.07)}
:root[data-theme="light"] .cal-cell{background:#fff}
:root[data-theme="light"] .cal-cell:hover{background:#faf7fe}
:root[data-theme="light"] .cmp-bar{background:rgba(90,60,140,.08)}
:root[data-theme="light"] .overlay{background:rgba(60,40,90,.34)}
:root[data-theme="light"] .sync-dot{box-shadow:0 0 0 3px rgba(90,60,140,.06)}
:root[data-theme="light"] .st-正常{color:var(--ink2)}
/* 排表页那些 rgba 白色底纹在浅色下会消失，换成淡紫 */
:root[data-theme="light"] .squad-b,
:root[data-theme="light"] .lc-top{background:transparent}

/* ============================================================
   子页签（顶栏内，紧贴主页签下面）
   层级：主页签 = 实心胶囊；子页签 = 下划线。两者样式必须拉开，否则看着像平级。
   ============================================================ */
.subbar{max-width:1280px;margin:0 auto;padding:0 20px}
.subtabs{display:flex;gap:22px;border-top:1px solid var(--line);padding-top:1px}
.st-tab{background:none;border:0;padding:9px 1px 8px;font:inherit;font-size:12.5px;
  color:var(--ink3);cursor:pointer;position:relative;letter-spacing:.02em;transition:color .12s}
.st-tab:hover{color:var(--ink2)}
.st-tab.active{color:var(--purple);font-weight:700}
.st-tab.active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:var(--purple);border-radius:2px 2px 0 0}
main{margin-top:18px}

/* ============================================================
   查号记录
   ============================================================ */
.rate-dot{font-size:15px;line-height:1;font-weight:700}
.rate-dot.none{color:var(--ink3);opacity:.45}
.rate-note{display:block;font-size:10px;color:var(--ink3);margin-top:1px;max-width:78px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chk-date{font-family:var(--mono);font-size:12px;color:var(--ink2)}
.chk-date.many{color:var(--purple);text-decoration:underline;text-underline-offset:2px}
table.tb tr.never td{opacity:.62}          /* 没查过的整行压暗，扫一眼就知道谁没查 */
table.tb tr.never .name{opacity:1}
/* 录入弹窗 */
.chk-rows{display:flex;flex-direction:column;gap:7px}
.chk-row{display:flex;align-items:center;gap:10px}
.chk-dim{width:64px;flex:0 0 64px;font-size:13px;color:var(--ink2);text-align:right}
.chk-note{flex:1;min-width:0}
.seg{display:inline-flex;border:1.5px solid var(--line2);border-radius:9px;overflow:hidden;flex:0 0 auto}
.seg-b{background:transparent;border:0;border-right:1.5px solid var(--line2);color:var(--ink3);
  font:inherit;font-size:12px;padding:5px 11px;cursor:pointer;transition:.1s}
.seg-b:last-child{border-right:0}
.seg-b:hover{color:var(--ink)}
.seg-b.on{background:var(--rc);color:#fff;font-weight:700}
:root[data-theme="light"] .seg-b.on{color:#fff}
/* 选人弹窗 */
.pick-row{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;cursor:pointer;font-size:13px}
.pick-row:hover{background:var(--bg3)}
/* 排阵容里的查号短板标记（只在拖拽卡片上；成品表/出图不走这条路径） */
.chk-flag{flex:0 0 auto;width:15px;height:15px;border-radius:50%;background:rgba(244,68,113,.2);
  color:var(--cinnabar);font-size:10px;font-weight:800;line-height:15px;text-align:center;cursor:help}
:root[data-theme="light"] .chk-flag{background:rgba(214,58,99,.14)}
/* 花名册名字格：游戏名 + 查号短板标记，整体居中 */
.name-wrap{display:inline-flex;align-items:center;gap:5px;justify-content:center}

/* ============================================================
   登录 / 注册 / 账号
   ============================================================ */
.auth-root{position:fixed;inset:0;z-index:200;background:var(--bg);
  align-items:center;justify-content:center;padding:20px;overflow:auto}
:root[data-theme="light"] .auth-root{background:var(--bg)}
body.authing header.top,body.authing .wrap{display:none}
.auth-card{width:100%;max-width:380px;background:var(--bg2);border:2px solid var(--hard);
  border-radius:19px;box-shadow:4.5px 4.5px 0 var(--soft);padding:28px 26px 24px;text-align:center}
.auth-seal{width:52px;height:52px;margin:0 auto 12px;border-radius:14px;
  background:linear-gradient(160deg,var(--purple-d),var(--purple));color:#fff;
  display:grid;place-items:center;font-size:26px;font-weight:800;
  box-shadow:0 0 0 1.75px var(--hard),1.75px 1.75px 0 var(--soft)}
.auth-seal.ok{background:linear-gradient(160deg,var(--jade),var(--jade-d))}
.auth-t{font-size:21px;font-weight:800;margin:0 0 3px}
.auth-sub{font-size:12px;color:var(--dim,var(--ink3));margin-bottom:20px}
.auth-card .f{text-align:left}
.auth-go{width:100%;justify-content:center;margin-top:4px}
.auth-alt{font-size:12px;color:var(--ink3);margin-top:14px}
.auth-alt a{color:var(--purple);cursor:pointer;font-weight:700;margin-left:4px}
.auth-note{font-size:11px;color:var(--ink3);margin-top:12px;line-height:1.6}
.auth-err{display:none;font-size:12px;color:var(--cinnabar);background:rgba(244,68,113,.12);
  border-radius:8px;padding:7px 10px;margin-bottom:12px;text-align:left}
/* 注册页关联游戏名·输入搜索（#1）*/
.auth-namelist{display:none;margin-top:6px;max-height:180px;overflow-y:auto;border:1.5px solid var(--line2);
  border-radius:8px;background:var(--bg3)}
.auth-nm{padding:7px 11px;font-size:13px;color:var(--ink);cursor:pointer;text-align:left;border-bottom:1px solid var(--line)}
.auth-nm:last-child{border-bottom:none}
.auth-nm:hover{background:color-mix(in srgb,var(--purple) 14%,transparent);color:var(--purple)}
.auth-nm.muted{color:var(--ink3);cursor:default}
.auth-nm.muted:hover{background:none;color:var(--ink3)}
.auth-chosen{align-items:center;gap:6px;margin-top:8px;font-size:13px;text-align:left}
.auth-chosen b{color:var(--purple)}
.auth-clear{color:var(--ink3);cursor:pointer;margin-left:auto;font-size:12px;text-decoration:underline}
/* #24：历史数据「看谁」输入搜索的下拉 */
.trend-who{position:relative;display:inline-block}
.trend-wholist{display:none;position:absolute;top:100%;left:0;z-index:50;min-width:160px;max-height:240px;overflow-y:auto;
  margin-top:3px;border:1.5px solid var(--line2);border-radius:8px;background:var(--bg3);box-shadow:0 6px 18px rgba(0,0,0,.35)}
/* 顶栏当前用户 */
.me-box{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--ink2);
  border:1.75px solid var(--hard);box-shadow:1.75px 1.75px 0 var(--soft);
  padding:5px 10px;border-radius:980px}
.me-name{font-weight:700;color:var(--ink)}
.me-role{font-size:10px;font-weight:800;color:#fff;background:var(--purple);border-radius:5px;padding:0 5px}
.me-out{color:var(--ink3);cursor:pointer;border-left:1px solid var(--line2);padding-left:7px}
.me-out:hover{color:var(--cinnabar)}
.ro-val{font-size:13px;color:var(--ink);padding:9px 0}
/* 权限分档：
   .needs-admin → 管理专属（body.locked 时隐藏）
   .needs-user  → 登录用户也能用（比如建自己的活动）；body.nouser 时才隐藏 */
body.nouser .needs-user{display:none!important}
/* 私有活动标记 */
.priv-tag{font-size:10px;font-weight:700;color:var(--purple);background:rgba(248,103,164,.16);
  border-radius:5px;padding:0 5px;margin-left:5px;white-space:nowrap}

/* ============================================================
   公告通栏（顶栏下方，每页可见，克制一条）
   ============================================================ */
.notice-bar{max-width:1280px;margin:14px auto -4px;padding:8px 14px;display:flex;align-items:center;gap:10px;
  background:linear-gradient(90deg,rgba(248,103,164,.13),rgba(130,74,226,.09));
  border:1.5px solid var(--hard);border-radius:11px;box-shadow:1.75px 1.75px 0 var(--soft);font-size:12.5px}
.nb-tag{flex:0 0 auto;font-size:10px;font-weight:800;color:#fff;background:var(--purple-d);
  border-radius:5px;padding:1px 6px}
.nb-tag.pin{background:var(--purple)}
.nb-text{flex:1;min-width:0;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nb-meta{flex:0 0 auto;font-size:11px;color:var(--ink3)}
.nb-more{flex:0 0 auto;color:var(--purple);cursor:pointer;font-weight:700;white-space:nowrap}
.nb-more:hover{text-decoration:underline}
.nb-edit{flex:0 0 auto;color:var(--ink3);cursor:pointer;padding:0 3px}
.nb-edit:hover{color:var(--purple)}
.nb-empty{flex:1;color:var(--ink3)}
.nl-row{display:flex;align-items:flex-start;gap:9px;padding:9px;border:1.5px solid var(--line2);border-radius:10px}
.nl-text{font-size:13px;color:var(--ink);white-space:pre-wrap;word-break:break-word}
.nl-meta{font-size:11px;color:var(--ink3);margin-top:3px}
@media(max-width:900px){.notice-bar{margin-left:14px;margin-right:14px}}
/* 我的查号（普通用户视角） */
.mc-rank{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:16px 18px;border-radius:14px;
  background:linear-gradient(100deg,rgba(248,103,164,.12),rgba(130,74,226,.08));
  border:1.5px solid var(--hard);margin-bottom:16px}
.mc-pct{font-size:30px;font-weight:800;letter-spacing:-.02em;
  background:linear-gradient(100deg,var(--purple),var(--purple-d));-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent}
.mc-sub{font-size:12px;color:var(--ink3);margin-top:2px}
.mc-score{margin-left:auto;font-size:13px;color:var(--ink2)}
.mc-score b{font-size:22px;color:var(--ink);margin-right:4px;font-variant-numeric:tabular-nums}
.mc-bar{flex:1 0 100%;height:7px;border-radius:5px;background:rgba(158,136,196,.16);overflow:hidden}
.mc-bar>i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--purple-d),var(--purple))}
.mc-dims{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.mc-dim{border:1.5px solid var(--line2);border-radius:11px;padding:11px 13px}
.mc-dn{font-size:12px;color:var(--ink3);margin-bottom:5px}
.mc-dr{font-size:14px;font-weight:700;color:var(--ink);display:flex;align-items:center}
.mc-dnote{font-size:11px;color:var(--ink3);margin-top:5px}
.mc-note{margin-top:14px;font-size:13px;color:var(--ink2);background:var(--bg3);border-radius:10px;padding:10px 12px}
/* 对战记录 */
.num-cell{font-family:var(--mono);font-size:12px;color:var(--ink2);font-variant-numeric:tabular-nums}
.res-sel{min-width:64px}
.res-sel.res-胜{color:var(--jade);border-color:var(--jade)}
.res-sel.res-负{color:var(--cinnabar);border-color:var(--cinnabar)}
.res-sel.res-none{color:var(--ink3)}
/* #37：普通用户看到的胜负标（.tag 版，非下拉）也上色 */
.tag.res-胜{color:var(--jade);background:color-mix(in srgb,var(--jade) 15%,transparent)}
.tag.res-负{color:var(--cinnabar);background:color-mix(in srgb,var(--cinnabar) 15%,transparent)}

/* ============================================================
   历史数据 · 趋势小图（small multiples）
   每格一个指标、各自一条 y 轴 —— 8 个指标量级差几个数量级，塞一张图里就是双轴。
   配色见 app.js 的 TREND_C：色相锁在库洛米粉/沧澜蓝，亮度按 dataviz 验证器调过。
   ============================================================ */
.sp-legend{display:flex;align-items:center;gap:16px;font-size:12px;color:var(--ink2);margin-bottom:12px;flex-wrap:wrap}
.sp-legend span{display:inline-flex;align-items:center;gap:6px}
.sp-legend i{width:11px;height:3px;border-radius:2px;flex:0 0 auto}
.sp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.sp-box{position:relative;border:1.5px solid var(--line2);border-radius:11px;padding:9px 10px 7px;
  background:var(--bg2)}
.sp-t{font-size:11px;color:var(--ink3);letter-spacing:.03em}
.sp-svg{display:block;width:100%;height:auto;margin-top:2px;overflow:visible}
.sp-base{stroke:var(--line2);stroke-width:1}          /* 发丝实线，不要虚线 */
.sp-cross{stroke:var(--ink3);stroke-width:1;opacity:.5}
.sp-end{position:absolute;right:10px;top:7px;font-size:12px;font-weight:800;color:var(--ink);
  font-variant-numeric:tabular-nums}
.sp-none{font-size:11px;color:var(--ink3);padding:22px 0;text-align:center}
.sp-tip{display:none;position:absolute;bottom:100%;transform:translateX(-50%);z-index:5;
  background:var(--bg3);border:1.5px solid var(--hard);border-radius:9px;padding:6px 9px;
  font-size:11px;white-space:nowrap;pointer-events:none;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.sp-tip-x{color:var(--ink3);margin-bottom:3px}
.sp-tip-r{display:flex;align-items:center;gap:5px;color:var(--ink2)}
.sp-tip-r i{width:9px;height:3px;border-radius:2px;flex:0 0 auto}
.sp-tip-r b{color:var(--ink);margin-left:4px;font-variant-numeric:tabular-nums}
.tv-wrap{margin-top:10px;overflow-x:auto;border:1.5px solid var(--line2);border-radius:11px}

/* ===== 日历弹窗：自助请假 + 录屏链接 ===== */
.dm-card{border:1px solid var(--line);border-radius:11px;margin-bottom:10px;overflow:hidden}
.dm-head{display:flex;align-items:center;gap:10px;padding:10px 12px;flex-wrap:wrap}
.dm-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-left:auto}
.dm-foot{display:flex;flex-wrap:wrap;gap:10px 22px;padding:9px 12px;border-top:1px dashed var(--line);background:var(--bg2)}
.dm-lb{font-size:11px;letter-spacing:.08em;color:var(--ink3);white-space:nowrap}
.dm-leave{display:flex;align-items:center;gap:8px}
.dm-rec{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1;min-width:220px}
.lv-on{font-size:12px;font-weight:700;color:var(--red);background:color-mix(in srgb,var(--red) 14%,transparent);
  border:1px solid color-mix(in srgb,var(--red) 34%,transparent);border-radius:999px;padding:2px 9px}
.lv-off{font-size:12px;font-weight:700;color:var(--jade);background:color-mix(in srgb,var(--jade) 14%,transparent);
  border:1px solid color-mix(in srgb,var(--jade) 34%,transparent);border-radius:999px;padding:2px 9px}
/* 两把里只缺一把的状态标（介于正常和请假之间，用琥珀/橙） */
.lv-part{font-size:12px;font-weight:700;color:var(--gold);background:color-mix(in srgb,var(--gold) 15%,transparent);
  border:1px solid color-mix(in srgb,var(--gold) 38%,transparent);border-radius:999px;padding:2px 9px}
/* 分把请假的四选按钮组 */
.lv-seg{display:inline-flex;gap:4px;flex-wrap:wrap}
.lv-opt{font-size:12px;font-weight:700;color:var(--ink2);background:var(--bg2);cursor:pointer;
  border:1px solid var(--line2);border-radius:999px;padding:2px 10px;white-space:nowrap}
.lv-opt:hover{border-color:var(--purple);color:var(--purple)}
.lv-opt.on{background:var(--purple);border-color:var(--purple);color:#fff}
.lv-opt.dim{opacity:.5}
/* 请假名单胶囊上的把标 ①/② */
.rnd-badge{font-size:11px;font-weight:800;margin-left:3px;color:var(--gold)}
/* 排表卡片上「只缺某把」的徽章（不整卡红，跟整场的「假」区分——用琥珀） */
.pchip .lv.part{background:var(--gold);color:#1a1420}
.rec-list{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rec-row{display:flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:999px;padding:2px 4px 2px 8px}
.rec-a{font-size:12px;font-weight:700;color:var(--purple);text-decoration:none}
/* #40：已贴的录屏按分团分组，放在请假名单下面（挤在上面太乱） */
.rec-group{width:100%;margin-top:8px}
.rec-gh{font-size:11.5px;font-weight:800;color:var(--purple);letter-spacing:.3px;margin:0 0 5px;
  display:flex;align-items:center;gap:6px}
.rec-gh::before{content:"";width:3px;height:12px;border-radius:2px;background:var(--purple)}
.rec-a:hover{text-decoration:underline}
.rec-x{border:0;background:none;color:var(--ink3);cursor:pointer;font-size:14px;line-height:1;padding:0 4px;border-radius:50%}
.rec-x:hover{color:var(--red);background:color-mix(in srgb,var(--red) 14%,transparent)}

/* ===== 对战数据：来源标记 / 对比对象说明 ===== */
.tag.out-tag{color:var(--gold);background:color-mix(in srgb,var(--gold) 13%,transparent);
  border-color:color-mix(in srgb,var(--gold) 34%,transparent)}
.sp-why{font-size:11px;color:var(--ink3)}
.ro-note{font-size:13px;color:var(--ink2);padding:9px 11px;border:1px dashed var(--line);border-radius:9px}
.sp-n{font-size:11px;color:var(--ink3);font-weight:600;margin-left:3px}

/* ===== 请假名单 / 已截止的按钮 ===== */
.dm-leavelist{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1}
.lv-n{font-size:11px;font-weight:700;color:var(--red);background:color-mix(in srgb,var(--red) 12%,transparent);
  border-radius:999px;padding:1px 8px}
.lv-names{display:flex;gap:5px;flex-wrap:wrap}
/* 请假名单的胶囊：跟请假看板同一套（职业色 + 门派图标）。
   不划删除线 —— 整块已经标了「请假名单」，再划一遍是重复，而且划掉的字难认。 */
.lv-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;
  border-radius:999px;padding:2px 9px}
/* 截止后按钮不置灰不禁用 —— 变灰的按钮不解释原因，点得动才能告诉用户去私聊管理 */
.btn.dim{opacity:.55}

/* ===== 请假看板：一个活动一张卡，横向排开 ===== */
.lb-board{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;align-items:flex-start}
.lb-card{flex:0 0 268px;border:1px solid var(--line);border-radius:12px;background:var(--bg2);overflow:hidden}
.lb-h{display:flex;align-items:center;gap:7px;padding:9px 11px;border-bottom:1px solid var(--line)}
.lb-d{font-family:var(--mono);font-size:12px;color:var(--ink2);white-space:nowrap}
.lb-t{flex:1;min-width:0;font-size:13px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.lb-b{padding:8px 11px;display:flex;flex-direction:column;gap:5px;max-height:290px;overflow-y:auto}
.lb-row{display:flex;align-items:center;gap:6px}
.lb-chip{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 9px;font-size:12px;font-weight:700;
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-chip.pick{flex:0 0 auto;cursor:pointer}
.lb-chip.pick:hover{filter:brightness(1.25)}
.lb-ic{width:14px;height:14px;object-fit:contain;flex:0 0 auto}
.lb-at{font-family:var(--mono);font-size:11px;color:var(--ink3);white-space:nowrap}
.lb-f{padding:7px 11px;border-top:1px dashed var(--line);display:flex;justify-content:flex-start}

/* ===== 贴录屏：多行 ===== */
.ra-hd{display:grid;grid-template-columns:1fr 120px 150px 24px;gap:8px;font-size:11px;color:var(--ink3);
  padding:0 2px 4px;letter-spacing:.06em;text-align:left}
.ra-rows{display:flex;flex-direction:column;gap:7px}
.ra-row{display:grid;grid-template-columns:1fr 120px 150px 24px;gap:8px;align-items:center}
.ra-s{min-width:0}
.ra-x{cursor:pointer;color:var(--ink3);font-size:15px;line-height:1;text-align:center;border-radius:50%}
.ra-x:hover{color:var(--red)}
.tag.rec-team{color:var(--purple);background:color-mix(in srgb,var(--purple) 12%,transparent);
  border-color:color-mix(in srgb,var(--purple) 32%,transparent)}
/* 号不在帮会的人出现在帮战阵容里：标出来，别悄悄藏（藏了 6/6 人数就在说谎） */
.pchip .lv.out{background:var(--gold);color:#1a1420}


/* ===== 小队头重做 =====
   原来「1队」是个粗重的实心渐变胶囊，比下面成员的职业胶囊还抢眼 —— 队号是结构，
   不该比人还重。改成跟职业胶囊同一套淡底描边（chipStyle 那个路子），层级就顺了。
   拖动手柄原来紧贴卡片边、颜色极暗，被那个重胶囊挤得看不见，这里给足空间 + 提亮。 */
.squad-h{display:flex;align-items:center;gap:6px;padding:7px 8px}
.sq-grip{flex:0 0 auto;font-size:14px;padding:2px 3px;border-radius:5px;color:var(--ink3);opacity:.7;letter-spacing:-1px}
.sq-grip:hover{opacity:1;color:var(--purple);background:color-mix(in srgb,var(--purple) 14%,transparent)}
.squad-t{flex:0 0 auto;background:color-mix(in srgb,var(--purple) 15%,transparent);color:var(--purple);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--purple) 32%,transparent);
  font-size:11.5px;font-weight:800;padding:2px 8px;border-radius:6px;letter-spacing:.02em}
/* 队标可编辑：flex:1 吃掉中间空隙 —— 标写长了只挤自己，不会把 6/6 顶出去（原来会） */
input.squad-lbl{flex:1;min-width:0;background:transparent;border:0;border-bottom:1px dashed transparent;
  color:var(--ink2);font-size:11px;font-family:inherit;padding:1px 4px;border-radius:0;text-align:left;margin:0}
input.squad-lbl::placeholder{color:var(--ink3);opacity:.5}
input.squad-lbl:hover{border-bottom-color:var(--line)}
input.squad-lbl:focus{outline:none;border-bottom-color:var(--purple);color:var(--ink)}
.squad-lbl.ro{flex:1;min-width:0;font-size:11px;color:var(--ink3);text-align:left;background:none;padding:1px 4px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.squad-c{flex:0 0 auto}

/* ===== 团配：每个团各职业多少人 ===== */
.team-comp{display:flex;flex-wrap:wrap;gap:4px;padding:0 10px 8px}
.tc-chip{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:700;
  padding:1px 6px;border-radius:999px}
.tc-chip b{font-family:var(--mono);font-size:10.5px;opacity:.85}
.tc-none{font-size:11px;color:var(--ink3);padding:0 2px}


/* 小队卡片一行一个 ID（竖排）。**别再改成横向 wrap** —— 试过，防守团直接飞出去了：
   .squad-grid 是 repeat(5,1fr)，而 `1fr` = `minmax(auto,1fr)`，轨道最小宽 = min-content。
   胶囊一旦不可收缩（flex:0 0 auto），min-content 就被撑大，4 队的防守团网格内容 1049px
   硬挤在 851px 里 —— 溢出 198px，还比隔壁进攻团宽出一截。
   下面这条 minmax(0,1fr) 是永久防线：轨道最小宽钉死成 0，内容再宽也只会内部截断，不会把布局顶爆。 */
.squad-grid{grid-template-columns:repeat(5,minmax(0,1fr))}

/* ===== 内功计算器 ===== */
.ng-cards{display:flex;gap:12px;flex-wrap:wrap}
.ng-card{flex:1 1 220px;min-width:200px;border:1px solid var(--line);border-radius:12px;padding:12px;
  background:var(--bg2);display:flex;flex-direction:column}
.ng-card .ng-cfoot{margin-top:auto;padding-top:8px}
.ng-card .ng-none{margin-bottom:auto}
.ng-ch{display:flex;align-items:center;gap:6px;font-size:13px;margin-bottom:8px}
.ng-score{font-size:26px;font-weight:800;color:var(--purple);font-family:var(--mono);line-height:1.1}
.ng-score i{font-size:12px;font-style:normal;color:var(--ink3);margin-left:3px}
.ng-title{font-size:13px;font-weight:700;color:var(--gold);margin-top:2px}
.ng-sub{display:flex;gap:10px;flex-wrap:wrap;font-size:11px;color:var(--ink3);margin-top:4px;font-family:var(--mono);justify-content:flex-end}
.ng-none{font-size:13px;color:var(--ink3);padding:8px 0}
.ng-out{margin-left:auto;text-align:right}
.ng-top{display:flex;align-items:flex-start;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--line);margin-bottom:10px}
.ng-body{max-height:52vh;overflow:auto;display:flex;flex-direction:column;gap:14px}
.ng-sec{}
.ng-h{display:flex;align-items:baseline;gap:8px;font-size:13px;margin-bottom:6px}
.ng-h .muted{font-size:11px}
.ng-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:7px}
.ng-f{display:flex;flex-direction:column;gap:2px}
.ng-l{font-size:11px;color:var(--ink3);text-align:left}
.ng-i{text-align:left}
.ng-pairs{display:flex;flex-direction:column;gap:6px}
.ng-pair{display:grid;grid-template-columns:56px 1fr 92px;gap:6px;align-items:center}
.ng-carry{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
/* 武蕴灵窍：独立参考区（不进主分）。每个武蕴一张小卡：名字+有/无、占比/增伤输入、各场景期望 */
.wy-consume{max-width:180px;margin-bottom:10px}
.wy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}
.wy-item{border:1px solid var(--line2);border-radius:9px;padding:8px 9px;background:color-mix(in srgb,var(--purple) 5%,transparent)}
.wy-head{display:flex;align-items:center;gap:6px;margin-bottom:6px}
.wy-name{font-size:12.5px;font-weight:700}
.wy-tag{font-size:10px;color:var(--ink3);border:1px solid var(--line2);border-radius:4px;padding:0 4px}
.wy-have{margin-left:auto;font-size:11px;font-weight:700;cursor:pointer;border-radius:6px;padding:1px 8px;
  color:var(--ink3);border:1.5px solid var(--line2);white-space:nowrap;user-select:none}
.wy-have.on{color:#fff;background:var(--purple);border-color:var(--purple)}
.wy-vals{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.wy-vals.ro{gap:3px 12px;margin-bottom:5px}
.wy-vro{font-size:11px;color:var(--ink3)}
.wy-vro b{color:var(--ink2);font-weight:700;font-variant-numeric:tabular-nums}
.wy-exp{display:flex;flex-wrap:wrap;gap:4px 10px}
.wy-e{display:flex;align-items:baseline;gap:4px;font-size:11px}
.wy-el{color:var(--ink3)}
.wy-en{font-weight:700;color:var(--purple);font-variant-numeric:tabular-nums}
.ng-c{display:flex;align-items:center;gap:6px}
.ng-cb{width:18px;height:18px;flex:0 0 18px;border-radius:5px;border:1.5px solid var(--line2);cursor:pointer;
  display:flex;align-items:center;justify-content:center;font-size:11px;color:transparent}
.ng-cb.on{background:var(--purple);border-color:var(--purple);color:#fff}
.ng-cn{font-size:12px}
.ng-cn.off{color:var(--ink3)}
.ng-lg{font-size:10px;font-weight:800;padding:1px 5px;border-radius:4px;cursor:pointer;
  border:1px solid var(--line2);color:var(--ink3)}
.ng-lg.on{background:color-mix(in srgb,var(--gold) 20%,transparent);border-color:var(--gold);color:var(--gold)}
.ng-cell{display:flex;flex-direction:column;gap:3px;align-items:center}
.ng-tag{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;font-family:var(--mono);
  color:var(--purple);background:color-mix(in srgb,var(--purple) 12%,transparent);border-radius:999px;padding:1px 7px}
.ng-tag i{font-style:normal;font-size:9px;color:var(--ink3);font-family:var(--sans)}
/* 内功前三名 —— 金 / 银 / 铜，亮具体分、压过一片「前 X%」 */
.ng-tag.ng-top{font-weight:800}
.ng-tag.ng-top i{color:inherit;opacity:.62}
.ng-tag.ng-top1{color:#4a2e00;background:linear-gradient(135deg,#ffdf7a,#f4a63c);box-shadow:0 1px 5px rgba(244,166,60,.55)}
.ng-tag.ng-top2{color:#2f343b;background:linear-gradient(135deg,#eef2f6,#b4bfcc);box-shadow:0 1px 5px rgba(150,162,178,.5)}
.ng-tag.ng-top3{color:#4a2410;background:linear-gradient(135deg,#f3bb92,#c67843);box-shadow:0 1px 5px rgba(198,120,67,.5)}

/* ===== 内功：校验提示 / 历史分数 ===== */
.ng-err{display:none;margin:0 0 10px;padding:8px 10px;border-radius:8px;font-size:12px;line-height:1.7;
  color:var(--red);background:color-mix(in srgb,var(--red) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--red) 30%,transparent);text-align:left}
.ng-score.bad{color:var(--red)}
.ng-cnt{font-size:11px;color:var(--ink3);font-family:var(--mono);margin-top:3px}
.ng-cnt.bad{color:var(--red);font-weight:700}
.btn.pri.dim{opacity:.45;cursor:not-allowed}
.ng-hist{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.ng-hh{display:flex;align-items:baseline;gap:10px;font-size:13px;margin-bottom:7px}
.ng-hh .muted{font-size:11px}
/* #2：不再给固定高度 —— 展开多条「看填写」时整个弹窗一起滚，才能上下对比（原来卡在 150px 里各自滚，没法比） */
.ng-hrows{display:flex;flex-direction:column;gap:4px}
.ng-hr{display:flex;align-items:center;gap:9px;padding:4px 8px;border-radius:7px;font-size:12px;
  border:1px solid transparent}
.ng-hr.now{border-color:color-mix(in srgb,var(--purple) 34%,transparent);
  background:color-mix(in srgb,var(--purple) 8%,transparent)}
.ng-hd{font-family:var(--mono);color:var(--ink3);font-size:11px}
.ng-hs{font-family:var(--mono);color:var(--ink);min-width:78px;text-align:left}
.ng-ht{color:var(--gold);font-size:11px}
.ng-hdel{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--ink3)}
.ng-hdel.up{color:var(--jade)} .ng-hdel.dn{color:var(--red)}
.ng-hnow{font-size:10px;font-weight:800;color:var(--purple);
  background:color-mix(in srgb,var(--purple) 14%,transparent);border-radius:999px;padding:1px 6px}
.ng-hold{margin-top:8px}
.ng-holdt{font-size:11px;color:var(--ink3);cursor:pointer}
.ng-holdt:hover{color:var(--purple)}
.ng-hrows.old{display:none;margin-top:5px;opacity:.7}
.ng-hold.open .ng-hrows.old{display:flex}
/* 历史行展开「看填写」：翻这条记录当时填了哪些内功 / 数值 */
.ng-hrw{display:flex;flex-direction:column}
.ng-hsee{font-size:10px;font-weight:700;color:var(--purple);cursor:pointer;white-space:nowrap;
  border:1px solid color-mix(in srgb,var(--purple) 30%,transparent);border-radius:999px;padding:1px 7px}
.ng-hsee:hover{background:color-mix(in srgb,var(--purple) 12%,transparent)}
.ng-detl{display:flex;flex-direction:column;gap:6px;margin:3px 0 6px 8px;padding:8px 10px;
  border-left:2px solid color-mix(in srgb,var(--purple) 40%,transparent);
  background:color-mix(in srgb,var(--purple) 5%,transparent);border-radius:0 8px 8px 0}
.ng-dg{display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap}
.ng-dgl{font-size:11px;font-weight:800;color:var(--ink3);min-width:46px;flex-shrink:0;padding-top:2px}
.ng-dgv{display:flex;flex-wrap:wrap;gap:4px;flex:1}
.ng-dchip{font-size:11px;font-weight:700;color:var(--ink);border-radius:999px;padding:1px 8px;
  background:color-mix(in srgb,var(--ink) 8%,transparent);border:1px solid var(--line)}
.ng-dchip.rare{color:var(--gold);border-color:color-mix(in srgb,var(--gold) 45%,transparent);
  background:color-mix(in srgb,var(--gold) 12%,transparent)}
/* #1：看填写里给上了灵韵的内功标个「灵」 */
.ng-dling{font-style:normal;font-size:9px;font-weight:800;margin-left:4px;padding:0 3px;border-radius:3px;
  color:#fff;background:linear-gradient(135deg,#f867a4,#a25bf0);vertical-align:middle}
.ng-dpair{display:inline-flex;align-items:baseline;gap:4px;font-size:11px}
.ng-dpair i{font-style:normal;color:var(--ink3)}
.ng-dpair b{font-family:var(--mono);color:var(--ink)}
/* 花名册「内功」格：点开看历史 */
.ng-td:hover{background:color-mix(in srgb,var(--purple) 8%,transparent)}
/* 多组输出（拆塔的抗拆/空拆） */
.ng-oline{display:flex;align-items:baseline;gap:7px;justify-content:flex-end}
.ng-oline.alt{opacity:.82;margin-top:1px}
.ng-ol{font-size:11px;color:var(--ink3);white-space:nowrap}
.ng-score.sm{font-size:18px}
.ng-oline .ng-title{margin-top:0}
/* 稀有内功：别用秃的 var(--gold)（#efb92e 芥末黄，扎眼）。
   琥珀→紫的渐变 + 一圈微光晕，跟库洛米主题同一挂，又跟普通内功分得开。 */
.ng-cb.rare{border-color:color-mix(in srgb,#e8b34a 45%,transparent)}
.ng-cb.rare.on{background:linear-gradient(135deg,#e8c06a,#c98adb);border-color:#d9a94f;color:#2a1a2e;
  box-shadow:0 0 0 2px color-mix(in srgb,#e8b34a 18%,transparent)}
.ng-cn.rare{color:#e5c17a;font-weight:700}
.ng-cn.rare.off{color:color-mix(in srgb,#e5c17a 50%,var(--ink3))}
:root[data-theme="light"] .ng-cb.rare.on{background:linear-gradient(135deg,#d4a53c,#a165c4);color:#fff}
:root[data-theme="light"] .ng-cn.rare{color:#9a6b1e}
/* 这条提示比它那一格宽 —— grid 里得跨列，不然挤成一条 60px 的面条 */
.ng-f:has(.ng-pnote){grid-column:1/-1}
.ng-f:has(.ng-pnote) .s{max-width:200px}
.ng-pnote{font-size:11px;line-height:1.6;color:var(--gold);margin-top:4px;text-align:left;
  background:color-mix(in srgb,var(--gold) 9%,transparent);border-radius:5px;padding:4px 8px}

/* 历史行：多个分数 + 版本标 */
.ng-hss{display:flex;gap:12px;flex-wrap:wrap;align-items:baseline;flex:1;min-width:0}
.ng-hs1{display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap}
.ng-hs1 i{font-style:normal;font-size:10px;color:var(--ink3)}
.ng-hs1 b{font-family:var(--mono);color:var(--ink);font-size:12px}
.ng-hs1 em{font-style:normal;font-size:10.5px;color:var(--gold)}
.ng-hv{font-size:9.5px;font-family:var(--mono);color:var(--ink3);border:1px solid var(--line);
  border-radius:4px;padding:0 4px;white-space:nowrap;flex:0 0 auto}
.ng-hv.old{color:var(--gold);border-color:color-mix(in srgb,var(--gold) 40%,transparent)}
.ng-oldw{font-size:10px;color:var(--gold)}
.ng-cfoot{display:flex;align-items:center;gap:5px;margin-top:5px;font-size:11px;color:var(--ink3)}
.ng-err.only-warn{color:var(--gold);background:color-mix(in srgb,var(--gold) 8%,transparent);
  border-color:color-mix(in srgb,var(--gold) 26%,transparent)}
.ng-warn{color:var(--gold)}


/* ===== 字体收口：把漏网的宋体（--serif）全换成主题字体 =====
   库洛米主题当初只改了 .title h1 和 .panel-h h2，剩下这些还挂着 --serif（"Songti SC"/宋体），
   跟满屏的圆体混在一起特别扎眼：弹窗标题、空状态大字（「待解析」）、分区标题、印章。
   日历的「2026 年 7 月」更隐蔽 —— 它的 font-family 是**内联写死在 app.js 里的**，
   CSS 根本覆盖不掉，只能改代码（已改成 .cal-ym）。
   → 新增文字**别再用 --serif**，也别内联 font-family。 */
.sealmark,.title h1,.panel-h h2,.zone-h .zt,.modal-h h3,.empty .big{
  font-family:var(--sans);font-weight:800;letter-spacing:.02em}
.modal-h h3{font-size:16.5px}
.empty .big{font-weight:700;letter-spacing:.04em;font-size:22px}
.zone-h .zt{font-weight:800;letter-spacing:.02em}
.cal-ym{font-size:15px;font-weight:800;min-width:118px;text-align:center;letter-spacing:.02em;
  font-variant-numeric:tabular-nums}
/* 计算器不认的内功：**不划删除线**（划掉的字难认，而且它不是"错的"，只是这版计算器没给它算分）。
   淡一点 + 悬停说明就够了，正经的解释在上面那条金色横幅里。 */
.ng-c.noscore .ng-cn{color:var(--ink3)}
/* 可填个数的内功（防御土内功）：勾上后跟个数框。
   这一格比别的宽 —— 得跨列，不然名字被挤成竖排一个字一个字（踩过）。 */
.ng-c.qty{grid-column:span 2}
.ng-c .ng-cn{white-space:nowrap}
.ng-q{flex:0 0 42px;width:42px;height:22px;padding:0 4px;font-size:11.5px;line-height:1;
  text-align:center;margin:0;border-radius:6px;border-width:1px;font-family:var(--mono)}
.ng-q:focus{box-shadow:0 0 0 2px rgba(248,103,164,.2)}
/* 数字框右边那对上下箭头在 22px 高里挤成一团，还占掉一半宽度 —— 去掉，反正有 min/max */
.ng-q::-webkit-inner-spin-button,.ng-q::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.ng-q{-moz-appearance:textfield;appearance:textfield}
.ng-qu{font-size:10px;color:var(--ink3);flex:0 0 auto}
/* 历史/卡片上的职业胶囊：拆塔显示实际参与计算的流派（御铁/狂澜…），配色按花名册主职业 */
.ng-hp{font-size:10px;font-weight:700;border-radius:999px;padding:1px 7px;white-space:nowrap;flex:0 0 auto}
.ng-cbtn{margin-top:8px;align-self:flex-start}
.ng-card:not(:has(.ng-cfoot)) .ng-cbtn{margin-top:auto}
/* 活动弹窗里的勾选行（内训） */
.ck-line{display:flex;align-items:center;gap:7px;font-size:13px;margin:8px 0 2px;cursor:pointer}
.ck-line input{width:15px;height:15px;accent-color:var(--purple);cursor:pointer}
/* 内训标：内训不再是活动类型（是约战上的开关），但得一眼认出来。
   沿用它当类型时那个紫色 #7c6cff。 */
/* 活动弹窗里并排的勾选 */
.ck-row{display:flex;gap:18px;flex-wrap:wrap;margin:8px 0 2px}
.ck-row .ck-line{margin:0}
/* 日期弹窗里的「进入会议」——它是个 <a>，得跟旁边的 button 一样高 */
.dm-head a.btn{text-decoration:none;display:inline-flex;align-items:center}
/* 帮补人：缺额表 */
.sub-wrap{margin:8px 0 2px;padding:10px;border:1px dashed var(--line);border-radius:10px;background:var(--bg2)}
/* 缺额编辑器：一行一条（进攻/防守 · 职业 · 位置 · 单双奶 · 人数）
   注意 select.s 自带 width:100% —— 只写 flex:0 0 auto 压不住它（basis:auto 会回读 width），
   必须给出实际宽度，否则每个下拉各占一整行，一条缺额摊成五行。踩过。 */
.q-list{display:flex;flex-direction:column;gap:6px}
.q-row{display:flex;align-items:center;gap:6px}
.q-row .s{width:auto;flex:0 0 78px;height:28px;padding:0 20px 0 8px;font-size:12px;margin:0;
  border-radius:7px;background-position:right 6px center}
.q-n{width:48px;flex:0 0 48px;height:28px;padding:0 4px;font-size:12px;text-align:center;margin:0;
  border-radius:7px;border-width:1px;font-family:var(--mono)}
.q-n::-webkit-inner-spin-button,.q-n::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.q-foot{display:flex;align-items:center;gap:10px;margin-top:4px}
/* 帮补人：报名 */
.su-wrap{display:flex;flex-direction:column;gap:6px;flex:1}
.su-side{display:flex;align-items:baseline;gap:8px;font-size:12px;margin-top:4px}
.su-side b{font-size:12.5px}
/* 一坑一行（不是网格）—— 一条里要塞下 职业+位置+单双奶+人数+谁报了+按钮，网格挤不下 */
.su-grid{display:flex;flex-direction:column;gap:5px}
.su-cell{display:flex;align-items:center;gap:6px;padding:4px 7px;border:1px solid var(--line);border-radius:8px}
.su-cell.mine{border-color:var(--purple);background:color-mix(in srgb,var(--purple) 10%,transparent)}
.su-cell.full{opacity:.5}
.su-p{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:700;border-radius:999px;
  padding:1px 6px;white-space:nowrap;flex:0 0 auto}
.su-p img{width:12px;height:12px;object-fit:contain}
.su-tag{font-size:10px;color:var(--ink2);border:1px solid var(--line);border-radius:5px;padding:0 4px;flex:0 0 auto}
.su-n{font-family:var(--mono);font-size:11.5px;color:var(--ink2);flex:0 0 auto}
.su-who{font-size:11px;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.su-cell .btn{flex:0 0 auto}
.su-noterow{display:flex;align-items:center;gap:8px;margin-top:2px}
.su-note{height:26px;font-size:12px;margin:0;flex:1;border-radius:6px;border-width:1px}
.su-line{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:11px}
.su-names{display:flex;gap:4px;flex-wrap:wrap}
.su-chip{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:700;border-radius:999px;padding:1px 7px}
.su-chip i{font-style:normal;font-size:9px;opacity:.8}
.su-chip em{font-style:normal;font-weight:400;font-size:10px;opacity:.75;max-width:110px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sub-img{width:100%;height:auto;display:block;border-radius:8px;border:1px solid var(--line)}
/* 排表图：选文件 / 粘贴截图 */
.img-box{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.img-thumb{height:60px;width:auto;max-width:160px;object-fit:cover;border-radius:7px;
  border:1px solid var(--line2);cursor:zoom-in}

/* 页签角标：有账号等着审核时挂在「设置」上（不然管理不会主动翻设置页） */
.tab-dot{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;
  padding:0 4px;margin-left:5px;border-radius:999px;background:var(--cinnabar);color:#fff;
  font-size:10.5px;font-weight:800;font-family:var(--mono);line-height:1}


/* 删掉一条内功记录（填错了要能撤）。平时淡，悬停整行才显出来 —— 别让删除键抢戏 */
.ng-hx{border:0;background:transparent;color:var(--ink3);cursor:pointer;font-size:14px;line-height:1;
  padding:0 2px;border-radius:5px;opacity:0;transition:.12s;margin-left:2px}
.ng-hr:hover .ng-hx{opacity:.65}
.ng-hx:hover{opacity:1!important;color:var(--cinnabar);background:color-mix(in srgb,var(--cinnabar) 15%,transparent)}

/* ---- 头像 ---- */
/* 没传头像就退回职业图标、再退回名字首字（avatarFallback）—— 永远有东西可看，不留空洞。
   尺寸走类，别在 JS 里写死像素。 */
.av{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  border-radius:50%;overflow:hidden;background:var(--bg2);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink3) 30%,transparent)}
.av img{width:100%;height:100%;object-fit:cover;display:block}
.av .av-p{width:72%;height:72%;object-fit:contain}          /* 职业图标兜底：留白，别撑满 */
.av-t{font-weight:800;color:var(--ink2);line-height:1;user-select:none}
.av-xs{width:15px;height:15px}      .av-xs .av-t{font-size:8px}
.av-sm{width:22px;height:22px}      .av-sm .av-t{font-size:11px}
.av-md{width:40px;height:40px}      .av-md .av-t{font-size:17px}
.av-lg{width:72px;height:72px}      .av-lg .av-t{font-size:30px}
/* 花名册的名字列（.name-wrap）在上面已经定义过了，头像直接塞进去就行，别再定义一遍 */
/* 顶栏 */
#meBox .av{margin-right:2px}
/* 换头像那块 */
.av-edit{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.av-edit .av{cursor:pointer;transition:.15s}
.av-edit .av:hover{box-shadow:inset 0 0 0 2px var(--purple)}
.av-hint{font-size:11px;color:var(--ink3);line-height:1.6}

/* 日历图例：七档全列出来。条上已经不写「训」「补」了，颜色是唯一的身份标识 —— 图例是必需的。
   实心 / 淡底 照实画，让人看得出「不夜仙的事」和「外面的事」是两组。 */
.cal-legend{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.lg-ev{font-size:10.5px;font-weight:600;padding:2px 8px;border-radius:5px;white-space:nowrap}

/* 会议标签：三组勾选（范围 / 职业 / 内容），勾了自动拼标题 */
.meet-wrap{margin:10px 0 2px;padding:10px;border:1px dashed var(--line);border-radius:10px;background:var(--bg2)}
.mt-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-bottom:6px}
.mt-l{font-size:11px;color:var(--ink3);width:30px;flex:0 0 30px}
.mt-t{font-size:11.5px;padding:3px 9px;border-radius:7px;cursor:pointer;transition:.12s;
  border:1.5px solid var(--line2);background:var(--bg);color:var(--ink2);font-weight:600}
.mt-t:hover{border-color:var(--purple)}
.mt-t.on{background:var(--purple);border-color:var(--purple);color:#fff}

/* ============================================================
   数据分析 · 单场拆解 —— 照《约战数据分析》xlsm 的浅色表格样式，
   整块自成一体（.da 作用域），不受库洛米深色主题影响（跟成品排表一样发微信也好看）。
   ============================================================ */
.da{background:#eef2f8;color:#1e293b;border-radius:14px;padding:15px;font-family:var(--sans);margin-top:4px}
.da select{font-size:12.5px;background:#fff;color:#1e293b;border:1px solid #ccd6e6;border-radius:9px;padding:6px 11px}
.da-panel{background:#fff;border:1px solid #e2e8f2;border-radius:13px;margin-bottom:14px;overflow:hidden;box-shadow:0 1px 3px rgba(30,41,59,.05)}
.da-ph{display:flex;align-items:center;gap:9px;padding:11px 15px;border-bottom:1px solid #edf1f7}
.da-ph b{font-size:14px;font-weight:800;color:#1e293b}
.da-ph .sub{font-size:11.5px;color:#94a3b8}
.da-ph .sp{flex:1}
.da-ph .fold{font-size:12px;color:#3f6fb5;font-weight:700;cursor:pointer;user-select:none}
.da-pb{padding:13px 15px}
.da-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:11px}
.da-card{border:1px solid #e6ebf3;border-radius:11px;padding:10px 13px;background:linear-gradient(180deg,#fff,#f7f9fd);transition:.12s}
.da-card:hover{border-color:#c9d6ea;box-shadow:0 2px 8px rgba(63,111,181,.1)}
.da-card .k{font-size:10.5px;color:#94a3b8;font-weight:700;letter-spacing:.3px}
.da-card .who{font-size:15px;font-weight:800;margin:3px 0;color:#1e293b}
.da-card .mt{display:flex;justify-content:space-between;align-items:baseline;gap:6px}
.da-card .val{font-family:var(--mono);font-size:13px;font-weight:800;color:#d64548}
/* 流派胶囊：颜色 + 淡底/描边由 daPf() 内联给（跟职业胶囊同一套色），这里只管尺寸 */
.da-pf{font-size:10.5px;border-radius:999px;padding:1px 8px;font-weight:700;white-space:nowrap}
/* 明细内容的维度切页签（浅色区，小号胶囊） */
.da-dtabs{display:flex;gap:6px;flex-wrap:wrap}
.da-dtab{font-size:11.5px;font-weight:700;padding:4px 12px;border-radius:999px;cursor:pointer;transition:.12s;
  color:#5b6473;background:#eef1f6;border:1px solid #dbe1ec}
.da-dtab:hover{background:#e2e8f4}
.da-dtab.on{color:#fff;background:#3f6fb5;border-color:#3f6fb5}
/* 一键折叠/展开全部小队：跟维度页签分开一点，白底更像个动作按钮 */
.da-dtab.dg-all{margin-left:12px;color:#3f6fb5;background:#fff;border-color:#c3d0e6}
.da-dtab.dg-all:hover{background:#eef3fb}
/* 明细表不做小滚动框（一次只看 2 队太挤）—— 整张铺开随页面滚，每队自带一行列标题。
   全部居中对齐，看着不累。 */
.da-tw{overflow-x:auto;border:1px solid #e2e8f2;border-radius:12px;box-shadow:0 1px 3px rgba(30,41,59,.06)}
.da table{width:100%;border-collapse:separate;border-spacing:0;font-size:12px}
/* 列标题：清楚的蓝（跟合计的浅灰拉开距离，别混）—— 强色留给进攻/防守分隔条 */
.da th,.da tr.colhdr td{background:#d3ddf0;color:#2c4a7c;font-weight:700;padding:9px 11px;
  white-space:nowrap;font-size:11px;letter-spacing:.2px;text-align:center;font-family:var(--sans);border-bottom:1px solid #bccbe8}
/* 列标题第一格：队名（进攻1团1队），居中、加重 */
.da tr.colhdr td.hdr-team{font-size:12.5px;font-weight:800;color:#1e3a63;letter-spacing:.3px}
/* 折叠：点小队标题行收起/展开这队的人（合计留着，方便对比） */
.da tr.dg-hdr{cursor:pointer}
.da tr.dg-hdr:hover td{background:#c6d4ee}
.da .dg-caret{display:inline-block;width:15px;color:#4a6aa0;font-size:10px;vertical-align:1px}
.da td{padding:7px 11px;text-align:center;white-space:nowrap;border-bottom:1px solid #eef2f7;
  font-family:var(--mono);font-variant-numeric:tabular-nums;color:#334155}
.da td.l{font-family:var(--sans);font-weight:600;color:#1e293b}
/* #13：未排表行可点，加成补人 */
.da td.l.da-addsub{cursor:pointer}
.da td.l.da-addsub .das-plus{margin-left:6px;font-size:10px;font-weight:800;color:#c07a1a;background:#f6e2bf;border-radius:5px;padding:1px 6px;opacity:0;transition:opacity .12s}
.da td.l.da-addsub:hover{color:#c07a1a}
.da td.l.da-addsub:hover .das-plus{opacity:1}
.da tbody tr:not(.colhdr):not(.section):not(.sum):not(.avg):hover td{background:#f2f7fe}
/* 进攻=薄荷绿 / 防守=蜂蜜琥珀 分隔条（#22 重调）：柔底竖向微渐变 + 清爽上下描边 + 同色字 */
.da tr.section td{text-align:center;font-weight:800;font-size:13px;letter-spacing:5px;text-indent:5px;padding:9px 10px}
.da tr.section.atk td{background:linear-gradient(#effaf3,#e2f4ea);color:#0f7a45;
  box-shadow:inset 0 2px 0 #9ed7b9,inset 0 -2px 0 #9ed7b9}
.da tr.section.def td{background:linear-gradient(#fdf7e6,#faefd2);color:#96690f;
  box-shadow:inset 0 2px 0 #e6cf8b,inset 0 -2px 0 #e6cf8b}
/* 合计：中性浅灰（跟蓝色列标题明显不一样），顶部细线分隔；人均更淡 */
.da tr.sum td{background:#f0f1f4;color:#3f4a5a;font-weight:800;border-top:2px solid #c9d0dc;border-bottom-color:#e3e7ee}
.da tr.avg td{background:#f7f8fa;color:#7a8494;font-weight:700}
/* 数据条：柔和圆角，长度从左表示大小 */
.da .cbar{display:flex;align-items:center;justify-content:center;border-radius:5px;padding:2px 7px;min-height:20px}
.da-mac{display:flex;flex-direction:column;gap:8px}
.da-mrow{display:grid;grid-template-columns:72px 1fr 96px 1fr 72px;align-items:center;gap:7px}
.da-mrow .n{font-family:var(--mono);font-size:12px;font-variant-numeric:tabular-nums}
.da-mrow .n.l{text-align:right}.da-mrow .win{font-weight:800}
.da-mrow .lab{text-align:center;font-size:11.5px;color:#5b6473;font-weight:600}
.da-mbar{height:11px;border-radius:6px;background:#eef1f6;display:flex;overflow:hidden}
.da-mbar.l{justify-content:flex-end}.da-mbar i{display:block;height:100%}
.da-mbar.l i{background:linear-gradient(90deg,#4472c477,#4472c4)}
.da-mbar.r i{background:linear-gradient(90deg,#e15759,#e1575977)}
.da-mhead{display:grid;grid-template-columns:1fr 96px 1fr;margin-bottom:2px;font-weight:800;font-size:12.5px}
.da-mhead .l{text-align:right;color:#4472c4}.da-mhead .r{color:#e15759}.da-mhead .c{text-align:center;font-size:11px;color:#94a0b3}
.da-note{font-size:11.5px;color:#94a0b3;margin-top:9px;line-height:1.6}

/* 二职修改记录（编辑成员弹窗里） */
.p2log{display:flex;flex-direction:column;gap:5px;max-height:150px;overflow:auto}
.p2log-row{display:flex;align-items:center;gap:7px;font-size:12px}
.p2log-f,.p2log-t{font-size:11px;font-weight:700;border-radius:999px;padding:1px 8px}
.p2log-a{color:var(--ink3)}
.p2log-m{color:var(--ink3);font-size:11px;margin-left:auto;font-family:var(--mono)}
/* 曾用名记录的来源标（#5）：改名审核=紫，约战=绿 */
.al-src{font-size:10px;font-weight:800;border-radius:5px;padding:1px 6px;white-space:nowrap}
.al-src.rn{color:var(--purple);background:color-mix(in srgb,var(--purple) 15%,transparent)}
.al-src.yz{color:var(--jade);background:color-mix(in srgb,var(--jade) 16%,transparent)}

/* BO 标签旁的开打时间（时:分，从文件名） */
.bo-time{font-size:10.5px;color:var(--ink3);font-family:var(--mono);margin-left:6px;white-space:nowrap}
/* 「已传数据」标记：日历弹窗/近期安排里，一眼看到这个活动传过几把 */
.data-tag{font-size:10.5px;font-weight:700;margin-left:8px;padding:1px 7px;border-radius:999px;white-space:nowrap;
  color:var(--jade);background:color-mix(in srgb,var(--jade) 14%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--jade) 34%,transparent)}
/* 日历弹窗里的「对战数据」清单：每把一枚胶囊（BO + 时间 + 原文件名） */
.dm-matchlist{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ml-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;font-size:11.5px;padding:2px 8px;border-radius:999px;
  background:color-mix(in srgb,var(--jade) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--jade) 28%,transparent)}
.ml-bo{color:var(--jade);font-weight:700}
.ml-t{color:var(--ink3);font-family:var(--mono);font-size:11px}
.ml-f{color:var(--ink2);font-family:var(--mono);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px}
/* 胶囊上的删除 ×（管理/本人才显示）—— 传错了直接在这儿删 */
.ml-x{margin-left:2px;width:15px;height:15px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;font-size:12px;line-height:1;cursor:pointer;color:var(--ink3)}
.ml-x:hover{color:var(--red);background:color-mix(in srgb,var(--red) 16%,transparent)}
/* 排表「请假名单」块头上的「＋加人」 */
.lh-add{margin-left:auto;font-size:11px;font-weight:700;color:var(--purple);cursor:pointer;padding:1px 7px;
  border-radius:999px;background:color-mix(in srgb,var(--purple) 12%,transparent)}
.lh-add:hover{background:color-mix(in srgb,var(--purple) 22%,transparent)}
/* 改游戏名（花名册名字格） */
.rename-btn{margin-left:7px;font-size:10.5px;font-weight:700;color:var(--purple);cursor:pointer;padding:0 6px;
  border-radius:999px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--purple) 34%,transparent)}
.rename-btn:hover{background:color-mix(in srgb,var(--purple) 14%,transparent)}
.rn-pend{margin-left:7px;font-size:10.5px;font-weight:700;color:var(--gold);padding:0 6px;border-radius:999px;
  background:color-mix(in srgb,var(--gold) 14%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gold) 34%,transparent)}
.rn-ok,.rn-no{margin-left:5px;font-size:10.5px;font-weight:700;cursor:pointer;padding:0 7px;border-radius:999px}
.rn-ok{color:var(--jade);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--jade) 40%,transparent)}
.rn-ok:hover{background:color-mix(in srgb,var(--jade) 16%,transparent)}
.rn-no{color:var(--red);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--red) 38%,transparent)}
.rn-no:hover{background:color-mix(in srgb,var(--red) 14%,transparent)}
.rn-banner{margin:10px 14px 0;padding:8px 12px;border-radius:10px;font-size:12.5px;
  color:var(--gold);background:color-mix(in srgb,var(--gold) 10%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gold) 30%,transparent)}
.rn-banner .muted{color:var(--ink2)}

/* ============================================================
   手机端体验优化（≤640px）—— 很多帮众在手机上用这个页面。
   放在文件最末尾，覆盖前面所有主题值。
   ============================================================ */
@media (max-width:640px){
  /* —— 顶栏瘦身：印章/标题缩小、减上边距，别让导航吃掉半屏 —— */
  .topinner{padding:9px 12px;gap:9px}
  .sealmark{width:42px;height:42px;font-size:21px;border-radius:12px;flex:0 0 auto}
  .title{min-width:0}
  .title h1{font-size:18px;letter-spacing:1px;white-space:nowrap}   /* 「不夜仙」别换行 */
  .hbtns{gap:6px}
  .admin-toggle{padding:4px 8px;font-size:11px;gap:5px}
  #btnBackup{padding:5px 9px;font-size:12px}
  .me-box{font-size:11px}
  /* 主页签：一行横向滑，不再堆成两排 */
  nav.tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:5px}
  nav.tabs::-webkit-scrollbar{display:none}
  .tab{white-space:nowrap;flex:0 0 auto;padding:8px 12px}
  /* 子页签：同样一行横向滑 */
  .subbar{padding:0 12px;overflow-x:auto;scrollbar-width:none}
  .subbar::-webkit-scrollbar{display:none}
  .subtabs{flex-wrap:nowrap}
  /* —— 内容区 / 面板：减内边距和圆角，屏幕就这么点宽 —— */
  .wrap{padding:0 10px 60px}
  .panel-h{padding:12px;gap:8px}
  .panel-b{padding:12px}
  .panel-h h2{font-size:17px}
  .notice-bar{margin:12px 10px -2px;padding:8px 12px}
  /* 筛选行：太窄就单列铺，别硬挤两列留大缝 */
  .row{gap:8px}
  .row>*{min-width:120px}
  /* 花名册：搜索占满一行 + 「筛选」折叠钮；筛选/职业统计默认收起，点开才展开 —— 手机上多露几行成员 */
  .mem-h{gap:8px}
  .mem-h .spacer{display:none}
  .mem-search{max-width:none;flex:1 1 140px}
  .mem-h .mem-ftoggle{display:inline-flex;flex:0 0 auto}
  .mem-h .mem-tools{display:none}
  .mem-h.open .mem-tools{display:flex;flex-wrap:wrap;gap:8px;flex-basis:100%;order:10;margin-top:4px;align-items:center}
  .mem-h.open .mem-tools .s,.mem-h.open .mem-tools .btn{flex:1 1 44%}
  .mem-h.open .prof-counts{flex-basis:100%;margin-top:2px}
  /* —— 弹窗：贴边、少留白，底部留手指位 —— */
  .overlay{padding:10px 8px 28px;align-items:flex-start}
  .modal{max-width:100%;border-radius:14px}
  .modal-b{padding:14px;max-height:78vh}
  .modal-h{padding:14px 14px 0}
  .modal-h h3{font-size:18px}
  .modal-f{padding:12px 14px}
  /* —— 日历：7 列硬压进屏。minmax(0,1fr) 治「1fr 轨道被长事件文字撑爆」（跟 squad-grid 同一个坑）。
     格子变矮、事件只留第一行并截断；详情去下面「近期安排」或点开当天看 —— */
  .cal-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
  .cal-cell{min-height:50px;padding:3px;border-radius:6px;min-width:0}
  .cal-dow{font-size:9px;letter-spacing:0;padding:3px 0}
  .ev{font-size:8.5px;padding:1px 3px;line-height:1.25}
  .ev-l2{display:none}
  .cal-legend{gap:6px;font-size:11px}
  /* —— 表格（花名册/查号/对战记录）：横向滚动 + 压紧字号内边距，让更多列露出来 —— */
  table.tb th,table.tb td{padding:7px 8px;font-size:12px}
  /* 活动卡片头部：操作按钮整组换到下一行，标题保持整行、太长就截断（别竖排） */
  .dm-head{gap:7px}
  .dm-head .name{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dm-acts{flex-basis:100%;margin-left:0;margin-top:2px}
  /* 报名/缺额等块里的行也允许换行 */
  .dm-rec,.dm-leave{flex-wrap:wrap}
  /* —— 触摸目标：按钮别太小，手指点得中 —— */
  .btn{padding:9px 14px}
  .btn.sm{padding:7px 11px;font-size:12px}
  input.i,select.s,textarea.t{font-size:16px}   /* iOS ≥16px 才不会自动放大页面 */
}
/* 更窄（≤430px）：排表小队单列，别横向溢出 */
@media (max-width:430px){
  .squad-grid{grid-template-columns:1fr}
}